waffle, verdrahtet
Diese Seite ist die Kontrolle, nicht das Produkt. Sie zeigt, dass Tokens, Schriften und Komponenten aus AisuStudio/waffle im Projekt ankommen, und dokumentiert die vier Stellen, an denen SolarKreis eine eigene Entscheidung getroffen hat. v1 ist bewusst nur hell.
Rollen-Tokens
Datenkodierung
Die Flavor-Rampen sind waffles dritte Farbebene. Sie kodieren Bedeutung im Inhalt und werden nie zu Chrome. Der Punkt im Chip trägt die volle Sättigung — also die echte Linienfarbe. Die Füllung liegt eine Stufe blass, damit das Label in Ink lesbar bleibt.
Warum jede Flusslinie eine Fassung bekommt
WCAG 1.4.11 will 3:1 für bedeutungstragende Grafik gegen ihren Grund. Gegen vanilla messen die vier Linienfarben 4.17 · 2.65 · 3.58 · 4.31 — write fällt durch, und write ist die Linie, auf die es hier am meisten ankommt. Statt den Farbwert zu verbiegen bekommt jede Linie eine dünne Ink-Fassung: die Fassung trägt den Kontrast, der Farbton trägt weiter die Bedeutung.
Kontrast der Rampen gegen Ink
Level 2 quer über alle vier Flavors ist der einzige Level, auf dem eine Füllung mit Ink-Label AA für Fließtext klärt. Deshalb liegen die Chips oben dort.
| Flavor | Level 1 | Level 2 | Level 3 | Level 4 | Level 5 |
|---|---|---|---|---|---|
| pistachio | 11.52 | 9.44 | 8.74 | 5.21 | 3.29 |
| mango | 12.16 | 10.93 | 9.25 | 7.08 | 5.19 |
| strawberry | 8.79 | 6.63 | 5.10 | 4.28 | 3.19 |
| raspberry | 9.87 | 7.76 | 6.19 | 4.88 | 3.84 |
Tailwind-Utilities
Die Tokens sind über @theme inline in Tailwind geöffnet. Kein Hex-Wert liegt doppelt — die Utility zeigt auf dieselbe Variable wie das CSS.