Every Delta site has one design system. It holds the colors, type, spacing and component styles that every page draws on.
The theme ships a starting point. Your edits land on top of it, per site, and survive theme updates.
What is in it
| Part | Holds |
|---|---|
| Design tokens | The raw values: colors, type scale, spacing, radii |
site.css |
Element defaults and site-wide patterns |
components.css |
Styles for your components |
site.js |
The site’s JavaScript |
| Notes | Design decisions that outlive a session |
| Components | Markup recipes the agent reuses |
There is one generated file the agent never edits, tokens.css, which turns your tokens into CSS variables. Change a token and it regenerates.
The site-wide header and footer markup sits outside this set, under Delta → Scripts.
Where to look
Delta → Design shows the style guide and the snapshots. It is a view, not an editor: the agent writes these files, you read them and ask for changes.
Asking for changes
“Restyle the site: warmer neutrals, one accent, more generous spacing. Keep the type as it is.”
“Our brand colors are {list them}. Rebuild the palette around them.”
“Turn this card layout into a component so we can reuse it.”
“Write into the design notes that clients’ logos always sit on a light surface.”
The agent reads the existing CSS before writing, because that CSS is the record of what the classes already mean. It prefers an existing token or component to inventing a new one.
Notes
Notes are the constraints you want remembered: a rule about contrast, a decision about when to use a particular section style. The agent reads them at the start of design work and will ask before writing to them. If a note contradicts what is actually built, it raises that rather than quietly picking a side.
What Delta refuses
Two rules are enforced when the agent writes, not left to discipline.
A page cannot carry a raw color. Every fill, text color, border and shadow points at the design system, so a restyle reaches every page.
Color contrast is a floor. When the agent changes the palette, Delta checks each ink against both the page background and the subtle section background, and rejects the change if text falls below 4.5:1, or 3:1 for large text and borders, naming the pair that failed. Sizes are not policed this way: a one-off measurement on a hero is a legitimate design choice.
Every write is undoable
A design write takes a snapshot of the previous state as it goes. You do not take one first, and you do not need to remember to. If a restyle goes the wrong way, restoring the last snapshot puts it back.
For developers
The theme seed is design-system/base/; live state is uploads/21press-delta/site/. tokens.json carries the values plus locked _meta, _accepts and _desc keys that describe each name’s job; update-tokens writes values only. site.css, components.css and site.js are written with patch-site-assets / set-site-assets, notes with patch-notes / set-notes, components with patch-component / upsert-component.
Composed values are declared once as a custom property in site.css and referenced after, using bare names such as --card-bg, since the --color-* namespace belongs to tokens.json. Off-scale sizes derive from a token with calc() rather than a computed number.