v0.0.01b

.design/system/BRAND-SYSTEM.md

@@ -0,0 +1,53 @@
+# Malenia — brand system
+
+Generated by the branding-agent engine from a single **seed** (20 fields).
+Everything below is *derived* — no token here was hand-authored.
+
+- **slug:** `malenia`
+- **source:** https://malenia.space/
+- **primary seed color:** `#c9a84c`
+- **derived tokens per theme:** 218
+- **themes:** default · dark · compact (same seed, different algorithm)
+
+## Files
+
+| Path | What it is |
+| --- | --- |
+| `seed.json` | Generated snapshot of the effective seed; persistent overrides live in `brand.json.seed`. |
+| `tokens.default.json` | Full derived DesignTokens (light). |
+| `tokens.dark.json` | Same seed, dark algorithm. |
+| `tokens.compact.json` | Same seed, compact (dense) algorithm. |
+| `variables.css` | `:root{}` + `.dark{}` CSS custom properties (`--brand-*`). |
+| `variables.dark.css` | Standalone `:root{}` for the dark theme. |
+| `theme.json` | antd `ConfigProvider` theme (token + algorithm). |
+| `kit.html` | Themed component showcase (light). |
+| `kit.dark.html` | Themed component showcase (dark). |
+| `artifacts/landing.html` | Full landing page (hero → features → pricing → FAQ → CTA). |
+| `artifacts/deck.html` | 9-slide 16:9 pitch deck with keyboard navigation. |
+| `artifacts/poster.html` | 3:4 print-style poster. |
+| `artifacts/email.html` | A marketing email. |
+| `artifacts/newsletter.html` | Multi-story digest email. |
+| `artifacts/form.html` | Split-screen contact / signup page. |
+| `index.html` | Gallery linking everything + live component preview. |
+
+## How to re-theme
+
+The whole system is regenerated from `brand.json` and optional
+`brand.json.seed` overrides. Persist authored overrides there, then run
+`od brand finalize <brand-id>` — every downstream token, component and artifact
+follows. Do not edit `system/seed.json` directly; finalize replaces it.
+
+- **Change the brand color:** edit the accent role or `seed.colorPrimary` in `brand.json`.
+  The 10-step palette, all interaction states, the primary background/border and
+  every component that references `var(--brand-color-primary)` update together.
+- **Light → dark:** the dark theme is the same seed run through the `"dark"`
+  algorithm — load `variables.dark.css` (or add the `.dark` class).
+- **Density:** the `"compact"` algorithm tightens spacing & control heights
+  while keeping colors identical.
+
+## Add a new artifact type
+
+`renderArtifact(kind, brand, tokens)` already accepts every `AssetKind`
+(`landing | deck | poster | email | newsletter | form`). Add the kind to the
+build's artifact list to ship it in the bundle; kinds without a bespoke layout
+fall back to a sensible card+button page.