The visual builder for Astro
Tado Studio is a visual workspace on top of your own Astro project. Prompt a page, shape it on the canvas and publish it in minutes. Your files stay on your computer, so you can leave any time.
Join the waitlist for launch news and an exclusive launch discount.
Tado Studio
Astro
Work with Codex on your ChatGPT plan or Claude Code on your Claude plan, inside Tado Studio. Support for local AI models is in development. Select an element and it goes along with your prompt, so the AI knows exactly where to work.
No separate API bill. Use the subscription you already pay for. Your login and chat history stay with Codex or Claude Code.
Your own skills and connectors. The skills and MCP connectors you set up in Codex or Claude Code appear in the chat. Pin a skill and every prompt follows it.
Best practices built in. A built-in skill keeps every page accessible, responsive and semantic, with readable class names and your framework’s tokens.
Example workflow
Use an SEO skill with a connected SEO data source. Review keywords and get suggestions for the title, headings and copy, next to the page you’re working on.
Example workflow
Select a piece of text and let a writing skill rewrite it in your tone of voice. Review the result in the design and refine it right there.
Skills and connectors demo coming soon
Click any element on the canvas and adjust its layout, spacing, type and color with visual controls. Its classes, CSS and props sit right next to it, and every change lands in the same Astro files.
Every breakpoint at once. See desktop, tablet and phone side by side, and fix the layout where it needs it.
Your framework’s tokens. Pick colors, type and spacing from your CSS framework, so every page stays consistent.
Components you can reuse. Edit a component’s props without opening the file. Change the component and every instance follows.
Pages, blog posts, components and any collection you invent live in your Astro project as plain files. Give a collection its own fields, show it with a loop and edit entries right in Tado Studio. No special tables hiding in a database.
Collections for anything. Team members, services, projects: create a collection and give it fields, from text and images to dates, links and repeating items.
Loops on any page. Show the whole team or only featured projects anywhere. Add an entry and every loop updates.
Content from anywhere. Keep entries in Markdown, JSON or YAML, or pull them from a headless CMS or API with Astro’s content loaders.
Push your project to GitHub and publish it to Cloudflare from the same workspace. Your site goes live as static files, with no server or database to look after.
GitHub in one click. Tado Studio commits your changes and pushes the project to its own repository.
Live on Cloudflare. Publish straight from Tado Studio. For suitable static sites, Cloudflare’s free plan can be enough.
Any host you like. It’s a standard Astro project, so it runs almost anywhere. Hosting is separate from your Tado Studio subscription.
Your site is a regular Astro project on your own computer. Open it in any editor, keep it in Git, and build and host it without Tado Studio. Stop using Tado Studio and your site keeps working.
Plain files on your disk. Pages, components, content and styles are ordinary files you can read and change.
Edit with any tool. Work in VS Code or the terminal next to Tado Studio. Outside edits are picked up, never silently overwritten.
Bring your own project. Open an existing Astro project, or start from one of Astro’s own templates.
New to Astro, or turning website building into your job? Tado Studio comes with a built-in skill that brings professional web standards into every chat. The AI builds your pages the right way, and you learn from the result.
---
const {title, text, href} = Astro.props;
---
<article class="card card--featured">
<h3 class="card__title">{title}</h3>
<p class="card__text">{text}</p>
<a class="card__link" href={href}>Read about {title}</a>
</article>
<style>
.card { padding: var(--space-m); }
.card__title { font-size: var(--text-l); }
.card--featured { border-color: var(--primary); }
</style>Headings in order, labels on every field, alt text, visible focus states and enough contrast.
Layouts and type that adapt from phone to wide screen, checked at every breakpoint.
The right element for each job: header, nav, main, article and real buttons, not a pile of divs.
Predictable names like card__title and card--featured, so your CSS stays readable and reusable.
Colors, type and spacing from your CSS framework instead of one-off values.
Page titles, meta descriptions, optimized images and no scripts you don’t need.
The chapters above tell the main story. These are the tools you reach for while you build. Open one to see what it does.
Pick a name and a folder, and Tado Studio sets up a new Astro site for you: your CSS framework, a first saved version and a live preview, ready for your first prompt. Opening an existing Astro project works the same way; Tado Studio installs what it needs and starts the preview.
The skills you set up in Codex or Claude Code appear in the chat. Pin the ones a chat needs, such as your house style or an accessibility check, and every prompt in that chat follows them.
Supported MCP connectors you already use with your AI tool are picked up automatically. Switch them on per chat, for example a keyword data source for SEO research. External services need their own account and permission.
A built-in skill steers the AI toward accessible, responsive and semantic HTML, with readable class names and your framework’s tokens. You get pages built the right way from the first prompt, and you learn from the result.
Colors, font sizes and spacing from your connected CSS framework appear in the value menus, so every page stays consistent. You can edit the design system itself in Tado Studio too.
Give a component properties such as a title, a price or a featured flag, and fill them in per instance in the Properties panel, without opening the file. Change the component and every instance follows.
Create collections such as team members, services or projects, and give them fields from text and images to dates, links and repeating items. You edit the entries in Tado Studio; they are stored as JSON in your project.
Show a collection anywhere with a loop, and use a condition to show only what fits, such as featured projects. Add an entry and every loop updates.
Use Astro’s dynamic routes to give every entry its own page from a single template, and preview those pages on the canvas.
Show desktop, tablet and phone side by side, or switch the canvas to one size, and fix the layout at the width where it needs it.
The code panel shows the HTML, CSS and JavaScript of the element you selected, right below the canvas. Edit the code yourself, or ask the AI for a precise change.
Save each version of your site with Git and back it up to its own GitHub repository, without leaving Tado Studio. The history stays in a standard Git repository, so earlier versions remain available.
Publish your site to Cloudflare straight from Tado Studio. It goes live as static files, and for suitable sites Cloudflare’s free plan can be enough. Hosting is separate from your Tado Studio subscription.
Your pages are built as static files, so there’s no caching plugin to set up or update. Images are converted to modern formats such as WebP when your site is built, so pages stay light.
Run your project’s scripts or Claude Code in the terminal next to the canvas, without switching apps.
Walkthrough video coming soon
Keep what you like about building visually, and leave the hosting setup, plugin updates and database behind.
| The usual WordPress route | Tado Studio | |
|---|---|---|
| Setting up | WordPress: Hosting, a database and WordPress itself, then a theme or page builder, before you build anything. | Tado Studio: Open an Astro project on your computer in one click and start building. |
| Building with AI | WordPress: Pages and layouts live in the database, so a coding agent can’t simply open and edit them. | Tado Studio: Pages are plain Astro files. Codex or Claude Code edits them directly, and you refine the result visually. |
| Adding features | WordPress: A plugin for every job, each with its own updates, settings and risks. | Tado Studio: Components, collections, a CSS framework and Git are built in. Forms, SEO and client editing are on the roadmap. |
| Security and updates | WordPress: Core, theme and plugins need regular updates, and a full backup needs both the files and the database. | Tado Studio: The live site is static HTML: no login page, database or plugins running on the server. |
| Hosting | WordPress: Managed WordPress hosting from well-known hosts starts at about $30 a month for one site. | Tado Studio: Static files run almost anywhere. For suitable sites, Cloudflare’s free plan can be enough. |
| Your content | WordPress: Page builder layouts sit in the database, in the builder’s own format. | Tado Studio: Pages and content are plain files: Astro, Markdown and JSON. Take them anywhere. |
WordPress does two things really well: more than 73,000 free plugins and an editor your clients know. That’s why forms, SEO and one-click client editing with EmDash are on our roadmap. See the roadmap
Sources: Patchstack, State of WordPress Security in 2026 (February 2026). WordPress.org statistics and php.net supported versions, about 38% calculated, and the WordPress.org plugin directory (September 2026). WordPress developer documentation. Kinsta and WP Engine pricing pages (September 2026).
Here’s what we’re working on now. We share the list, not dates.
Publish to other hosting platforms as easily as to Cloudflare.
Connect EmDash, the open-source CMS for Astro, in one click, so your clients can update their own content.
Contact and signup forms that work on a static site and arrive where you want them.
Titles, descriptions, social previews and sitemaps, managed per page.
Run a model on your own computer, next to Codex and Claude Code.
Ready-made pages and sections to start from.
Simple mode hides code and files behind a clean view, so nothing breaks. Advanced shows everything.
Bring in a static HTML site or a WordPress site and keep building in Tado Studio.
From your first site to your next client project. Use AI for the first version, build on it visually, and switch to AI or code whenever that helps.
Build real websites with AI and visual controls, no code needed. Guides, video tutorials and an AI assistant help you learn as you go.
Get a first version from AI, then shape every detail with visual controls, the way you’re used to in a builder.
Keep real Astro files, Git and a terminal. Jump into the code, or hand the AI a precise task on the element you selected.
Reuse your skills, CSS framework and components across client projects, and deliver plain Astro sites you can host where you like.
We’ve built custom websites and plugins for clients for ten years, most of them in WordPress. You probably know the routine: a plugin for every job, each with its own updates and risks. Core, theme and plugins to keep up to date. Backups of both the files and the database. And page layouts stuck in the database, in the format of whichever builder you picked.
Then AI changed web development. Coding agents now write and edit real code, and as developers we have to move with that. But WordPress wasn’t made for an AI-first workflow: an agent can’t simply open a page that lives in a database.
So we went looking for a better way to work. AI for the first version, precise visual control for the details, and a site made of plain files you own and can host anywhere. That search became Tado Studio.
What Tado Studio does, what it costs and what you need, before launch.
Tado Studio is a desktop app. We’ll confirm the supported operating systems and installation requirements before launch, and waitlist members hear it first.
Ask the AI to build or change a page or section. Then select any element in the result and adjust its text and styling with visual controls.
From that same selection, you can give a follow-up prompt or edit the code. AI, visual editing and code all work on the same files, in one workspace.
No. You can build with AI prompts, select elements, edit text and adjust styling visually, without writing code.
Tado Studio is easy to pick up, whether you’re just starting out or already build sites for clients. Detailed guides, video tutorials and an AI assistant that answers your questions about Tado Studio help you along the way. And when you want more control, the code is always within reach.
Yes. Use Codex with a supported ChatGPT subscription, or Claude Code with a supported Claude subscription.
This route needs no separate API billing. Your provider decides which plans include Codex or Claude Code.
Tado Studio automatically picks up the skills and supported MCP connectors you already use with your AI tool. For each chat, you choose which skills to pin and which connectors to switch on.
Connectors to outside services still need your own account and permission, and some services need their own subscription.
No. Your project files stay on your computer, but the AI model runs as an online service from your provider. The agent reads and edits your local files, and the parts it works with are sent to that service.
Local AI model support is in development.
Yes. Tado Studio works on a regular Astro project in a folder you choose. Open it in your code editor, use Git, or run it without Tado Studio. Your published site doesn’t depend on Tado Studio.
If a file changes outside Tado Studio while you’re editing it, Tado Studio won’t silently overwrite that change.
Push your project to GitHub in one click, or publish it to Cloudflare straight from Tado Studio. You can also deploy it with any other host you prefer.
Hosting is separate from Tado Studio. For suitable static sites, Cloudflare’s free plan can be enough within its limits.
Tado Studio will be a paid product. We’re planning one subscription per maker, with unlimited local projects and updates while you’re subscribed. Pricing will be announced before launch.
Your AI subscription, hosting and domain name are separate costs.
Tado Studio is launching soon. We’ll share the launch date and pricing with the waitlist first.
Join the waitlist with your email address to get launch updates and an exclusive launch discount code.
Be the first to hear when Tado Studio launches.