Skip to main content
Spline Documentation home page
Search...
⌘K
Tutorials
Community
Open App
Open App
Search...
Navigation
🧶 Integrations
Integrating with Shopify
👉 Getting started
🌳 Basics
What is Spline?
How is Spline different?
Creating your first scene
Understanding Spline's UI
Change theme on Spline
FAQ
Keyboard shortcuts
Play Mode
Community Platform
Download Spline for Desktop
Watch intro tutorials
Pricing
Spline for Enterprise
🗂 Sharing, Collaboration, and Workspaces
Files View
Workspaces
File Sharing
Real-time Collaboration in 3D
Comments & Feedback in 3D
Team Libraries
🍭 Designing in 3D
Working with 2D and 3D objects
Extruding 2D objects in 3D
Working with Parametric Objects
Moving the Object Pivot
Boolean Operations
Timeline Animation [Beta]
Cloner Motion
Working with Text
Pen Tool
Shape Blend
3D Modeling Tools
3D Sculpting
UI Scenes
Particles
3D Gaussian Splatting
3D Library
Components
Physics
3D Paths
Version History
Multi-Scenes
🌸 Hana - a canvas for interactivity
What is Hana?
Designing in Hana
Interactivity in Hana
3D Shapes in Hana
Effects in Hana
AI in Hana
Importing Assets to Hana
Exporting in Hana
Pages in Hana
Frame as Fill 3D Meshes
✨ Spline AI
Spell AI 3D Worlds
AI 3D Generation
AI Textures
AI Style Transfer
🕹️ Interaction (States, Events, and Actions)
How state-based animation works
Events & Interactivity
Animatable Properties
Mouse & Key Toggle Property
Variables
Real-time API
Webhooks
AI Text OpenAI API
AI Voice Assistant API
Input
Events
Actions
🎞 Exporting your scene
How to optimize your scene
Play Settings
Web
Apple Platform
Android
Files
💻 Importing Content
How to Import Content
Import Animated Objects
Morph Targets
CAD to Spline: Optimization Best Practices
🌈 Materials & Shading
Material Library
Creating Material Layers
Material, Color, and Image Assets
Lighting Layer
Color Layer
Image Layer
Video Layer
Depth Layer / 3D Gradient
Normal Layer
Gradient Layer
Noise Layer
Fresnel Layer
Rainbow Layer
Toon Layer
Outline Layer
Glass Layer
Matcap Layer
Displace Layer
Pattern Layer
Layer Masking
Bump Map & Roughness Map
💡 Lighting
Working with Lights
Directional Light
Point Light
Spot Light
Soft Shadows
📸 Cameras
Working with Cameras
Camera parameters
Effects (Post-Processing)
Depth of Field (DoF)
Working with Fog
🧶 Integrations
Integrating with Figma
Integrating with Framer
Integrating with Webflow
Integrating with Notion
Integrating with Shopify
Integrating with Play
Integrating with Wix
Integrating with Wix Studio
Integrating with Typedream
Integrating with Tome
Integrating with Toddle
Integrating with Instant.so
🥳 Fun Facts
The Bunny and Teapot Objects
Policies
Subscriptions and Renewal
On this page
Scene optimization
🧶 Integrations
Integrating with Shopify
Copy page
Copy page
You can use the
Spline Viewer
(
Exporting as Spline Viewer
) export to embed 3d scenes from Spline using Shopify’s Custom Liquid feature.
Export your scene using the Spline Viewer option.
Copy with the embed code.
Open your Shopify site editor.
Create a new “Custom Liquid” theme section.
Paste the embed code in the text input for the Custom Liquid.
That’s it! Here is a video of the process:
Scene optimization
Learn to optimize your scene to make sure your scene loads quickly and runs efficiently on all sorts of devices.
How to optimize your scene
Integrating with Notion
Integrating with Play
⌘I