Changelog

New

• Native Tailwind CSS v4 - Tailwind CSS is now compiled at build time instead of loading the 266KB browser compiler on every preview refresh. This means dramatically faster previews, especially on mobile devices.
• Zero-config setup - Just add @import "tailwindcss"; to any CSS file and start using Tailwind classes. No PostCSS config, no build tools setup needed.
• Smart class scanning - Only the CSS you actually use gets generated. The compiler scans your HTML, JSX, Vue, and Svelte files for class names and produces minimal, optimized CSS.
• Incremental builds - Compiled CSS is cached between builds. If your classes haven't changed, the preview updates instantly.

Improvements

• Updated all templates - All 32 Tailwind-powered templates now use native compilation instead of the CDN script.
• Backward compatible - Existing projects using the Tailwind CDN script tag will automatically use the native compiler instead.

New

• GPT-5.3 Codex - The latest agentic coding model from OpenAI. Combines frontier coding with research and tool use capabilities.
• Claude Sonnet 4.6 - The newest Sonnet with adaptive thinking and 64K output tokens.
• Claude Opus 4.6 - Upgraded to 128K output tokens with 1M context window support.
• Gemini 3.1 Pro - Replaces the deprecated Gemini 3 Pro Preview.
• Configurable Model Preferences - Choose which AI models to use for Economy (Fast) and Quality (Pro) modes from Preferences > AI Model. Your choices are saved to your account.

New

• Image Attachments - Attach images directly to your chat messages. Paste screenshots with Cmd+V, pick files, or drag and drop. The AI can see and analyze your images - describe designs, debug UI issues, or use attached images in your project.
• PDF Attachments - Attach PDF documents to your chat for the AI to read and reference while building your project.
• Web Browsing - The AI can now fetch web pages and search the internet. Share a URL and it will read the content, or ask it to research topics, find documentation, or look up examples.

Improvements

• Economy Mode by Default - New chats now start in Economy mode (Gemini) for the lowest cost. Switch to Smart or Pro anytime from the mode selector.
• Smarter Chat Names - The AI automatically renames your chat to match the topic once it understands what you're building.

New

• Responsive Preview Mode - Switch between phone, tablet, and desktop views right in the preview toolbar. See exactly how your project looks at different screen sizes without leaving the editor.

Fixes

• Folder Drag & Drop Preserves Structure - Dragging a folder into your project now correctly places asset files (images, fonts, etc.) inside their original subfolders. Previously, all assets were flattened into the root directory.

New

• Colorful Redesign - The entire interface has been refreshed with a vibrant, colorful design. Every screen, button, and panel now feels more polished and visually engaging.
• Smarter AI Agent - The AI no longer tries to build everything at once. It now starts by suggesting a wireframe, explains its approach, and builds your project step by step. The result is working websites and interfaces with functional buttons, real navigation, and detailed layouts - not just a pretty picture.
• AI Modes: Economy, Smart & Pro - Choose how AI works for you. Economy uses Gemini for the lowest cost. Smart (recommended) automatically picks the best model for each task - fast and cheap for reading code, premium for writing it. Pro uses Claude for everything - fastest responses and best quality.
• Empty React Template - Start a React project from scratch with just the bare minimum: React, ReactDOM, and a blank component. No Tailwind, no example app - just a clean slate for your own code.

Improvements

• Mobile Experience - Completely reworked for phones. Every screen is clean, readable, and easy to use on small displays. No wasted space, no clipped elements - everything is crisp and well-organized.
• Unified Menu - The project menu and user menu are now combined into one. Everything you need - project actions, sharing, preferences, profile, billing - is in a single, clear menu. Simpler names, better organization.

New

• Visual Editing Mode - Click the "Visual edits" button in the preview toolbar to enter visual editing mode. Hover over any element to see it highlighted, then click to select it. Make changes directly in the properties panel or edit text inline by clicking on it.
• Inline Text Editing - Double-click any text element in the preview to edit it directly. Your changes are tracked and can be applied to your code with a single click.
• Properties Panel - Adjust colors, typography, spacing, borders, and effects for any selected element. Changes preview instantly in real-time.
• Batch Changes - Make multiple visual edits across different elements, then apply them all at once. The AI knows exactly which file and line each change belongs to.
• Ask AI from Preview - Select any element and type a request in the popup to ask AI to modify it. Perfect for quick tweaks like "make this button bigger" or "change the color scheme".

Fixes

• Moving Files No Longer Deletes Images - Fixed a critical bug where moving or renaming image files (e.g., dragging to /public folder) would delete the actual image from storage. Your uploaded assets now stay safe when reorganizing your project structure.
• Upload Images to Shared Projects - You can now upload images to projects with web write access enabled. Previously, only project owners could upload assets. Storage quota is correctly tracked for the project owner.

New

• Voice Input - Click the microphone button to describe your ideas by voice. Your speech is transcribed and inserted into the chat input, so you can review and edit before sending. Perfect for quickly explaining complex features or when typing feels slow.
• Crash-Safe Recording - If your browser crashes or refreshes during transcription, your recording is automatically saved locally. Just click the microphone again to retry - no lost voice messages.

New

• Attach Files in Chat - Upload images and files directly from the chat toolbar. Click the paperclip button to add photos for your website or upload documents. Files are saved to your project's /assets/ folder and the AI can reference them in your code.
• TinyPNG-like Compression - Images are now automatically compressed before upload. JPEGs use MozJPEG (same as TinyPNG) for ~65% smaller files. PNGs use color quantization to reduce file sizes by 60-75% while maintaining visual quality.
• Smart Image Resizing - Large images (over 2048px) are automatically resized. A 12MP phone photo becomes web-optimized in seconds. No more uploading multi-megabyte images that slow down your site.

Improvements

• Unified AI Experience - The AI now guides you from idea to published website like an agency would. It automatically asks clarifying questions to understand your vision, builds step by step, and helps you iterate. No mode switching required - just describe what you want and the AI figures out the rest.

Fixes

• AI Chat Stability - Fixed an issue where certain AI model responses could cause the chat to crash. Conversations are now more reliable across all models.