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

# Quickstart

> Go from zero to pulling design tokens into your codebase in under five minutes.

Get your design tokens into your codebase in three steps.

## Prerequisites

* A [Humic](https://humic.dev) account
* [Node.js](https://nodejs.org) 18 or later

## Step 1: Log in

```bash theme={null}
npx @humicdev/cli login
```

This opens your browser to authenticate. After signing in, your credentials are saved locally.

## Step 2: Create a design system

If you already have a design system on Humic, skip to step 3.

```bash theme={null}
npx @humicdev/cli new --template tailwind
```

Pick your organization and name your design system. The `--template` flag seeds it with a starter set of tokens — choose from `blank`, `tailwind`, `bootstrap`, or `material`.

## Step 3: Pull tokens

Initialize Humic in your project and pull the tokens:

```bash theme={null}
npx @humicdev/cli init
npx @humicdev/cli pull
```

This writes your design tokens as CSS custom properties (and optionally a Tailwind config) to your project. You'll see files like:

```
humic.config.json        # Project configuration
tokens/variables.css     # CSS custom properties
tokens/tailwind.config.ts # Tailwind theme (if applicable)
```

## Keep tokens in sync

Run watch mode to automatically update files when tokens change:

```bash theme={null}
npx @humicdev/cli sync --watch
```

Or add a CI check to catch drift:

```bash theme={null}
npx @humicdev/cli sync --check
```

## What's next?

<CardGroup cols={2}>
  <Card title="API Reference" icon="code" href="/api-reference/authentication">
    Integrate Humic into your own tools with the REST API.
  </Card>

  <Card title="Export Formats" icon="file-export" href="/export-formats/css">
    CSS, JSON (W3C), and Tailwind export options.
  </Card>

  <Card title="AI Agents" icon="robot" href="/integrations/ai-agents">
    Use Humic with Claude Code, Cursor, and other AI coding agents.
  </Card>
</CardGroup>
