# Create Animated 3D Blobs that React to Your Mouse - Spline Academy (https://spline.design/academy/tutorials/create-animated-3d-blobs-that-react-to-your-mouse)

> In this beginner-friendly tutorial, we’ll start from scratch and learn how to create colorful, animated, and interactive 3D blobs, using Shape Blend.

1. [Academy](https://spline.design/academy)
2. [Tutorials](https://spline.design/academy/tutorials)
3. Create Animated 3D Blobs that React to Your Mouse

# Create Animated 3D Blobs that React to Your Mouse

Spline 3DBeginner12 min

In this beginner-friendly tutorial, we’ll start from scratch and learn how to create colorful, animated, and interactive 3D blobs, using Shape Blend.

We’ll walk you through some easy tips for applying colors and textures to create smooth transitions and natural-looking gradients.

Plus, we’ll explore how to add interactive events, like changing the shape of the blob when you hover over it.

\--

Discover more amazing creators and projects #MadeInSpline at <https://community.spline.design/>

## What you’ll learn

1. [0:00Intro](https://www.youtube.com/watch?v=l32kDk5DU00&t=0s)
2. [0:24Creating a Blob with Shape Blend](https://www.youtube.com/watch?v=l32kDk5DU00&t=24s)
3. [1:31Adding Colors](https://www.youtube.com/watch?v=l32kDk5DU00&t=91s)
4. [3:21Adding Glow Effects and Textures](https://www.youtube.com/watch?v=l32kDk5DU00&t=201s)
5. [5:20Animating Our Blob](https://www.youtube.com/watch?v=l32kDk5DU00&t=320s)
6. [6:49How to Make the Animation Loop](https://www.youtube.com/watch?v=l32kDk5DU00&t=409s)
7. [8:32Interactive Effect with Cursor](https://www.youtube.com/watch?v=l32kDk5DU00&t=512s)
8. [9:44Quick Tips](https://www.youtube.com/watch?v=l32kDk5DU00&t=584s)
9. [10:38Other Examples of Interactive Scenes with Shape Blend](https://www.youtube.com/watch?v=l32kDk5DU00&t=638s)
10. [11:00Our Spline Community](https://www.youtube.com/watch?v=l32kDk5DU00&t=660s)
11. [11:05Be Our Next Designer of the Week!](https://www.youtube.com/watch?v=l32kDk5DU00&t=665s)

## Related resources

- [Animated Shape BlendTemplate](https://app.spline.design/academy/tutorials/create-animated-3d-blobs-that-react-to-your-mouse?redirect-duplicate-template-uuid=546ba9b3-f563-43e4-bbd7-a72c5941902e&is-2d-file=false)
- [Shape BlendDocument](https://docs.spline.design/designing-in-3-d/shape-blend)
- [Materials & ShadingDocument](https://docs.spline.design/#%F0%9F%8C%88-materials-&-shading)
- [How state-based animation worksDocument](https://docs.spline.design/interaction-states-events-and-actions/how-state-based-animation-works)
- [Follow EventDocument](https://docs.spline.design/interaction-states-events-and-actions/events/follow-event)

## Overview

- Spline 3D
- 12 min
- Beginner

## Part of

- [Spline 101 | Build Your First Interactive Scene](https://spline.design/academy/collections/spline-101-build-your-first-interactive-scene/create-animated-3d-blobs-that-react-to-your-mouse)

## Related tutorials

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

[Animate Organic 3D Blobs with StatesSpline 3DBeginner5 min](https://spline.design/academy/tutorials/animate-organic-3d-blobs-with-states)[How to create 3D blobs using SplineSpline 3DBeginner14 min](https://spline.design/academy/tutorials/how-to-create-3d-blobs-using-spline)[Refine & Style 3D Icons with MaterialsSpline 3DBeginner9 min](https://spline.design/academy/tutorials/refine-style-3d-icons-with-materials)

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