Skip to content

The Lovable Feature AtlasIndependent community catalog

Atlas
Editor

Code Mode

GAEditorReleased May 2026Paid plansSource: docs.lovable.dev

Code Mode is Lovable's Editor feature: Inspect and edit project code directly inside Lovable.

View and edit your project's underlying codebase from inside Lovable — inspect files, make targeted edits, troubleshoot without exporting or switching tools. Available on paid plans.

Example workflows

Starting points built from this record, not transcripts of a run. Each prompt is written the way it should be sent, as one paragraph, and each is worth editing before you send it.

  1. Stand it up from scratch

    You have read the record and want Code Mode working in a real project rather than a sandbox.

    Set up Code Mode in this project — inspect and edit project code directly inside Lovable. Walk it end to end, tell me exactly what you changed, and flag anything I have to switch on myself before it works.

    Expected outcome

    A working setup, a plain list of what changed, and a short list of anything left for you to switch on. Check that list before assuming it is done.

  2. Tweak a single Tailwind class without a prompt

    The record lists this as one of the jobs Code Mode is meant for, so it is a fair first test of whether it fits your app.

    In this project, use Code Mode for tweak a single Tailwind class without a prompt. Build the smallest version that a real user could complete end to end, keep the change scoped to that path, and tell me how to test it myself.

    Expected outcome

    One complete path a user can walk, the files and settings that changed, and the steps to test it. Walk it yourself before you ship it.

  3. Review it before you publish

    Code Mode is wired in and you are about to put it in front of people. This is the pass that catches the half-configured version.

    Review how this project uses Code Mode before I publish. Check file tree browser with diff view and in-place text editing with syntax highlighting, list anything that is missing, misconfigured, or only half wired, fix what is safe to fix, and tell me what you left alone and why.

    Expected outcome

    A findings list split into what was fixed and what was left, with a reason for each. Anything left alone is yours to decide on.

  4. Read a generated Supabase migration before approving

    A second job the record lists for Code Mode, useful once the first path works.

    Extend this project so Code Mode also covers read a generated Supabase migration before approving. Reuse what is already wired rather than adding a parallel setup, and tell me what you reused and what is new.

    Expected outcome

    A second path built on the same setup, plus a note on what was shared and what was added.

Capabilities

  • File tree browser with diff view
  • In-place text editing with syntax highlighting
  • Round-trip safe with Agent Mode

Use cases

  • Tweak a single Tailwind class without a prompt
  • Read a generated Supabase migration before approving

The link to lovable.dev uses a referral code. The atlas is otherwise unsponsored.

Frequently asked

  • What is Code Mode?

    Code Mode is Lovable's Editor feature: Inspect and edit project code directly inside Lovable. View and edit your project's underlying codebase from inside Lovable — inspect files, make targeted edits, troubleshoot without exporting or switching tools.

  • Is Code Mode GA or in beta?

    Code Mode is generally available (GA) on Lovable.

  • What Lovable plan includes Code Mode?

    Code Mode is available on Lovable's Paid plans plan.

  • When did Code Mode launch?

    Code Mode launched on May 7, 2026.

Related in Editor

See all →
Post on XLinkedIn

What Lovable Shipped

One email a week. Every new feature. Nothing else.

A curated Monday roundup of every Lovable feature added or promoted to GA in the past week — pulled straight from the atlas.

No spam. Unsubscribe anytime. Independent, not affiliated with Lovable AB.