Agent modes

Higher-performance models for more complex work. Best for larger changes, deeper reasoning, and longer builds.

{featureRow("appTesting", "App testing", "Agent tests your app automatically")} {featureRow("codeOptimization", "Code optimization", "Agent reviews code for bugs and improvements")}

{featureRow("turbo", "Turbo", "Fastest models, up to 2.5x speed and 6x cost", "turbo")}

; }; export const AgentInput = ({defaultPrompt = "", highlightPlan = false, highlightStart = false, showTypewriter = true}) => { const AGENT_INPUT_TYPEWRITER_SCRIPT_ID = "replit-docs-typewriter-core"; const AGENT_INPUT_TYPEWRITER_SRC = "https://unpkg.com/typewriter-effect@2.18.2/dist/core.js"; const AGENT_INPUT_TYPEWRITER_PROMPTS = ["Build a project tracker for my team", "Design a landing page for my coffee shop", "Add Stripe payments to my app"]; const AGENT_INPUT_TYPING_SPEED = 40; const AGENT_INPUT_DELETE_SPEED = 20; const AGENT_INPUT_PAUSE_AFTER = 2000; const AGENT_INPUT_START_DELAY = 500; const getAgentInputTypewriterLoader = () => { if (typeof window === "undefined") { return null; } if (!window.__replitDocsAgentInputTypewriterLoader) { window.__replitDocsAgentInputTypewriterLoader = {}; } return window.__replitDocsAgentInputTypewriterLoader; }; const ensureAgentInputTypewriterCore = () => { if (typeof window === "undefined" || typeof document === "undefined") { return Promise.resolve(null); } if (window.Typewriter) { return Promise.resolve(window.Typewriter); } const loader = getAgentInputTypewriterLoader(); if (loader.promise) { return loader.promise; } loader.promise = new Promise((resolve, reject) => { const handleLoad = () => { if (window.Typewriter) { resolve(window.Typewriter); return; } loader.promise = null; reject(new Error("Typewriter core loaded without a global Typewriter export.")); }; const handleError = () => { loader.promise = null; reject(new Error("Failed to load typewriter core.")); }; const existingScript = document.getElementById(AGENT_INPUT_TYPEWRITER_SCRIPT_ID); if (existingScript) { existingScript.addEventListener("load", handleLoad, { once: true }); existingScript.addEventListener("error", handleError, { once: true }); return; } const script = document.createElement("script"); script.id = AGENT_INPUT_TYPEWRITER_SCRIPT_ID; script.src = AGENT_INPUT_TYPEWRITER_SRC; script.async = true; script.addEventListener("load", handleLoad, { once: true }); script.addEventListener("error", handleError, { once: true }); document.head.appendChild(script); }); return loader.promise; }; const getAgentInputTypewriterRegistry = () => { if (typeof window === "undefined") { return null; } if (!window.__replitDocsAgentInputTypewriters) { window.__replitDocsAgentInputTypewriters = new WeakMap(); } return window.__replitDocsAgentInputTypewriters; }; const findAgentInputContainer = node => node?.closest?.("[data-agent-input-container]") || null; const getAgentInputElements = container => ({ textarea: container?.querySelector?.('[data-agent-input-role="textarea"]') || null, startButton: container?.querySelector?.('[data-agent-input-role="start-button"]') || null, pillsContainer: container?.querySelector?.('[data-agent-input-role="pills"]') || null }); const getAgentInputPromptValue = container => { const {textarea} = getAgentInputElements(container); return textarea?.value?.trim() || ""; }; const updateAgentInputButtonState = container => { const {startButton} = getAgentInputElements(container); if (!startButton) { return; } const hasText = getAgentInputPromptValue(container).length > 0; startButton.style.opacity = hasText ? "1" : "0.4"; startButton.style.cursor = hasText ? "pointer" : "not-allowed"; }; const stopAgentInputTypewriter = (textarea, {placeholder, clearDemo = false} = {}) => { if (typeof window === "undefined" || !textarea) { return; } const registry = getAgentInputTypewriterRegistry(); const record = registry?.get(textarea); if (!record) { if (placeholder) { textarea.setAttribute("placeholder", placeholder); } return; } record.stopped = true; if (record.startTimer) { window.clearTimeout(record.startTimer); } if (record.writeFrame) { window.cancelAnimationFrame(record.writeFrame); } if (record.typewriter?.stop) { record.typewriter.stop(); } textarea.removeEventListener("focus", record.handleFocus); textarea.removeEventListener("pointerdown", record.handlePointerDown); textarea.removeEventListener("input", record.handleInput); if (clearDemo && textarea.value === record.pendingValue) { textarea.value = ""; } textarea.setAttribute("placeholder", placeholder || ""); updateAgentInputButtonState(record.container); registry.delete(textarea); }; const startAgentInputTypewriter = (container, {defaultPrompt, placeholder, showTypewriter}) => { if (typeof window === "undefined" || typeof document === "undefined" || !container) { return; } const {textarea} = getAgentInputElements(container); if (!textarea) { return; } if (!showTypewriter || defaultPrompt) { stopAgentInputTypewriter(textarea, { placeholder }); textarea.setAttribute("placeholder", placeholder); updateAgentInputButtonState(container); return; } const registry = getAgentInputTypewriterRegistry(); const existingRecord = registry.get(textarea); if (existingRecord && !existingRecord.stopped) { updateAgentInputButtonState(container); return; } textarea.setAttribute("placeholder", ""); if (textarea.value) { textarea.value = ""; } updateAgentInputButtonState(container); const record = { container, element: textarea, pendingValue: "", renderedValue: "", stopped: false, startTimer: null, writeFrame: null, typewriter: null, handleFocus: null, handlePointerDown: null, handleInput: null }; const queueValue = nextValue => { record.pendingValue = nextValue; if (record.writeFrame) { return; } record.writeFrame = window.requestAnimationFrame(() => { record.writeFrame = null; if (record.stopped || registry.get(textarea) !== record || !textarea.isConnected) { return; } if (textarea.value !== record.pendingValue) { textarea.value = record.pendingValue; } updateAgentInputButtonState(container); }); }; const stopDemo = () => { stopAgentInputTypewriter(textarea, { placeholder, clearDemo: true }); }; record.handleFocus = stopDemo; record.handlePointerDown = stopDemo; record.handleInput = stopDemo; registry.set(textarea, record); textarea.addEventListener("focus", record.handleFocus, { once: true }); textarea.addEventListener("pointerdown", record.handlePointerDown, { once: true }); textarea.addEventListener("input", record.handleInput, { once: true }); record.startTimer = window.setTimeout(() => { ensureAgentInputTypewriterCore().then(Typewriter => { if (!Typewriter || record.stopped || registry.get(textarea) !== record || !textarea.isConnected) { return; } const typewriter = new Typewriter(null, { loop: true, delay: AGENT_INPUT_TYPING_SPEED, deleteSpeed: AGENT_INPUT_DELETE_SPEED, cursor: "", skipAddStyles: true, wrapperClassName: "", cursorClassName: "", onCreateTextNode: character => { record.renderedValue += character; queueValue(record.renderedValue); return null; }, onRemoveNode: () => { record.renderedValue = record.renderedValue.slice(0, -1); queueValue(record.renderedValue); } }); AGENT_INPUT_TYPEWRITER_PROMPTS.forEach(prompt => { typewriter.typeString(prompt).pauseFor(AGENT_INPUT_PAUSE_AFTER).deleteAll(AGENT_INPUT_DELETE_SPEED).pauseFor(400); }); record.typewriter = typewriter; typewriter.start(); }).catch(() => { stopAgentInputTypewriter(textarea, { placeholder }); }); }, AGENT_INPUT_START_DELAY); }; if (typeof document !== "undefined" && !window.LZString) { const script = document.createElement("script"); script.src = "https://cdnjs.cloudflare.com/ajax/libs/lz-string/1.5.0/lz-string.min.js"; document.head.appendChild(script); } const placeholder = "Describe your idea, Replit will bring it to life..."; const outputTypes = [{ name: "Web", iconSvg: '', icon: }, { name: "Mobile", iconSvg: '', icon: }, { name: "Slides", iconSvg: '', icon: }, { name: "Animation", iconSvg: '', icon: }, { name: "Design", iconSvg: '', icon: }]; const checkSvg = ''; if (typeof document !== "undefined" && !document.getElementById("agent-input-styles")) { const style = document.createElement("style"); style.id = "agent-input-styles"; style.textContent = ` /* Theme variables - light mode */ [data-agent-input-container] { --ai-surface-bg: var(--replit-docs-bg, #F6F6F4); --ai-surface-higher: var(--replit-docs-bg-elevated, #F1F1EE); --ai-border-default: var(--replit-docs-border, #DEDAD5); --ai-border-strong: var(--replit-docs-border-strong, #CAC4BE); --ai-text-secondary: var(--replit-docs-text-muted, #5C5C5C); --ai-text-tertiary: var(--replit-docs-text-subtle, #858585); --ai-text-primary: var(--replit-docs-text, #1D1D1D); --ai-button-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-button-bg-hover: var(--replit-docs-bg-elevated, #F1F1EE); --ai-icon-default: var(--replit-docs-text-subtle, #858585); --ai-icon-hover: var(--replit-docs-text-muted, #5C5C5C); --ai-shadow: 0 2px 6px #00000005; --ai-option-bg: var(--replit-docs-bg-elevated, #F1F1EE); --ai-option-border: var(--replit-docs-border, #DEDAD5); --ai-option-hover-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-option-selected-bg: var(--replit-docs-bg-muted, #F1F1EE); --ai-pill-bg: #CDDCF1; --ai-pill-text: var(--replit-docs-text-muted, #5C5C5C); } /* Theme variables - dark mode */ .dark [data-agent-input-container], html.dark [data-agent-input-container], [data-theme="dark"] [data-agent-input-container] { --ai-surface-bg: var(--replit-docs-bg, #1E1E1F); --ai-surface-higher: var(--replit-docs-bg-elevated, #222223); --ai-border-default: var(--replit-docs-border, #39393D); --ai-border-strong: var(--replit-docs-border-strong, #4A4A50); --ai-text-secondary: var(--replit-docs-text-muted, #B8B8BE); --ai-text-tertiary: var(--replit-docs-text-subtle, #8E8F97); --ai-text-primary: var(--replit-docs-text, #F5F5F5); --ai-button-bg: var(--replit-docs-bg-elevated, #222223); --ai-button-bg-hover: var(--replit-docs-bg-muted, #222223); --ai-icon-default: var(--replit-docs-text-subtle, #8E8F97); --ai-icon-hover: var(--replit-docs-text-muted, #B8B8BE); --ai-shadow: 0 2px 6px #00000020; --ai-option-bg: var(--replit-docs-bg-elevated, #222223); --ai-option-border: var(--replit-docs-border, #39393D); --ai-option-hover-bg: var(--replit-docs-bg-muted, #222223); --ai-option-selected-bg: var(--replit-docs-bg-muted, #222223); --ai-pill-bg: #2A3A4D; --ai-pill-text: #D0D8E4; } .agent-input-container { box-sizing: border-box; } /* Entry animation */ @keyframes agent-input-fade-in-up { from { transform: translateY(10px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } /* Hover state for input box */ [data-agent-input-container]:has([data-agent-input-role="inner"]:hover) [data-agent-input-role="inner"] { border-color: #85C7FF !important; } /* Focus state for input box */ [data-agent-input-container]:has([data-agent-input-role="inner"]:focus-within) [data-agent-input-role="inner"] { border-color: #0079F2 !important; } /* Icon button hover */ @media (hover: hover) { [data-agent-input-container] .ai-icon-btn:hover { background: var(--ai-button-bg-hover); } [data-agent-input-container] .ai-icon-btn:hover svg { color: var(--ai-icon-hover); } [data-agent-input-container] .ai-option-btn:not([data-selected="true"]):hover { background: var(--ai-option-hover-bg); } [data-agent-input-container] .ai-plan-btn:hover { background: var(--ai-button-bg-hover); } [data-agent-input-container] .ai-nav-btn:hover svg { color: var(--ai-icon-hover); } [data-agent-input-container] .ai-pill-close:hover { opacity: 0.7; } } @keyframes plan-border-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } [data-agent-input-container] .ai-plan-wrap { position: relative; border-radius: 32px; padding: 2px; overflow: hidden; } [data-agent-input-container] .ai-plan-wrap::before { content: ''; position: absolute; inset: -50%; background: conic-gradient( #3b82f6, #8b5cf6, #ec4899, #f59e0b, #10b981, #3b82f6 ); animation: plan-border-spin 1s linear infinite; } [data-agent-input-container] .ai-plan-wrap .ai-plan-btn-highlight { position: relative; background: var(--ai-surface-higher); color: var(--ai-text-primary); font-weight: 400; border: none; border-radius: 32px; z-index: 1; } [data-agent-input-container] .ai-plan-wrap.ai-plan-off::before { animation: none; background: transparent; } [data-agent-input-container] .ai-plan-wrap.ai-plan-off .ai-plan-btn-highlight { background: var(--ai-button-bg); color: var(--ai-text-secondary); } /* Plan checkbox styles */ [data-agent-input-container] .ai-plan-checkbox-label { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 8px; border-radius: var(--border-radius-6, 6px); background: var(--ai-button-bg); cursor: pointer; font-size: 12px; font-family: inherit; color: var(--ai-text-secondary); transition: background 120ms ease-out; user-select: none; } @media (hover: hover) { [data-agent-input-container] .ai-plan-checkbox-label:hover { background: var(--ai-button-bg-hover); } } [data-agent-input-container] .ai-plan-checkbox-input { width: 20px; height: 20px; margin: 0; accent-color: #0079F2; cursor: pointer; } [data-agent-input-container] .ai-start-wrap { position: relative; display: inline-flex; padding: 3px; border-radius: 8px; overflow: hidden; } [data-agent-input-container] .ai-start-wrap::before { content: ''; position: absolute; inset: -50%; background: conic-gradient( #3b82f6, #8b5cf6, #ec4899, #f59e0b, #10b981, #3b82f6 ); animation: plan-border-spin 1s linear infinite; } [data-agent-input-container] .ai-start-wrap .ai-start-btn-highlight { position: relative; background: var(--ai-surface-higher); border: none; border-radius: 6px; z-index: 1; } `; document.head.appendChild(style); } const getLink = (container, promptOverride) => { if (typeof document === "undefined" || !window.LZString) return ""; const prompt = promptOverride || getAgentInputPromptValue(container); if (!prompt) return ""; const encoded = window.LZString.compressToEncodedURIComponent(prompt); const utm = "utm_source=replit-docs&utm_medium=docs&utm_campaign=docs-intro-agent-input&utm_content=homepage-prompt-box"; return `https://replit.com/?prompt=${encoded}&referrer=replit-docs&${utm}`; }; const handleStartClick = e => { e.preventDefault(); const container = findAgentInputContainer(e.currentTarget); const link = getLink(container); if (link) window.open(link, "_blank"); }; const toggleOutputType = name => { const btn = document.querySelector(`[data-option-name="${name}"]`); const pillsContainer = document.getElementById("agent-input-pills"); if (!btn || !pillsContainer) return; const isSelected = btn.dataset.selected === "true"; if (isSelected) { btn.dataset.selected = "false"; btn.style.background = "var(--ai-option-bg)"; const iconEl = btn.querySelector(".option-icon"); const type = outputTypes.find(t => t.name === name); if (iconEl && type) iconEl.innerHTML = type.iconSvg; const pill = document.getElementById(`pill-${name}`); if (pill) pill.remove(); } else { document.querySelectorAll('[data-option-name][data-selected="true"]').forEach(prevBtn => { const prevName = prevBtn.dataset.optionName; prevBtn.dataset.selected = "false"; prevBtn.style.background = "var(--ai-option-bg)"; const prevIconEl = prevBtn.querySelector(".option-icon"); const prevType = outputTypes.find(t => t.name === prevName); if (prevIconEl && prevType) prevIconEl.innerHTML = prevType.iconSvg; const prevPill = document.getElementById(`pill-${prevName}`); if (prevPill) prevPill.remove(); }); btn.dataset.selected = "true"; btn.style.background = "var(--ai-option-selected-bg)"; const iconEl = btn.querySelector(".option-icon"); if (iconEl) iconEl.innerHTML = checkSvg; const type = outputTypes.find(t => t.name === name); if (type) { const pill = document.createElement("span"); pill.id = `pill-${name}`; pill.style.cssText = "display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 8px 0 8px;border-radius:32px;background:var(--ai-pill-bg);color:var(--ai-pill-text);font-size:14px;white-space:nowrap;cursor:default;"; pill.innerHTML = `", "")}${name}`; pill.querySelector(`[data-pill-remove="${name}"]`).addEventListener("click", () => toggleOutputType(name)); pillsContainer.appendChild(pill); } } }; const PlusIcon = ; const MicIcon = ; const ArrowUpIcon = ; const ArrowLeftIcon = ; const ArrowRightIcon = ; const iconBtnStyle = { display: "flex", alignItems: "center", justifyContent: "center", width: "28px", height: "28px", border: "none", borderRadius: "6px", background: "transparent", cursor: "pointer", color: "var(--ai-icon-default)", padding: 0, transition: "background 120ms ease-out" }; const optionIconStyle = { display: "flex", alignItems: "center", justifyContent: "center", width: "48px", height: "48px", border: "1px solid var(--ai-option-border)", borderRadius: "12px", background: "var(--ai-option-bg)", cursor: "pointer", color: "var(--ai-text-secondary)", padding: 0, transition: "background 120ms ease-out", flexShrink: 0 }; const initAgentInput = container => { if (!container) { return; } updateAgentInputButtonState(container); startAgentInputTypewriter(container, { defaultPrompt, placeholder, showTypewriter }); const ta = container.querySelector('[data-agent-input-role="textarea"]'); if (ta && ta.value) { requestAnimationFrame(() => { ta.style.height = "auto"; ta.style.height = ta.scrollHeight + "px"; }); } }; return

{}

{
    const ta = e.currentTarget;
    ta.style.height = "auto";
    ta.style.height = ta.scrollHeight + "px";
    updateAgentInputButtonState(findAgentInputContainer(ta));
  }} style={{
    display: "block",
    width: "100%",
    minHeight: "21px",
    maxHeight: "calc(14px * 1.5 * 10)",
    padding: 0,
    margin: 0,
    border: "none",
    outline: "none",
    resize: "none",
    fontSize: "14px",
    lineHeight: "1.5",
    color: "var(--ai-text-primary)",
    background: "transparent",
    fontFamily: "inherit",
    boxSizing: "border-box",
    overflowY: "auto"
  }} />
          </div>
          {}
          <div style={{
    position: "absolute",
    left: "8px",
    right: "8px",
    bottom: "8px",
    display: "flex",
    justifyContent: "space-between",
    alignItems: "center"
  }}>
            {}
            <div style={{
    display: "flex",
    alignItems: "center",
    gap: "8px",
    overflow: "hidden",
    minWidth: 0
  }}>
              <button className="ai-icon-btn" style={iconBtnStyle} aria-label="Add attachment" type="button">
                {PlusIcon}
              </button>
              <div id="agent-input-pills" data-agent-input-role="pills" style={{
    display: "flex",
    alignItems: "center",
    gap: "6px",
    overflow: "hidden"
  }}></div>
            </div>
            {}
            <div style={{
    display: "flex",
    alignItems: "center",
    gap: "8px",
    flexShrink: 0
  }}>
              {highlightPlan ? <div className="ai-plan-wrap" onClick={e => {
    const wrap = e.currentTarget;
    wrap.classList.toggle("ai-plan-off");
  }}>
                  <label className="ai-plan-btn-highlight" style={{
    display: "flex",
    alignItems: "center",
    gap: "6px",
    height: "32px",
    padding: "0 8px",
    cursor: "pointer",
    fontSize: "12px",
    fontFamily: "inherit",
    transition: "background 120ms ease-out"
  }}>
                    <input className="ai-plan-checkbox-input" type="checkbox" aria-label="Plan mode" name="Plan mode" defaultChecked />
                    <span>Plan</span>
                  </label>
                </div> : <label className="ai-plan-checkbox-label">
                  <input className="ai-plan-checkbox-input" type="checkbox" aria-label="Plan mode" name="Plan mode" />
                  <span>Plan</span>
                </label>}
              <button className="ai-icon-btn" style={iconBtnStyle} aria-label="Start voice input" type="button">
                {MicIcon}
              </button>
              {highlightStart ? <div className="ai-start-wrap">
                  <button data-agent-input-role="start-button" className="ai-icon-btn ai-start-btn-highlight" onClick={handleStartClick} type="button" aria-label="Start" style={{
    ...iconBtnStyle,
    borderRadius: "6px",
    background: "#0079F2",
    color: "#fff",
    opacity: defaultPrompt ? "1" : "0.4",
    cursor: defaultPrompt ? "pointer" : "not-allowed"
  }}>
                    {ArrowUpIcon}
                  </button>
                </div> : <button data-agent-input-role="start-button" className="ai-icon-btn" onClick={handleStartClick} type="button" aria-label="Start" style={{
    ...iconBtnStyle,
    background: "#0079F2",
    color: "#fff",
    opacity: defaultPrompt ? "1" : "0.4",
    cursor: defaultPrompt ? "pointer" : "not-allowed"
  }}>
                  {ArrowUpIcon}
                </button>}
            </div>
          </div>
        </div>
      </div>
    </div>;
};

