Mobile: Single Model Embed

Embed a specific interactive 3D model anywhere in your mobile app using a WebView component.

How to Embed a Single Model

Go to your Portfolio, find the model you want to embed, and click on it.
In the preview dialog, click the <> (Embed) icon and copy the embed code.
Extract the URL from the \`src\` attribute of the iframe. It will look like \`https://embed.dezyn.app/v1?uid=...&model_id=...\`.
In your app, use a WebView component to load this URL. You can wrap the WebView in a container (like a \`SizedBox\` in Flutter) to control its size.

Example (Flutter)

This example uses the \`webview_flutter\` package.


import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class Dezyn3DViewer extends StatelessWidget {
  final String embedUrl;
  final double width;
  final double height;

  const Dezyn3DViewer({
    Key? key,
    required this.embedUrl,
    this.width = 300, // Default width
    this.height = 400, // Default height
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final controller = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..loadRequest(Uri.parse(embedUrl));

    // Use a SizedBox to control the dimensions of the WebView
    return SizedBox(
      width: width,
      height: height,
      child: WebViewWidget(controller: controller),
    );
  }
}

// How to use it:
// Dezyn3DViewer(
//   embedUrl: 'https://embed.dezyn.app/v1?uid=YOUR_USER_ID&model_id=YOUR_MODEL_ID',
//   width: MediaQuery.of(context).size.width, // Example: full screen width
//   height: 500, 
// )

Need a different language?

The logic is the same for any native framework (SwiftUI, Jetpack Compose, React Native, etc.). Use a WebView component and load the URL. You can ask an AI assistant (like ChatGPT, Gemini, or Claude) to convert the example to your preferred language.