# How to Design and Use Components in 3D - Spline Advanced | Feature Deep Dive - 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. [Courses](https://spline.design/academy/collections)
3. [Spline Advanced | Feature Deep Dive](https://spline.design/academy/collections/spline-advanced-feature-deep-dive)
4. How to Design and Use Components in 3D

# How to Design and Use Components in 3D

Lesson 1 of 17Spline 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

## Up next

[How to Build Reusable 3D Components7 minIntermediate](https://spline.design/academy/collections/spline-advanced-feature-deep-dive/how-to-build-reusable-3d-components)[Continue](https://spline.design/academy/collections/spline-advanced-feature-deep-dive/how-to-build-reusable-3d-components)

[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.