> ## Documentation Index > Fetch the complete documentation index at: https://docs.replit.com/llms.txt > Use this file to discover all available pages before exploring further. # Design vs. Build > Learn the difference between Design and Build in a Replit project, and when to start in each. Every Replit project has two entry points, side by side in the header: **Design** and **Build**. Design is where you shape how your software looks; Build is where Agent makes it work. They open the same project, so nothing you design is stranded in a design tool. A Replit project with the Design and Build entry points side by side in the header, showing the canvas with a selected APEX X1 Exact Replica design frame ## What is Design? [Design](/design/what-is-replit-design) shows the canvas, where you generate design frames from a prompt, explore variants, and refine the winner, all before committing to code. Design is perfect for: * **Testing your ideas quickly**: visualize your app's design before building functionality * **Creating polished websites**: landing pages, portfolios, restaurant menus, event pages * **Fine-tuning your design**: adjust colors, layouts, and content instantly Design mockups look and feel like real pages, but they don't store data or connect to external services yet. When you're happy with how everything looks, build the design into a full app with one click. The steps below show you how. ## What is Build? Build is where your creation runs as a real, working application that can save data, let people sign in, and connect to other services. Use Build when your app needs: * **User accounts**: let people create accounts and log in * **Saved information**: store data like orders, messages, or user preferences * **Connections to other services**: process payments, send emails, or pull in data from other apps * **Complex tasks**: run an online store, manage bookings, or power a dashboard ## Using both together Design and Build work on the same project, so you don't have to choose one or the other. Start with the look and evolve into a full app. Start in Design to quickly visualize your idea. Focus on how your app looks and feels: the layout, colors, buttons, and user experience. Follow a [suggestion](/design/explore-suggestions) to explore new directions for a selected frame, or select the **Edit** tool and click an element to adjust it in the [Visual Editor](/design/visual-editor). You can also [chat with Agent](/design/chat-about-your-design) to describe the changes you want. A selected Website frame showing an APEX X1 supercar hero, with a Suggested next steps panel beside it offering suggestion chips such as Explore different approaches, Try different layouts, Explore different vibes, and Surprise me When you're happy with your design and ready to add real functionality, select **Build…** on the frame. Create a new artifact or apply the design to an existing one; Agent adds the ability to save data, handle user accounts, and connect to services, all while keeping your design intact. The Build menu open on a selected Design frame (APEX X1 Exact Replica) with the header 'Build or apply your designs', showing 'Build this design', which creates a new artifact, and 'Apply to an existing creation' listing the project's APEX X1 Design System and its Scroll Hero website Agent will prompt you to convert when you try to add a database or advanced features to a mockup. Once your app is built, publish it so anyone can access it online. Replit handles all the technical infrastructure so your app works reliably for your audience. ## When to start in each * The look is the hard part * You want to see your idea quickly * You want to explore and compare directions * Speed is your priority * The behavior is the hard part * Your app must save data from day one * People need to log in * You're connecting to other services **Not sure which to pick?** Start in Design. It's faster, and you can always build the design into a full app later. Your work is never wasted, it carries over when you build. And it works the other way too: get an app working in Build, then restyle it in Design. ## Key differences | Feature | Design (mockups) | Build (apps) | | -------------------------- | --------------------------- | ---------------------------------- | | **Speed** | A few minutes | About 10 minutes for complete apps | | **Data storage** | Visual only (no saving) | Saves and retrieves real data | | **User accounts** | Shows what login looks like | Actual login functionality | | **Connecting to services** | Not available | Payments, emails, external data | ## Next steps The full journey from prompt to on-brand app The board where your frames live The guided flow from frame to working app Explore what Agent can build for you