diff options
| author | main <main@swarm.moe> | 2026-03-19 17:50:15 -0400 |
|---|---|---|
| committer | main <main@swarm.moe> | 2026-03-19 17:50:15 -0400 |
| commit | a5a397de64f45a653457e9654c33465577f9e24e (patch) | |
| tree | 1e34987e52a6a2d7e8606975f08d79e10d6bd7cf /README.md | |
| parent | 6dd5dcea5204627ef08b6d00cd17abd30bf187e0 (diff) | |
| download | design-language-main.zip | |
Diffstat (limited to 'README.md')
| -rw-r--r-- | README.md | 38 |
1 files changed, 11 insertions, 27 deletions
@@ -1,39 +1,23 @@ -# swarm.moe design-language +# design-language -Conservative Starsector-derived baseline for shared UI language. +Shared visual baseline for swarm.moe surfaces. -## Scope (v0.1) +## Scope - frame geometry and material vocabulary -- frame palette (background, edges, glow, zero roundedness) -- typography families (`Remnant UI`, `Remnant Mono`) -- control skin primitives (range slider, checkbox, scrollbar) -- lightweight layout helpers for control rows (`.range-field`, `.range-value`, `.check-control`) - -## Explicitly Out Of Scope (v0.1) - -- product-specific spacing and layout systems -- semantic status channels (success/warn/error) -- app-specific color-picking UIs and interaction models +- palette, typography, and shared surface primitives +- control skin primitives for inputs and interactive chrome ## Artifacts -- `tokens/starsector-dark.frame-font.tokens.json` -- `tokens/starsector-dark.controls.tokens.json` - `css/starsector-dark.frame-font.css` - `css/starsector-dark.controls.css` -- `examples/frame-font-preview.html` +- `tokens/*.json` - `assets/fonts/*.woff2` +- `examples/frame-font-preview.html` -## Consumption - -1. Copy or import `css/starsector-dark.frame-font.css`. -2. Optionally add `css/starsector-dark.controls.css` for control theming. -3. Apply `.swarm-frame`, `.swarm-surface`, `.swarm-surface-elevated`, `.swarm-frame-header` where needed. -4. Use `--swarm-font-ui` and `--swarm-font-mono` or helper classes. -5. For control rows, use `.range-field`, `.range-value`, and `.check-control`. - -## Notes +## Use -Token values are derived from the Starsector dark baseline in `/home/main/swarm-ui`. -Control styling values are tuned to stay palette-compatible with that baseline. +1. Import `css/starsector-dark.frame-font.css`. +2. Optionally import `css/starsector-dark.controls.css`. +3. Apply `.swarm-frame`, `.swarm-surface`, `.swarm-surface-elevated`, and `.swarm-frame-header` where needed. |