## What is Replit Agent?

Agent is your creative partner. Agent takes your ideas, helps you refine them, and then makes them real. Unlike a chatbot that only answers questions, Agent takes action: it sets up your project, creates applications, checks its work, and fixes problems along the way.

Describe what you want in everyday language. No code or technical knowledge required. Agent handles the rest, from planning to deployment.

## How to use Replit Agent

### Getting started

<Steps>
  <Step title="Describe what you want">
    In the [Project Editor](/core-concepts/project-editor), just start chatting. Describe an app you want to build, ask a question, research a topic, or pull data from [connected services](/core-concepts/agent/general-agent) like BigQuery, Slack, or Notion. There are no constraints. Replit Agent handles whatever you throw at it.

<Step title="Choose what to build">
    Optionally, select a project type: web app, mobile app, slides, design, data visualization, and more. If you already described what you want in step 1, Agent figures out the right setup automatically.

<Step title="Agent builds it">
    Agent writes code, sets up infrastructure, and tests the result. Once you're in your project, you can switch between [Agent modes](#agent-modes) to control how it builds.
  </Step>

<Step title="Iterate, test, deploy">
    Chat with Agent to refine your project, then publish when you're ready. All artifacts deploy together.
  </Step>
</Steps>

<Note>You're not locked into one type. Start with a web app and add a mobile app, slides, or a video later — all in the same project.</Note>

