The third dimension in Figma is finally here: Vectary 3D plugin

Vectary is often called “Figma for 3D design”. Imagine how awesome would it be if you could manipulate and place photorealistic 3D objects in Figma with any view and perspective you like. The dream is becoming a reality today! Vectary is bringing customizable and interactive 3D elements and mockups right into your design process.

Control photorealistic 3D elements in Figma with Vectary

Vectary 3D plugin for Figma is here to add the missing third dimension to your 2D designs. Set your desired perspective in the actual 3D viewport and place it into the scene with one click. The plugin lets you place pre-defined 3D elements into your design, load a custom 3D object, or place your Figma design into predefined 3D mockups such as mobile devices, desktops, or soda cans.

Create 3D design systems in Figma

This way, a whole 3D design system can be made in Figma. Say you are using a 3D element as a part of your brand identity, or you have a product in 3D - just create a link in Vectary and let your designers decide which perspective works best for them during the creative process.

How to use Vectary 3D plugin for Figma

To place your Figma design into mockups:

1. Open Vectary 3D Elements plugin in Figma.
2. Choose a 3D mockup or element
3. Select your Figma frame.
4. Click the “Load frame” button to replace the existing content with your design - it could be a screen of a mobile device, depending on the mockup you selected. You can customize every part of the object in the Material Settings.
5. Customize the mockup perspective: using left click, drag to rotate the mockup or scroll to zoom in.
6. Click on “Export image” to add a render with a transparent background to your project.

To load any custom 3D object or element

1. Open www.vectary.com, create your 3D object from scratch, import a 3D model, or use millions of assets in the Vectary library.
2. Go to the Publish tab and click on “Generate”.
3. Go back to Figma and open the Vectary 3D plugin.
4. Click on the Projects tab and login to your Vectary account.
5. Customize the 3D design perspective: using left click, drag to rotate the mockup or scroll to zoom in.
6. Click on “Export image” to add a screenshot with a transparent background to your project.

Pro tip: If you want to have a replaceable texture in your own Vectary model in Figma, name the object and its material as “_switchable” before generating the Viewer in Vectary.

Our 3D elements and mockup gallery will grow with time to give you plenty of ready-to-use 3D elements and mockups.

Please let us know what you like or miss in Vectary Figma plugin, just drop us a message, we’re eager to hear your feedback.

‍