> ## Documentation Index
> Fetch the complete documentation index at: https://araf.badr.co.id/llms.txt
> Use this file to discover all available pages before exploring further.

# A-raf Design System

> Panduan komponen, token, dan pola desain untuk membangun produk A-raf secara konsisten.

## Komponen

Dokumentasi lengkap setiap komponen UI — termasuk variant, ukuran, state, props, dan panduan penggunaan.

<CardGroup cols={2}>
  <Card title="Button" icon="hand-pointer" href="/components/button">
    Tombol interaktif untuk memicu aksi, tersedia dalam 7 hierarki dan 5 ukuran.
  </Card>

  <Card title="Tables" icon="table" href="/components/tables">
    Tabel data fleksibel dengan 20+ variasi cell style, 2 tipe header, dan 3 state interaksi.
  </Card>

  <Card title="Metric Cards" icon="chart-bar" href="/components/metric-cards">
    Kartu ringkasan data metrik untuk dashboard, tersedia dalam 4 tipe dan 2 kondisi trend.
  </Card>

  <Card title="Header Navigation" icon="bars" href="/components/header-navigation">
    Navigasi utama di bagian atas halaman, tersedia dalam 7 tipe layout dan 2 breakpoint.
  </Card>

  <Card title="Sidebar Navigation" icon="sidebar" href="/components/sidebar-navigation">
    Navigasi samping aplikasi dengan dukungan 3 tema warna dan 2 gaya tampilan.
  </Card>
</CardGroup>