malenia-frontend/.design/system/BRAND-SYSTEM.md

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.