# UI design system toolkit

> Generates design tokens from a brand colour, checks contrast, does responsive type maths and writes developer handoff specs.

Canonical: https://mikereams.com/ai/ui-design-system

Skill · Curated · Design systems · updated 2026-08-20. Part of the [AI Library](https://mikereams.com/ai).

What you get: A token set (colour ramps, type scale, spacing, motion) and a handoff spec a developer can build from without asking a question.

- This site's own tokens came out of its generator, then a contrast pass on every text pair.
- I run a condensed version of the skill.

Source: [alirezarezvani/claude-skills](https://github.com/alirezarezvani/claude-skills) by Alireza Rezvani (MIT). Not hosted here.

Reviewed 2026-08-20.

Tags: design tokens, contrast, type scale, handoff