# Threads · Pro

Fine threads stretched across the frame, pinched together at both ends, that ripple on their own and bow toward the pointer as it passes. WebGL, written in the file.

This is a Charcoal UI Pro component. Its source and examples are available with a Pro seat: https://charcoalui.com/pricing

## With a Pro seat

1. Add the registry to components.json:

```json
{
  "registries": {
    "@charcoal": {
      "url": "https://charcoalui.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${CHARCOAL_LICENSE_KEY}"
      }
    }
  }
}
```

2. Copy your licence key from https://charcoalui.com/dashboard and put it in .env.local as CHARCOAL_LICENSE_KEY, then:

```bash
npx shadcn@latest add @charcoal/threads
```

To read Pro source through this MCP server, reconnect it with the header "Authorization: Bearer <licence key>".

## API — Threads
| Prop | Type | Default | Notes |
| --- | --- | --- | --- |
| `speed` | `number` | `1` | 0 holds still. |
| `color` | `string` | `"var(--foreground)"` |  |
| `lines` | `number` | `28` |  |
| `amplitude` | `number` | `1` |  |
| `spread` | `number` | `1` |  |
| `className` | `string` | — |  |

See it live: https://charcoalui.com/docs/components/threads