# Så bygger du återanvändbara 3D-komponenter - Spline Advanced | Fördjupning i funktionerna - Spline Academy (https://spline.design/sv/academy/tutorials/how-to-build-reusable-3d-components)

> I den här tutorialen går vi igenom allt du behöver veta om komponenter i Spline och hur de kan förändra ditt designarbetsflöde!

1. [Academy](https://spline.design/sv/academy)
2. [Kurser](https://spline.design/sv/academy/collections)
3. [Spline Advanced | Fördjupning i funktionerna](https://spline.design/sv/academy/collections/spline-advanced-feature-deep-dive)
4. Så bygger du återanvändbara 3D-komponenter

# Så bygger du återanvändbara 3D-komponenter

Lektion 2 av 17Spline 3DMedelnivå7 min

I den här tutorialen går vi igenom allt du behöver veta om komponenter i Spline och hur de kan förändra ditt designarbetsflöde!

Du lär dig att skapa och hantera komponenter, koppla loss och anpassa instanser, skicka ändringar till huvudkomponenten och byta varianter.

Vi delar också praktiska tips och bästa praxis som hjälper dig att bygga effektiva och återanvändbara designsystem i Spline.

Läs mer om komponenter: <https://youtu.be/VSddFnDjPUA>

🎅💖 Remix med julspecial: <https://app.spline.design/file/400edc03-f028-46ef-874a-9529a290483c>

\--- Upptäck fler fantastiska kreatörer och projekt #MadeInSpline på <https://community.spline.design/>

## Det här lär du dig

1. [0:00Introduktion till komponenter](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=0s)
2. [0:54Skapa en komponent](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=54s)
3. [2:07Hantera instanser](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=127s)
4. [3:00Skicka ändringar och använda varianter](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=180s)
5. [4:26Praktiska tillämpningar](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=266s)
6. [5:45Bästa praxis](https://www.youtube.com/watch?v=eWuFrHiyyu0&t=345s)

## Relaterade resurser

- [Calculator ComponentsMall](https://app.spline.design/academy/tutorials/how-to-build-reusable-3d-components?redirect-duplicate-template-uuid=e35b4ba4-f15c-428a-a66e-6522a8e15617&is-2d-file=false)
- [ComponentsDokument](https://docs.spline.design/designing-in-3-d/components)

## Översikt

- Spline 3D
- 7 min
- Medelnivå

## Nästa

[Så bygger du en reaktiv 3D-sfär med rörelse och interaktion7 minMedelnivå](https://spline.design/sv/academy/collections/spline-advanced-feature-deep-dive/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)[Fortsätt](https://spline.design/sv/academy/collections/spline-advanced-feature-deep-dive/how-to-build-a-reactive-3d-orb-with-motion-and-interaction)

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

3D- och 2D-editorn för team och deras agenter. Publicera på webben, iOS och Android.

#### Fråga AI om Spline

#### Produkter

- [3D-design](https://spline.design/sv/3d-design)
- [Hana](https://spline.design/sv/hana)
- [Omma](https://omma.build)
- [3D-generering med AI](https://spline.design/sv/ai-generate)
- [Spline MCP](https://spline.design/sv/mcp)
- [Spline Arena](https://spline.design/sv/arena)
- [Priser](https://spline.design/sv/pricing)
- [Företag](https://spline.design/sv/enterprise)

#### Runtimes

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

#### Appar

- [Ladda ner](https://spline.design/sv/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Ladda ner Spline Mirror](https://spline.design/download-mirror)

#### Lär dig

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

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/sv/blog)
- [Ändringslogg](https://spline.design/sv/changelog)
- [Utbildning](https://spline.design/sv/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/sv/affiliate)

#### Företaget

- [Kunder](https://spline.design/sv/customers)
- [Karriär](https://www.ycombinator.com/companies/spline/jobs)
- [Säkerhet](https://spline.design/sv/security)

#### Juridik

- [Villkor](https://spline.design/terms)
- [Integritet](https://spline.design/privacy)

#### Kontakt

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

© 2026 - Spline, Inc.