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

# Pharen UI component library

> Install Pharen UI and use the shared Vue 3 components in your applications.

Pharen UI is the shared component library for Pharen products. It exposes accessible Vue 3 building blocks, Tailwind CSS tokens, and complex product patterns through `@pharen/ui`.

<Info>
  These docs reflect package version `0.0.18`.
</Info>

<CardGroup cols={2}>
  <Card title="Installation" icon="package-plus" href="/ui/installation">
    Install the package and load its styles once.
  </Card>

  <Card title="Components" icon="blocks" href="/ui/components">
    Browse every publicly exported UI component.
  </Card>

  <Card title="Styles and theming" icon="palette" href="/ui/theming">
    Customize colors, radius, and dark mode through tokens.
  </Card>

  <Card title="AI Components" icon="sparkles" href="/ui/ai">
    Build messages, tool calls, and agent states.
  </Card>
</CardGroup>

## Quick start

<Steps>
  <Step title="Install the package">
    `npm install @pharen/ui`
  </Step>

  <Step title="Load the styles">
    Import `@pharen/ui/styles.css` once in your app entrypoint.
  </Step>

  <Step title="Use a component">
    `import { Button } from '@pharen/ui'`
  </Step>
</Steps>