# Skapa 3D-ikoner från grunden - Spline Academy (https://spline.design/sv/academy/tutorials/create-3d-icons-from-scratch)

> Hej! I den här tutorialen dyker vi ner i hur du skapar 3D-ikoner med Spline. Vi tar upp hur du gör om 2D-vektorer till 3D, använder pennverktyget samt…

1. [Academy](https://spline.design/sv/academy)
2. [Tutorials](https://spline.design/sv/academy/tutorials)
3. Skapa 3D-ikoner från grunden

# Skapa 3D-ikoner från grunden

Spline 3DNybörjare16 min

Hej! I den här tutorialen dyker vi ner i hur du skapar 3D-ikoner med Spline. Vi tar upp hur du gör om 2D-vektorer till 3D, använder pennverktyget samt importerar och konverterar SVG-filer. Tillsammans skapar vi en ikon från början till slut och lägger på material som ger en effekt av frostat glas. Vi utforskar också hur du gör ikoner interaktiva och använder dem i webb- eller appprojekt.

Nu sätter vi igång!

\---

Resurser här! 👋: 🏃 Här är en bra tutorial för att lära dig mer om att göra saker interaktiva i Spline: <https://www.youtube.com/watch?v=JPUSjRxQEKI&t=352s>

🏗️ Fler sätt att bygga i Spline: <https://www.youtube.com/watch?v=xc-ExwgYDQI>

💻 3D för din webbplats:

<https://www.youtube.com/watch?v=ncoSN9mgWe8&t=165s>

💖 3D för iOS-projekt:

<https://www.youtube.com/watch?v=44OPMq7FdD0&t=18s>

\--- 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 3D-ikoner](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=0s)
2. [0:21Gå från 2D till 3D](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=21s)
3. [1:00Använda pennverktyget och former](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=60s)
4. [2:31Importera och konvertera SVG-filer](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=151s)
5. [4:38Lägga till material för 3D-effekter](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=278s)
6. [14:04Lägg till en enkel interaktion på ikonen](https://www.youtube.com/watch?v=yfNvUjxcG7M&t=844s)

## Relaterade resurser

- [Message IconMall](https://app.spline.design/academy/tutorials/create-3d-icons-from-scratch?redirect-duplicate-template-uuid=806351b2-5c4c-4587-b4e1-eaeb698c5445&is-2d-file=false)
- [Pen ToolDokument](https://docs.spline.design/designing-in-3-d/pen-tool)
- [Extruding 2D objects in 3DDokument](https://docs.spline.design/designing-in-3-d/extruding-2d-objects-in-3-d)
- [Materials & ShadingDokument](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)

## Översikt

- Spline 3D
- 16 min
- Nybörjare

## Del av

- [Spline 101 | Bygg din första interaktiva scen](https://spline.design/sv/academy/collections/spline-101-build-your-first-interactive-scene/create-3d-icons-from-scratch)

## Relaterade tutorials

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

[Kom igång med 3D i SplineSpline 3DNybörjare26 min](https://spline.design/sv/academy/tutorials/get-started-with-3d-in-spline)[Så bäddar du in 3D-scener från Spline i ShopifySpline 3DNybörjare9 min](https://spline.design/sv/academy/tutorials/how-to-embed-3d-scenes-from-spline-into-shopify)[Så ställer du in API:er och webhooks i realtid för dina 3D-scenerSpline 3DAvancerad16 min](https://spline.design/sv/academy/tutorials/how-to-set-up-real-time-apis-and-webhooks-for-your-3d-scenes)

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