# How to Design and Use Components in 3D - Spline Academy (https://spline.design/academy/tutorials/how-to-design-and-use-components-in-3d)

> Hello! In this tutorial, you will learn how components work and how they can make your design faster and more efficient in 3D.

1. [Academy](https://spline.design/academy)
2. [Tutorials](https://spline.design/academy/tutorials)
3. How to Design and Use Components in 3D

# How to Design and Use Components in 3D

Spline 3DIntermediate15 min

Hello! In this tutorial, you will learn how components work and how they can make your design faster and more efficient in 3D.

You can find the scene files from this tutorial in the Library (<https://app.spline.design/library>)

11: 34 Detaching instances

## What you’ll learn

1. [0:00Intro](https://www.youtube.com/watch?v=VSddFnDjPUA&t=0s)
2. [0:43Creating a component instance](https://www.youtube.com/watch?v=VSddFnDjPUA&t=43s)
3. [2:24Instance overrides](https://www.youtube.com/watch?v=VSddFnDjPUA&t=144s)
4. [4:35Creating design alternatives](https://www.youtube.com/watch?v=VSddFnDjPUA&t=275s)
5. [5:54Adding events to components](https://www.youtube.com/watch?v=VSddFnDjPUA&t=354s)
6. [7:00Overriding interactions](https://www.youtube.com/watch?v=VSddFnDjPUA&t=420s)
7. [9:06Clever uses of 3D components](https://www.youtube.com/watch?v=VSddFnDjPUA&t=546s)
8. [10:18Design systems with components](https://www.youtube.com/watch?v=VSddFnDjPUA&t=618s)
9. [10:47Instance swapping](https://www.youtube.com/watch?v=VSddFnDjPUA&t=647s)
10. [12:06Reset overrides](https://www.youtube.com/watch?v=VSddFnDjPUA&t=726s)
11. [13:11Cloner and instances](https://www.youtube.com/watch?v=VSddFnDjPUA&t=791s)
12. [14:20Outro](https://www.youtube.com/watch?v=VSddFnDjPUA&t=860s)

## Related resources

- [Component ToggleTemplate](https://app.spline.design/academy/tutorials/how-to-design-and-use-components-in-3d?redirect-duplicate-template-uuid=a1664528-244c-463a-bdd2-c38500f46caa&is-2d-file=false)
- [ComponentsDocument](https://docs.spline.design/designing-in-3-d/components)
- [Materials & ShadingDocument](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)

## Overview

- Spline 3D
- 15 min
- Intermediate

## Part of

- [Spline Advanced | Feature Deep Dive](https://spline.design/academy/collections/spline-advanced-feature-deep-dive/how-to-design-and-use-components-in-3d)

## Related tutorials

[All tutorials](https://spline.design/academy/tutorials)

[How to Build Reusable 3D ComponentsSpline 3DIntermediate7 min](https://spline.design/academy/tutorials/how-to-build-reusable-3d-components)[Explore 3D Shape Blending in SplineSpline 3DBeginner26 min](https://spline.design/academy/tutorials/explore-3d-shape-blending-in-spline)[Shape Interactive 3D Fluid Shapes That Follow the CursorSpline 3DBeginner12 min](https://spline.design/academy/tutorials/shape-interactive-3d-fluid-shapes-that-follow-the-cursor)

[Spline](https://spline.design/)

The 3D and 2D editor for teams and their agents. Ship to the web, iOS and Android.

#### Ask AI about Spline

#### Products

- [3D Design](https://spline.design/3d-design)
- [Hana](https://spline.design/hana)
- [Omma](https://omma.build)
- [AI 3D Generation](https://spline.design/ai-generate)
- [Spline MCP](https://spline.design/mcp)
- [Pricing](https://spline.design/pricing)
- [Enterprise](https://spline.design/enterprise)

#### Runtimes

- [Web](https://spline.design/web)
- [iOS](https://spline.design/ios)
- [Android](https://spline.design/android)

#### Apps

- [Download](https://spline.design/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Download Spline Mirror](https://spline.design/download-mirror)

#### Learn

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Solutions](https://spline.design/solutions)

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/blog)
- [Changelog](https://spline.design/changelog)
- [Education](https://spline.design/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/affiliate)

#### Company

- [Customers](https://spline.design/customers)
- [Careers](https://www.ycombinator.com/companies/spline/jobs)
- [Security](https://spline.design/security)

#### Legal

- [Terms & Conditions](https://spline.design/terms)
- [Privacy](https://spline.design/privacy)

#### Contact

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.