> ## Documentation Index
> Fetch the complete documentation index at: https://docs.lovable.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# View and edit project code

> View and manually edit your project’s source code directly in the Lovable code editor.

This feature gives you direct access to your project’s underlying codebase. You can inspect files, make targeted edits, and troubleshoot issues without switching tools or exporting your project.

<img src="https://mintcdn.com/lovable-f9060f1e/Zp1yxsvlMEaJMPBK/images/build-code-editor.png?fit=max&auto=format&n=Zp1yxsvlMEaJMPBK&q=85&s=1ce1b3c4cc637363a925442423cb212d" alt="Build Code Editor" title="Build Code Editor" style={{ width:"54%" }} width="798" height="606" data-path="images/build-code-editor.png" />

### What you can do

From the code editor view, you can:

* Browse your full project file structure
* Search across files and jump to specific components
* Inspect and <Tooltip tip="Only on paid plans">edit files</Tooltip> directly
* Format code
* Copy file content
* Download files
* <Tooltip tip="Available to editors on all paid plans.">Download the full project codebase as a ZIP</Tooltip>
* Reference files in chat to make targeted edits and discussions faster and clearer

<Tip>
  **Mention code files in chat**. \
  Type `@ `or click the **reference file in chat** button in the code editor to mention specific files. For example: \
  `@src/components/UserProfile.tsx add a loading state here`
</Tip>

### Good to know

* Changes made here immediately affect your project
* Code editing is available on paid plans only
* This is intended for manual adjustments and is not required when building in Agent mode
