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

# Templates

> Use Rey's pre-built app templates to launch common app types in minutes, then customize every screen, component, and data source to make them your own.

Templates are pre-built app starting points that give you a complete, working foundation for the most common types of mobile and web apps. Instead of creating every screen and setting up your data structure from scratch, you choose a template that matches your idea, and Rey sets up the screens, sample data, and components for you — ready to customize.

## What templates include

Every Rey template ships with a complete set of assets so you can start editing immediately rather than building from zero:

<CardGroup cols={3}>
  <Card title="Pre-built Screens" icon="mobile-screen">
    A full set of designed screens for the app type — home, detail, profile, settings, and more — already wired together with navigation.
  </Card>

  <Card title="Sample Data" icon="database">
    Pre-configured tables with realistic sample entries so every list, card, and detail view shows real-looking content from the moment you open the editor.
  </Card>

  <Card title="Configured Components" icon="puzzle">
    Components already placed on each screen, bound to the sample data, and styled consistently — giving you a working app you can preview immediately.
  </Card>
</CardGroup>

## Browsing and choosing a template

<Steps>
  <Step title="Create a new app">
    From your Rey dashboard, click **New App**. You'll see two options: **Choose a template** or **Start blank**.
  </Step>

  <Step title="Choose a template">
    Select **Choose a template** to browse the full template library — audio content apps, AI chat apps, tracking apps, and more.
  </Step>

  <Step title="Preview a template">
    Click any template card to open a preview. The preview shows the included screens so you can confirm the template fits your vision before committing.
  </Step>

  <Step title="Create your project">
    Confirm your choice to spin up the project. Rey copies the template's screens, data structure, and assets into your new app in a few seconds.
  </Step>
</Steps>

<Note>
  Choosing a template does not lock you in. Every element — screens, components, colors, data tables, navigation — is fully editable after the project is created.
</Note>

## Customizing a template

Once your project opens in the editor, the template is yours to reshape however you like. Here's a suggested order for making a template feel like your own app:

<Steps>
  <Step title="Update branding">
    Open the [Design](/building/design) panel (paintbrush icon in the top toolbar) and use the **Styles** tab to set your **Main font** and adjust the color palette — Primary, Secondary, Tertiary, Screens, Text, and Containers. Every screen and component picks up these values instantly.
  </Step>

  <Step title="Edit screen content">
    Click any text label, image, or icon on the canvas and update it directly. Use the **Settings** tab in the property toolbar above the selection to swap copy, images, or bindings.
  </Step>

  <Step title="Swap sample data for real data">
    Open the **Data** panel (database icon in the top toolbar), then delete or edit the sample entries and add your own. See [Tables](/data/tables) if you need to add new tables or fields.
  </Step>

  <Step title="Add, remove, or rearrange screens">
    In the [Design](/building/design) panel, open the **Objects** tab to see every screen in a tree. Delete screens you don't need, rename the ones you're keeping, and add new ones with the **+ button** in the bottom-right of the canvas under the **Screen** category.
  </Step>

  <Step title="Adjust navigation">
    In the [Design](/building/design) panel, open the **Navigation** tab to set your **Start screen** and choose which screens appear in the bottom tab bar via **Included** and **Excluded**.
  </Step>
</Steps>

## Starting from scratch vs. using a template

Not sure which path to take? Here's a quick comparison:

<AccordionGroup>
  <Accordion title="Start from a template — best when...">
    * Your app idea maps closely to a common app type (directory, marketplace, booking, social feed, etc.)
    * You want to move fast and have a working prototype quickly
    * You're new to Rey and want to see best-practice structure and data binding in action
    * You plan to customize heavily — templates are a starting point, not a constraint
  </Accordion>

  <Accordion title="Start from scratch — best when...">
    * Your app has a highly unique structure that doesn't fit any template
    * You want full control over the data model and screen architecture from day one
    * You're rebuilding an existing app you know inside and out
    * You prefer to build incrementally and learn each part of Rey as you go
  </Accordion>
</AccordionGroup>

<Tip>
  After selecting a template, use **Rey AI** to generate additional screens that match the template's style. Describe the screen you need — for example, *"A reviews page where users can leave a star rating and a comment"* — and Rey AI adds it to your project, already styled to match your existing screens.
</Tip>