### Plan mode

Enable Plan mode to brainstorm, ask questions, and map out your project before Agent changes any code or data. In Plan mode, Agent will:

* **Break down complex projects** into ordered task lists
* **Explore different approaches** and weigh trade-offs
* **Review and refine** before any code is written

Click "Plan" in the chat input — or simply ask Agent — to switch to Plan mode. Example: "Create a plan to build a project tracker for my team"

Agent creates an ordered task list you can review and refine. When you're happy with the plan, approve it and Agent starts building.

Learn more in the [Plan mode guide](/core-concepts/agent/plan-mode).

### Agent modes

Choose how Agent builds your project:

* **Lite**: Make lightweight, inexpensive changes quickly. Lite mode is ideal for visual tweaks, bug fixes, and scoped features.
* **Economy**: Use Agent's cost-optimized models for everyday tasks. Expand **Advanced settings** to manage features like App Testing and Code Optimizations.
* **Power**: Use Agent's most capable models for harder problems, larger changes, and longer builds. In **Advanced settings**, you can also turn on **Turbo** for up to 2.5x faster builds at higher cost (Pro only).

<Note>Tip: You can also enable **[Plan mode](/core-concepts/agent/plan-mode)** to review and iterate on Agent's plan before building begins. Max mode is no longer available; use Power for the most capable standard builds.</Note>

