As a 2D design environment, Figma doesn't natively support the import of 3D model files like glTF, GLB, or OBJ directly onto your canvas. You can create depth effects with shadows and gradients, but bringing actual 3D assets into your workflow requires a different approach.
In this post, we’ll explore a quick and easy way to import 3D models, rotate them to the perfect angle, and capture them on your Figma canvas thanks to the new plugin 3d.to.design.
Import 3D assets into Figma - Quick Guide
- Open Figma and run the 3d.to.design plugin
- Upload your 3D model file (glTF, GLB, or OBJ format)
- Rotate and pan the model to your desired viewing angle
- Import the rendered view directly to your canvas
- Re-select the layer anytime to adjust the angle and re-import
Understanding 3D model file formats
Before importing 3D models into Figma, let’s cover the three main file formats supported: glTF, GLB, and OBJ.
glTF (.gltf) is the Graphics Library Transmission Format developed by the Khronos Group. The format uses JSON/ASCII structure with external files for textures and binary data. glTF files support geometry, materials, textures, animations, and scene hierarchies. This format is often called "the JPEG of 3D" because it balances quality with efficient file transmission.
GLB (.glb) is the binary version of glTF. All data—geometry, textures, materials—packages into a single binary file. GLB files are smaller and faster to load than glTF files. Most web-based 3D applications prefer GLB because the single-file structure simplifies asset management.
OBJ (.obj) is a widely used, open-standard, text-based format for storing 3D geometry, including vertex positions, texture coordinates, and polygonal faces. The format often pairs with MTL (Material Template Library) files for surface materials. OBJ files have limited support for modern features like animations or physically-based rendering, but remain widely compatible across 3D software.
How to import 3D models into Figma: step by step
The plugin renders your 3D model at the viewing angle you specify and converts it into a 2D image layer on your Figma canvas. This rendered layer works like any other image in Figma—you can scale it, apply blend modes, add shadows, or integrate it into frames and components. Here’s how it works, step by step:
Step 1: Run 3d.to.design
Go to Plugins in Figma's menu, search for "3d.to.design" and run it in your Figma file. The plugin interface loads with sample models you can test immediately.
Step 2: Load your 3D model
Click the upload area or drag your 3D model file into the plugin window. The plugin accepts glTF (.gltf), GLB (.glb), and OBJ (.obj) files. Your model appears in the 3D viewport within seconds.
If you don't have a 3D model ready, use one of the sample models included with the plugin to learn the workflow.
Step 3: Rotate and position the model
Drag anywhere on the viewport to rotate your model. Hold Command (Mac) or Control (Windows) and drag to pan the view. Position your model at the exact angle you need for your design.
The viewport updates in real-time as you adjust the rotation and position. You can zoom in or out to frame your model precisely.
Step 4: Use your 3D model in Figma!
The plugin captures your 3D model at the exact angle you've set and places it as an image layer on your canvas. The layer maintains full editability in Figma—resize it, apply effects, adjust opacity, or combine it with other design elements.
Step 5: Re-edit imported models
Select any layer imported from 3d.to.design and reopen the plugin. The plugin automatically reloads your model with the same view settings. Adjust the angle, then import again to update the layer. You don't need to start from scratch or re-upload your file.
Why import 3D models into Figma?
Visualize products in context
Designers often need to show physical products in realistic contexts. Import your 3D product model, rotate it to show the most important features, and place it directly into your UI mockups or marketing materials. Clients see exactly how the product looks without building physical prototypes.
Create device mockups
Device mockups show your app or web designs on phones, tablets, or laptops. Import a 3D device model, angle it for the best presentation view, and drop your screen designs onto it. The 3D perspective makes presentations more engaging than flat mockups.
Design with spatial elements
UI designs increasingly incorporate 3D elements—icons, illustrations, or decorative objects. Import 3D assets, capture them from multiple angles, and use them as interface elements. This approach gives you complete control over lighting and perspective without leaving Figma.
Speed up asset creation
Rotating a 3D model and capturing different angles takes seconds. Creating multiple views of the same object manually would require either multiple 3D renders exported from external software or complex illustration work. The plugin eliminates the export-import cycle.
Work with team assets
Design teams often have 3D asset libraries created in tools like Blender, Cinema 4D, or downloaded from asset marketplaces. Convert these assets to glTF or GLB format, then import them directly into Figma. Your entire team can access and use 3D assets without learning 3D software.
Use cases for 3D models in Figma
E-commerce product pages: Import product models to create multiple product views for online stores. Show products from front, side, and top angles without photography or manual rendering.
App store screenshots: Place your app interface on 3D device models. Create promotional screenshots that show your app in realistic phone or tablet mockups with perspective and depth.
Presentation decks: Add 3D visualizations to pitch decks or design presentations. Product mockups, architectural visualizations, or abstract 3D shapes make slides more dynamic and professional.
Marketing materials: Use 3D product renders in social media posts, advertisements, or landing pages. Import the model once, then capture it from different angles for various marketing channels.
Packaging design: Import 3D package models to visualize labels, graphics, and branding on boxes, bottles, or containers. Rotate the package to show how designs wrap around all sides.
Tips for best results
✅ Export your 3D models at reasonable polygon counts. Extremely high-resolution models may load slowly in the plugin viewport. For design mockups, models with 10,000-50,000 polygons typically work well.
✅ Set up lighting and materials in your 3D software before export. The plugin renders models using their embedded materials and textures. Well-prepared models look better immediately after import.
✅ Use GLB format when possible. The single-file structure prevents issues with missing textures or broken file paths. GLB files are also smaller and faster to load.
✅ Import models at the largest size you'll need. You can scale down in Figma without quality loss, but scaling up may reveal pixelation. If you need a model at multiple sizes, import it once at the largest size, then duplicate and scale down as needed.
Start importing your 3D assets into Figma!
Figma doesn't natively support 3D model imports, but 3d.to.design solves this limitation. The plugin brings glTF, GLB, and OBJ files into your design workflow without external rendering or complex exports.
Run the plugin, upload your 3D models, and capture them at any angle you need. It’s fast, straightforward, and keeps everything inside Figma.
Try 3d.to.design on your next project. Whether you're designing product mockups, creating device frames, or adding 3D elements to your interfaces, the plugin gives you direct access to 3D assets without leaving your design environment.
For more ways to bring different file types into Figma, explore our complete plugin collection at anything.to.design, where you'll find tools to import PDFs, images, HTML, and over 30 other file formats.
FAQ
What is a quick way to import3D models into Figma?
Figma doesn’t natively support 3D model files like glTF, GLB, or OBJ. However, the plugin 3d.to.design is a quick and direct way to render and import 3D models into Figma as 2D image layers.
What file formats does 3d.to.design support?
The plugin supports glTF (.gltf), GLB (.glb), and OBJ (.obj) file formats. GLB is recommended for the simplest workflow since it packages all model data into a single file.
Can I edit the 3D model after importing it?
You can re-select any imported layer and reopen the plugin to adjust the viewing angle and re-import. The plugin remembers your previous settings for each layer. The imported layer itself is a 2D image, but you can adjust rotation and re-import as many times as needed.