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

# Templates

> Ready-to-use website and app templates.

Templates are complete, ready-to-use website and app projects — a full starting point rather than a single component. Some are free, some are paid.

## Finding Templates

Open **Templates** in the sidebar, or press `⌘K` / `Ctrl+K` and jump to the Templates tab. Each template card shows a live preview, its author, and price (if paid).

## What's on a Template

Each template listing includes:

* **Live preview** — a link to the working template so you can try it before you commit.
* **Description** — what the template is for and what it includes.
* **Price** — free, or a one-time price for paid templates.
* **Video** — an optional walkthrough of the template.

## Using a Template

<Steps>
  <Step title="Preview it">
    Open the template's live preview to see the real thing.
  </Step>

  <Step title="Get it">
    Free templates link straight to their source. For paid templates, use the
    checkout link on the listing to purchase and get access.
  </Step>

  <Step title="Start building">
    Follow the template's own README to run it locally and customize.
  </Step>
</Steps>

<Tip>
  **Bookmark templates** — Press `B` on any template to save it for later, and
  organize saved templates into lists.
</Tip>

## Publishing a Template

Have a template to share or sell? See [Publishing](/publishing/quick-start) — you can submit a listing with a preview URL, description, optional video, and a price with a checkout link for paid templates. For pricing details and other ways to monetize your profile, see [Monetization & Promotion](/publishing/monetization).

<CardGroup cols={2}>
  <Card title="Components" icon="https://mintcdn.com/21st/uLCB5kikM-FHl_zp/icons/nav/grid.svg?fit=max&auto=format&n=uLCB5kikM-FHl_zp&q=85&s=0d9b34d772968170c2388d8f2ce115be" href="/community/components" width="24" height="24" data-path="icons/nav/grid.svg">
    Browse React components
  </Card>

  <Card title="Themes" icon="https://mintcdn.com/21st/uLCB5kikM-FHl_zp/icons/nav/themes.svg?fit=max&auto=format&n=uLCB5kikM-FHl_zp&q=85&s=db61dc137b0a8e8afe97e340fcc8f736" href="/community/themes" width="24" height="24" data-path="icons/nav/themes.svg">
    Discover color schemes
  </Card>
</CardGroup>