Spline MCP: Build 3D Web Experiences with AI (Cursor, Claude, Gemini, and more)

Spline MCP: Build 3D Web Experiences with AI (Cursor, Claude, Gemini, and more)

Turn a reference image into an editable 3D scene with Spline MCP and Claude — then take it further with an interactive website.

In this tutorial, you’ll learn how to connect the Spline desktop app to your AI tool, write your first prompt, and watch your scene come together directly in the editor. We’ll recreate a floating park diorama, explore how to refine its objects and materials, and use Claude to build a playful web experience around it, complete with a day/night toggle, hidden surprises, and interactive elements.

What you’ll learn:

- Connect Spline MCP to Claude and other MCP-compatible AI tools.
- Use an image reference to generate an editable 3D scene.
- Refine your scene with prompts or make changes manually in Spline.
- Work in an existing Spline file or start from scratch.
- Turn your 3D scene into an interactive web experience.

Bring a reference image, an idea, or a moodboard — and start building. Share what you create in the comments!

Try Spline V2 and drop a comment with what you want to see next!

👍 Don't forget to like and subscribe for more Spline tutorials and news

Links:
🌸 Hana → https://spline.design/hana
💖 Spline → http://app.spline.design
📚 Spline Docs → https://docs.spline.design
👋 Spline Community → https://app.spline.design/community

Our Socials:
📷 Instagram → / splinetool
🎵 TikTok → / splinedesign
💙 LinkedIn → / splinetool
🐦 X → / splinetool
👾 Discord → / discord

#spline #3D #Design #Spline3D #AIAgent

Overview

Spline 3D
5min
Intermediate