Code Studio

Turn your ideas into widgets

Code Studio lets you build production-ready Vue 3 widgets with just your words. Describe what you need and our AI builds it in real-time.

Describe a widget you want to build...

Not sure where to start? Try one of these:

Everything You Need

Powerful features to accelerate your widget development workflow

AI-Powered Generation
Describe what you need in plain English. Our multi-agent AI analyzes your request, plans the implementation, and generates production-ready code.
Live Preview
See your widgets come to life instantly. Edit code in the integrated IDE and watch changes reflect in real-time with hot module replacement.
Vue 3 + TypeScript
Generate modern Vue 3 components with TypeScript support. Clean, typed, and following best practices out of the box.

How It Works

From idea to code in three simple steps

01

Describe Your Widget

Tell the AI what you want to build. Be as detailed or as simple as you like — the agent will ask clarifying questions if needed.

02

AI Generates Code

Watch as the AI plans the implementation, generates Vue 3 components, and writes TypeScript code in real-time.

03

Preview & Export

Test your widget in the live preview, make adjustments through conversation or direct editing, then download your code.

Ready to Build?

Open Merlin and click "Launch Code Studio" to get started.