# Documentation

URL: /chirp-ui/docs/
Section: docs
Description: Everything you need to know about chirp-ui

---

> For a complete page index, fetch /chirp-ui/llms.txt.

## Learn chirp-ui

<div class="chirpui-grid chirpui-grid--cols-2 chirpui-grid--gap-md chirp-theme-directive-cards">
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./get-started/">Get Started</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Install chirp-ui and wire it into your Chirp app.</p>
    </div>
  </article>
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="/showcase/">Component showcase</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Browse every macro and pattern in a static, offline-friendly gallery.</p>
    </div>
  </article>
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./components/">Components</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Layout, UI, forms, streaming, and dashboard components.</p>
    </div>
  </article>
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./theming/">Theming</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>CSS variables, dark mode, and customization.</p>
    </div>
  </article>
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./app-shell/">App Shell</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Sidebar, breadcrumbs, command palette, and layout patterns.</p>
    </div>
  </article>
</div>

---

## Reference

<div class="chirpui-grid chirpui-grid--cols-2 chirpui-grid--gap-md chirp-theme-directive-cards">
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./about/">About</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Architecture, Chirp integration, and thread safety.</p>
    </div>
  </article>
  <article class="chirpui-card chirp-theme-directive-card">
    <header class="chirpui-card__header">
      <div class="chirpui-card__header-content">
        <a class="chirpui-card__title" href="./components/">Component Reference</a>
      </div>
    </header>
    <div class="chirpui-card__body">
      <p>Generated component categories, options, and manifest-backed reference surfaces.</p>
    </div>
  </article>
</div>