1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
# swarm.moe design-language
Conservative Starsector-derived baseline for shared UI language.
## Scope (v0.1)
- 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
## 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`
- `assets/fonts/*.woff2`
## 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
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.
|