## What you can build with the Replit Agent

* **Web apps, mobile apps, data dashboards, and AI-powered tools**
* **Visual designs and prototypes** — explore mockups on the [Design Canvas](/replitai/canvas) before committing to code
* **Multiple outputs in one project** — web apps, mobile apps, slides, and videos sharing the same backend
* **Files and documents** — CSVs, PDFs, PowerPoint files, Markdown docs
* **Connected service queries** — pull data from BigQuery, Linear, Slack, Notion, and more directly from chat

<Card title="Start building now" icon="arrow-up-right" href="https://replit.com">
  Describe your idea and let Agent bring it to life — no setup required.
</Card>

## Frequently asked questions

<Accordion title="Do I need to know how to code?">
  No. Agent handles all the technical work — writing code, setting up infrastructure, configuring databases. You describe what you want in plain language and Agent builds it.
</Accordion>

<Accordion title="What's the difference between Lite, Economy, and Power?">
  **Lite** is for quick, targeted changes (10-60 seconds) such as visual tweaks, bug fixes, and scoped features. **Economy** is the best default for most builds when you want to balance cost and quality. **Power** uses the most capable models for harder tasks, and **Turbo** is an optional Power-only toggle in Advanced settings when you need the fastest runs.
</Accordion>

<Accordion title="Can I build more than one thing in a project?">
  Yes. You can add web apps, mobile apps, slides, videos, and data visualizations to the [same project](/replitai/artifacts#multiple-artifacts-in-one-project) — all sharing the same backend and data.
</Accordion>

<Accordion title="What happens if Agent makes a mistake?">
  Agent tests its own work on a regular basis. Agent also creates checkpoints as it works, so you can roll back to any previous state. You can also chat with Agent to describe what went wrong and it will fix the issue.
</Accordion>

## Availability

| Capability              | Core | Pro |
| ----------------------- | ---- | --- |
| Agent chat and building | ✅    | ✅   |
| Lite mode               | ✅    | ✅   |
| Economy mode            | ✅    | ✅   |
| Power mode              | ✅    | ✅   |
| Design Canvas           | ✅    | ✅   |
| Multi-Artifacts         | ✅    | ✅   |
| Active background tasks | 1    | 10  |
| Turbo                   | ❌    | ✅   |

For detailed pricing, see [Agent billing](/billing/ai-billing#agent-billing).

## Next steps

<CardGroup cols={2}>
  <Card title="Agent Skills" icon="puzzle-piece" href="/core-concepts/agent/skills">
    Teach Agent specialized knowledge — use pre-built skills or create your own.
  </Card>

<Card title="Task system" icon="list-check" href="/core-concepts/agent/task-system">
    Kanban planning, background tasks, and changes applied back to the main version.
  </Card>

<Card title="Design Canvas" icon="paintbrush" href="/replitai/canvas">
    Visual mockups and the hands-on visual editor.
  </Card>

<Card title="Connectors" icon="plug" href="/core-concepts/agent/general-agent">
    Connect BigQuery, Linear, Slack, Notion, and more.
  </Card>

<Card title="Billing" icon="credit-card" href="/billing/ai-billing#agent-billing">
    Agent pricing, plan comparison, and spending management.
  </Card>

<Card title="Vibe coding guide" icon="wand-magic-sparkles" href="/tutorials/how-to-vibe-code">
    Tips for effective prompting and building with AI.
  </Card>
</CardGroup>