Layers 3D

About this plugin

The Layers 3D plugin allows you to get 3D assets of your Figma UI designs.

3D meshes are exported as GLTF files.

📚 Tutorials

1. From Figma to Blender: Enhance your UI designs with 3D renders.

🎬 Getting Started

To start generating meshes for your Figma designs:

1. Select a node from Figma’s view port or layers panel.
2. Left click on the selected node to open the context menu. Go to Plugins > Layers 3D.
3. The plugin window will pop-up and a loader shown while generating the mesh.
4. Once loaded you should see the 3D mesh rendered on screen.

🎮 Controls

Pan

Mac: ⌘ + Right Click + Drag or Shift + Right Click + Drag

Windows: Shift + Right Click + Drag

Orbit

Mac: Right Click + Drag

Windows: Right Click + Drag

Zoom

Mac: Mouse Scroll

Windows: Mouse Scroll

🛟 FAQ

Loader is displayed for a long time

The speed of mesh generation depends on the complexity of the selected node and your computer's performance, since it happens locally.

In some cases, the generation may take up to several minutes.

Loading is done but I don’t see the 3D Mesh

1. Ensure you’ve actually selected a node. If a node is not selected the scene will be empty.
2. Try zooming out and orbiting the scene (check controls table above). Your mesh might be small or offset from the camera’s initial position.
3. Tried the above and still can’t see the mesh? Send an email to [email protected] with details of your selection.

Current Limitations:

1. Only supports Google Fonts.
2. Works with one node at a time i.e. a single node selection from Figma's view port.