Lullaby Stillness Farbpalette
Lullaby Stillness ist eine Palette aus 5 Farben, die auf Blautöne und Violetttöne aufbaut. In OKLCH reicht die Helligkeit von 24 % (#0F1E41, sehr dunkel) bis 86 % (#EFC2E7, hell), und die gesättigtste Farbe, #B394BF, ist mäßig gesättigt. 2 ihrer 5 chromatischen Farben liegen auf der kühlen Seite des Farbkreises. 3 ihrer 10 Farbpaare erreichen das WCAG-AA-Verhältnis von 4,5:1 für Fließtext. Sie ist getaggt mit kalt, farbverlauf, violett, ruhig und farbenblind-freundlich.
- Oxford Blue #0F1E41
- Charcoal #41426C
- Lavender Gray #786A97
- Cool Gray #B394BF
- Mimi Pink #EFC2E7
Farbcodes
| Farbe | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Oxford Blue | #0F1E41 | rgb(15, 30, 65) | hsl(222, 62%, 16%) | oklch(24.4% 0.07 264.4) |
| Charcoal | #41426C | rgb(65, 66, 108) | hsl(239, 25%, 34%) | oklch(39.8% 0.07 281.7) |
| Lavender Gray | #786A97 | rgb(120, 106, 151) | hsl(259, 18%, 50%) | oklch(55.5% 0.07 298.4) |
| Cool Gray | #B394BF | rgb(179, 148, 191) | hsl(283, 25%, 66%) | oklch(70.9% 0.07 316.5) |
| Mimi Pink | #EFC2E7 | rgb(239, 194, 231) | hsl(311, 58%, 85%) | oklch(86.4% 0.07 332.3) |
Barrierefreiheit
Die besten Text-Hintergrund-Paare in Lullaby Stillness, nach WCAG-2-Kontrastverhältnis, mit dem APCA-Helligkeitskontrast (Lc) des Textes auf seinem Hintergrund.
| Paar | WCAG 2 | Stufe | APCA Lc |
|---|---|---|---|
| #0F1E41 auf #EFC2E7 | 10.56:1 | AAA | Lc 75.6 |
| #0F1E41 auf #B394BF | 6.16:1 | AA | Lc 49.5 |
| #EFC2E7 auf #41426C | 6.10:1 | AA | Lc -66.0 |
Farbsehen
Kein Farbpaar kommt bei Protanopie, Deuteranopie, Tritanopie oder Achromatopsie auf ΔE 0.06 an eine andere Farbe heran. Sie ist als farbenblind-freundlich getaggt: Jedes Paar bleibt mindestens ΔE 0,14 auseinander.
Protanopie
Deuteranopie
Tritanopie
Achromatopsie
Im Code verwenden
Installiere diese Farben mit shadcn als Tailwind-CSS-v4-Theme-Farben: npx shadcn@latest add https://getcolors.so/r/palette/0f1e41-41426c-786a97-b394bf-efc2e7.json.
Mach sie zu deiner
Bearbeite die Farben, baue daraus ein vollständiges helles und dunkles Farbsystem oder sieh sie in echter UI.