A system that lives in a Figma library and a designer's head can't hold the bar when
machines generate the screens. So I write it down as rules an agent loads before it
touches a file: tokens, type, spacing, visual rules, voice. This page runs on the
system below.
# the system, as an agent reads it
accent: saulera amber #F59E0B · fill only, never headline text
radius: 0 everywhere · gradients: none · emoji: none
one accent per headline: an amber underline, one phrase
voice: first person, sentence case, British English
banned: transform, leverage, unlock, supercharge
→ agent loads rules → ships screens → gate checks them
Underneath: primitives beneath a semantic contract, components above. Components
touch only the contract, so a re-skin is a one-file swap. In my email platform, agents
built the densest surfaces against one token file and they read as one product.
See it in the email platform