Brand framework generated from design tokens

A demo built for a specific brief. Not client work: the material shown is sample data, so what is on display is the mechanism.

I built a brand framework from one sample style guide of seven hex colors, two font names and six loose rules. It becomes 81 design tokens, each citing the line it came from, and from those tokens alone a six-page guide (foundations, color, typography, spacing and layout, components, usage rules), a what-changed page that sets 23 refinement decisions beside the original lines, and three mockups: a landing section, an app dashboard, and a 1080x1080 post with a 1080x1920 story. The tokens ship as CSS custom properties and two JSON token files, one in the W3C format and one Figma-style for a tokens plugin. All 62 text and color pairings pass AA contrast, the type scale is fitted at a 1.25 ratio, and every page reads at phone width without sideways scrolling.