Designer’s Guide

3D Graphics

3D graphics are not supported natively by Figma but you can integrate 3D models and animations into your published website.

Spline

Spline is a web-based 3D modeler.

Use
custom HTML to load your Spline model in a frame by naming the layer as the Spline viewer component:
<spline-viewer url="https://prod.spline.design/UWoeqiir20o49Dah/scene.splinecode">
You can get the spline-viewer URL in Spline by clicking the [Export] button and selecting the “Viewer” tab.
image 22
When the <spline-viewer> Web Component is detected on the page, figma.to.website will automatically add the JavaScript code required to run the model in the page. You don’t need to manually add any <script> tag to load the JavaScript required for <spline-viewer>.
Demo Inspect in Figma and on the web
Made
with