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

# Code

> View and edit the code behind your site with Fimo’s online editor.

The **Code** tab lets you see and manage the code that powers your site.\
Every project generated by Fimo comes with a complete codebase you can explore directly in the browser.

<img src="https://mintcdn.com/strapi/rjp0h56uFxJ7sezi/public/images/fimo-code.png?fit=max&auto=format&n=rjp0h56uFxJ7sezi&q=85&s=91a6220bf2dd6daff45e112451ce8b61" alt="Code Tab" width="3144" height="2020" data-path="public/images/fimo-code.png" />

## Key features

* **View code**: browse the files and understand how your site is structured
* **Edit code**: make changes directly in the online editor, no setup needed
* **Delete code**: remove files you no longer need
* **Real-time updates**: edits are applied instantly in Preview so you can test changes right away

<Tip>
  The Code tab works just like a lightweight IDE in your browser — fast, collaborative, and always connected to your project.
</Tip>

## Why it matters?

<Columns cols={2}>
  <Card title="Transparency" icon="eye">
    See the exact code generated by Fimo.
  </Card>

  <Card title="Full control" icon="hand">
    Edit or delete code to customize your site.
  </Card>

  <Card title="Instant feedback" icon="bolt">
    Preview updates as soon as you save changes.
  </Card>

  <Card title="No setup required" icon="laptop-code">
    Everything runs in the browser, no local environment needed.
  </Card>
</Columns>

<Note>
  The code is **yours**. Fimo generates it, but you own it. Your project’s codebase is fully editable and under your control.
</Note>

## Workflow at a glance

<Steps>
  <Step title="Open the Code tab">
    Access all project files directly in the online editor.
  </Step>

  <Step title="Edit or delete files">
    Make changes, remove unused code, or add new logic.
  </Step>

  <Step title="See updates instantly">
    Changes appear right away in the Preview window.
  </Step>
</Steps>

## What’s next?

<Columns cols={2}>
  <Card title="Edit online" icon="pen-to-square" href="/code/edit">
    Make changes to your code directly in the browser editor.
  </Card>

  <Card title="Sync with GitHub" icon="github" href="/code/github-sync">
    Coming soon: connect your project to GitHub for version control and collaboration.
  </Card>
</Columns>