---
url: https://brand.okrado.com/tokens/downloads/
title: Token downloads
description: The token files in every format, and the npm package they ship in.
kind: how-to
owner: Ghassen-Hizem
updated: 2026-11-03
review_by: 2027-02-28
audience:
  - developer
  - agent
---

# Token downloads

> The token files in every format, and the npm package they ship in.

The tokens ship as the npm package `@okrado/brand`, published to GitHub Packages for the organisation’s repositories. The files below are the same build, served for people and agents without an install.

| File                                                            | For                                                      |
| --------------------------------------------------------------- | -------------------------------------------------------- |
| [`ui.css`](https://brand.okrado.com/downloads/ui.css)           | CSS variables for light, dark, system and both densities |
| [`tokens.json`](https://brand.okrado.com/downloads/tokens.json) | resolved values by mode and density                      |
| [`theme.css`](https://brand.okrado.com/downloads/theme.css)     | the Tailwind theme that maps utilities to the variables  |

## Use them

In a product, install the package and import the CSS once:

app.css

```css
@import "@okrado/brand/web/ui.css";
@import "@okrado/brand/web/tailwind/theme.css";
```

Set the mode and density on the root element; never write a colour value:

index.html

```html
<html data-mode="system" data-density="comfortable" lang="en" dir="ltr">
```

A token you need that does not exist is a change in `okrado/brand`: change `brand.yaml` and regenerate, never a local value.