Studio Roadmap Farbpalette
Studio Roadmap ist eine Palette aus 5 Farben, die auf Türkis- und Cyantöne und Orangetöne aufbaut. In OKLCH reicht die Helligkeit von 27 % (#0B2B33, dunkel) bis 88 % (#AEE6DD, hell), und die gesättigtste Farbe, #E36414, ist leuchtend. 3 ihrer 5 chromatischen Farben liegen auf der kühlen Seite des Farbkreises. 2 ihrer 10 Farbpaare erreichen das WCAG-AA-Verhältnis von 4,5:1 für Fließtext. Sie ist getaggt mit technik, business, orange und warm.
- Oxford Blue #0B2B33
- Teal Green #1A8A8C
- Burnt Sienna #E36414
- Saffron #E2B559
- Celeste #AEE6DD
Farbcodes
| Farbe | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| Oxford Blue | #0B2B33 | rgb(11, 43, 51) | hsl(192, 65%, 12%) | oklch(27% 0.039 217.4) |
| Teal Green | #1A8A8C | rgb(26, 138, 140) | hsl(181, 69%, 33%) | oklch(57.7% 0.093 196.8) |
| Burnt Sienna | #E36414 | rgb(227, 100, 20) | hsl(23, 84%, 48%) | oklch(65.1% 0.177 45.7) |
| Saffron | #E2B559 | rgb(226, 181, 89) | hsl(40, 70%, 62%) | oklch(79.6% 0.122 83.2) |
| Celeste | #AEE6DD | rgb(174, 230, 221) | hsl(170, 53%, 79%) | oklch(88.4% 0.058 184) |
Barrierefreiheit
Die besten Text-Hintergrund-Paare in Studio Roadmap, nach WCAG-2-Kontrastverhältnis, mit dem APCA-Helligkeitskontrast (Lc) des Textes auf seinem Hintergrund.
| Paar | WCAG 2 | Stufe | APCA Lc |
|---|---|---|---|
| #AEE6DD auf #0B2B33 | 10.77:1 | AAA | Lc -81.4 |
| #0B2B33 auf #E2B559 | 7.81:1 | AAA | Lc 63.1 |
| #0B2B33 auf #E36414 | 4.33:1 | AA groß | Lc 38.5 |
Farbsehen
1 Farbpaar kommt in mindestens einer Simulation auf ΔE 0.06 aneinander heran.
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/0b2b33-1a8a8c-e36414-e2b559-aee6dd.json.
Mach sie zu deiner
Bearbeite die Farben, baue daraus ein vollständiges helles und dunkles Farbsystem oder sieh sie in echter UI.