Bubble Mobile Farbpalette

Bubble Mobile ist eine Palette aus 6 Farben, die auf Blautöne, Neutraltöne, Rottöne und Gelbtöne aufbaut. In OKLCH reicht die Helligkeit von 25 % (#132330, sehr dunkel) bis 95 % (#E3F1FD, sehr hell), und die gesättigtste Farbe, #5A7B96, ist gedämpft. Ihre chromatischen Farben verteilen sich gleichmäßig auf die warme und die kühle Seite des Farbkreises. 5 ihrer 15 Farbpaare erreichen das WCAG-AA-Verhältnis von 4,5:1 für Fließtext. Sie ist getaggt mit kinder, blau, rot, gedämpft, erdig und neutral.

KinderBlauRotGedämpftErdigNeutral

Farbcodes

FarbeHEXRGBHSLOKLCH
Oxford Blue #132330 rgb(19, 35, 48) hsl(207, 43%, 13%) oklch(24.9% 0.033 244.2)
Onyx #4E3F32 rgb(78, 63, 50) hsl(28, 22%, 25%) oklch(38% 0.03 62.7)
Cerulean #5A7B96 rgb(90, 123, 150) hsl(207, 25%, 47%) oklch(56.8% 0.056 243.7)
Pewter #BD9387 rgb(189, 147, 135) hsl(13, 29%, 64%) oklch(69.9% 0.054 36.5)
Ash Gray #CBC5A8 rgb(203, 197, 168) hsl(50, 25%, 73%) oklch(82.1% 0.04 97.5)
Anti-Flash White #E3F1FD rgb(227, 241, 253) hsl(208, 87%, 94%) oklch(95.1% 0.022 243.8)

Barrierefreiheit

Die besten Text-Hintergrund-Paare in Bubble Mobile, nach WCAG-2-Kontrastverhältnis, mit dem APCA-Helligkeitskontrast (Lc) des Textes auf seinem Hintergrund.

PaarWCAG 2StufeAPCA Lc
#E3F1FD auf #132330 13.94:1 AAA Lc -95.0
#132330 auf #CBC5A8 9.22:1 AAA Lc 69.2
#E3F1FD auf #4E3F32 8.78:1 AAA Lc -87.0

Farbsehen

Kein Farbpaar kommt bei Protanopie, Deuteranopie, Tritanopie oder Achromatopsie auf ΔE 0.06 an eine andere Farbe 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/132330-4e3f32-5a7b96-bd9387-cbc5a8-e3f1fd.json.

Mach sie zu deiner

Bearbeite die Farben, baue daraus ein vollständiges helles und dunkles Farbsystem oder sieh sie in echter UI.

Im Generator öffnen Farbsystem erstellen Visualisieren

Farbverläufe aus diesen Farben