Token tooling

Advanced access to Toucan's data-only JSON preset.

This is not the application setup

React applications install only @toucan-ui/cli. Install the tokens package directly only when another design-token tool needs to read the raw preset JSON.

Install the data package

bash
pnpm add -D @toucan-ui/tokens

The package exports JSON data and package metadata. It does not export compiled CSS.

Resolve preset files

ts
import tokensPackage from '@toucan-ui/tokens/package.json' with { type: 'json' };

// Or resolve a known JSON file through the wildcard export:
const breakpointUrl = import.meta.resolve(
  '@toucan-ui/tokens/presets/default/raw/breakpoint.json',
);

Preserve the raw, alias, system, and optional dark directories when copying data into another pipeline.