tokens/docs/README.md
NotAShelf 806b76fb37
docs: provide preview of the preview script for previewing color output
Signed-off-by: NotAShelf <raf@notashelf.dev>
Change-Id: Ib082597066892f250696b32d649e55346a6a6964
2026-05-02 20:00:24 +03:00

1.4 KiB

@frozendev/tokens

Single source of truth for FrozenDev color system. You may use the sources in tokens/ and run pnpm run build to generate outputs. Every platform gets an up-to-date file. No manual syncing.

Powered by Design Dictionary. Please see the documentation for additional configuration options and usage details.

Editing tokens

All changes start in tokens/:

  • New colour stop -> add to tokens/color.json
  • Semantic role change-> edit tokens/semantic.json
  • Never edit anything in outputs/ directly. It will be overwritten on the next build

After editing:

# Execute the build script in scripts/build.mjs
$ pnpm run build   # regenerates all outputs

Commit both tokens/ and outputs/ so the CDN/raw GitHub URL paths keep working.

Local development

# This repository is designed to work with pnpm. Prefer it over npm or yarn.
$ pnpm install
$ pnpm run build

Outputs land in outputs/.

Previewing Colors

A preview script is provided in scripts/preview.mjs that you can invoke with pnpm preview. It will generate a HTML page in build/ that you can open with your browser to preview the colors before publishing any packages.

Preview of a preview