Registrieren Registrieren
Chromat26

Chromat26

Palette mit 12 Farben · Warm · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

Chromat26

Palette mit 12 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten
Lebendig 12 Farben Warm Gemischt Komplementär vibrant collab newyearsglamourcontest 2026
Likes 11
Farben 12

CSS-Variablen

:root {
  --c-vibrant-1: #262A31;
  --c-vibrant-2: #063F28;
  --c-vibrant-3: #A909BC;
  --c-vibrant-4: #F5004C;
  --c-vibrant-5: #69676F;
  --c-vibrant-6: #D842BD;
  --c-vibrant-7: #21B748;
  --c-vibrant-8: #F57A13;
  --c-vibrant-9: #A0A3B7;
  --c-vibrant-10: #8AF6FF;
  --c-vibrant-11: #EAE94F;
  --c-vibrant-12: #FFFFFF;
}

Über diese Palette

Diese lebendige Palette mit 12 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Blue Charcoal (#262A31). Sie vereint Blue Charcoal, Angel Green, Heliotrope Magenta, Pink Red, Quiet Shade, Purple Pink, Vegan Mastermind, Liquid Lava, Royal Mile, Shallow Water, Pineapple High und White in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 15 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #262A31 auf #FFFFFF mit 14,4:1.

Eine vielseitige Palette für Marketingseiten, Hero-Blöcke von Produkten, Illustrationen und Akzentzustände in der UI.

Farben im Detail

Blue Charcoal #262A31
RGB
rgb(38, 42, 49)
HSL
hsl(218, 13%, 17%)
Luminanz
0,023
Angel Green #063F28
RGB
rgb(6, 63, 40)
HSL
hsl(156, 83%, 14%)
Luminanz
0,038
Heliotrope Magenta #A909BC
RGB
rgb(169, 9, 188)
HSL
hsl(294, 91%, 39%)
Luminanz
0,123
Pink Red #F5004C
RGB
rgb(245, 0, 76)
HSL
hsl(341, 100%, 48%)
Luminanz
0,199
Quiet Shade #69676F
RGB
rgb(105, 103, 111)
HSL
hsl(255, 4%, 42%)
Luminanz
0,139
Purple Pink #D842BD
RGB
rgb(216, 66, 189)
HSL
hsl(311, 66%, 55%)
Luminanz
0,222
Vegan Mastermind #21B748
RGB
rgb(33, 183, 72)
HSL
hsl(136, 69%, 42%)
Luminanz
0,347
Liquid Lava #F57A13
RGB
rgb(245, 122, 19)
HSL
hsl(27, 92%, 52%)
Luminanz
0,334
Royal Mile #A0A3B7
RGB
rgb(160, 163, 183)
HSL
hsl(232, 14%, 67%)
Luminanz
0,371
Shallow Water #8AF6FF
RGB
rgb(138, 246, 255)
HSL
hsl(185, 100%, 77%)
Luminanz
0,785
Pineapple High #EAE94F
RGB
rgb(234, 233, 79)
HSL
hsl(60, 79%, 61%)
Luminanz
0,763
White #FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Luminanz
1,000

Kontrast & Barrierefreiheit

15 von 66 Farbpaaren erreichen die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext.

Aa #262A31 auf #FFFFFF 14,40:1 AAA
Aa #063F28 auf #FFFFFF 12,00:1 AAA
Aa #262A31 auf #8AF6FF 11,46:1 AAA
Aa #262A31 auf #EAE94F 11,16:1 AAA
Aa #063F28 auf #8AF6FF 9,55:1 AAA
Aa #063F28 auf #EAE94F 9,30:1 AAA
Aa #A909BC auf #FFFFFF 6,08:1 AA
Aa #262A31 auf #A0A3B7 5,77:1 AA
Aa #69676F auf #FFFFFF 5,57:1 AA
Aa #262A31 auf #21B748 5,44:1 AA
Aa #262A31 auf #F57A13 5,26:1 AA
Aa #A909BC auf #8AF6FF 4,84:1 AA
Aa #063F28 auf #A0A3B7 4,81:1 AA
Aa #A909BC auf #EAE94F 4,71:1 AA
Aa #063F28 auf #21B748 4,53:1 AA
Aa #69676F auf #8AF6FF 4,43:1 AA (großer Text)
Aa #063F28 auf #F57A13 4,39:1 AA (großer Text)
Aa #69676F auf #EAE94F 4,31:1 AA (großer Text)
Aa #F5004C auf #FFFFFF 4,21:1 AA (großer Text)
Aa #D842BD auf #FFFFFF 3,86:1 AA (großer Text)
Aa #262A31 auf #D842BD 3,73:1 AA (großer Text)
Aa #262A31 auf #F5004C 3,42:1 AA (großer Text)
Aa #F5004C auf #8AF6FF 3,35:1 AA (großer Text)
Aa #F5004C auf #EAE94F 3,26:1 AA (großer Text)
Aa #063F28 auf #D842BD 3,11:1 AA (großer Text)
Aa #D842BD auf #8AF6FF 3,07:1 AA (großer Text)
Aa #D842BD auf #EAE94F 2,99:1 Nicht bestanden
Aa #063F28 auf #F5004C 2,85:1 Nicht bestanden
Aa #F57A13 auf #FFFFFF 2,74:1 Nicht bestanden
Aa #21B748 auf #FFFFFF 2,65:1 Nicht bestanden
Aa #262A31 auf #69676F 2,59:1 Nicht bestanden
Aa #A0A3B7 auf #FFFFFF 2,49:1 Nicht bestanden
Aa #A909BC auf #A0A3B7 2,44:1 Nicht bestanden
Aa #262A31 auf #A909BC 2,37:1 Nicht bestanden
Aa #A909BC auf #21B748 2,30:1 Nicht bestanden
Aa #69676F auf #A0A3B7 2,23:1 Nicht bestanden
Aa #A909BC auf #F57A13 2,22:1 Nicht bestanden
Aa #F57A13 auf #8AF6FF 2,18:1 Nicht bestanden
Aa #063F28 auf #69676F 2,16:1 Nicht bestanden
Aa #F57A13 auf #EAE94F 2,12:1 Nicht bestanden
Aa #21B748 auf #8AF6FF 2,11:1 Nicht bestanden
Aa #69676F auf #21B748 2,10:1 Nicht bestanden
Aa #21B748 auf #EAE94F 2,05:1 Nicht bestanden
Aa #69676F auf #F57A13 2,04:1 Nicht bestanden
Aa #A0A3B7 auf #8AF6FF 1,98:1 Nicht bestanden
Aa #063F28 auf #A909BC 1,97:1 Nicht bestanden
Aa #A0A3B7 auf #EAE94F 1,93:1 Nicht bestanden
Aa #F5004C auf #A0A3B7 1,69:1 Nicht bestanden
Aa #F5004C auf #21B748 1,59:1 Nicht bestanden
Aa #A909BC auf #D842BD 1,57:1 Nicht bestanden
Aa #D842BD auf #A0A3B7 1,55:1 Nicht bestanden
Aa #F5004C auf #F57A13 1,54:1 Nicht bestanden
Aa #D842BD auf #21B748 1,46:1 Nicht bestanden
Aa #A909BC auf #F5004C 1,44:1 Nicht bestanden
Aa #69676F auf #D842BD 1,44:1 Nicht bestanden
Aa #D842BD auf #F57A13 1,41:1 Nicht bestanden
Aa #F5004C auf #69676F 1,32:1 Nicht bestanden
Aa #EAE94F auf #FFFFFF 1,29:1 Nicht bestanden
Aa #8AF6FF auf #FFFFFF 1,26:1 Nicht bestanden
Aa #262A31 auf #063F28 1,20:1 Nicht bestanden
Aa #F57A13 auf #A0A3B7 1,10:1 Nicht bestanden
Aa #A909BC auf #69676F 1,09:1 Nicht bestanden
Aa #F5004C auf #D842BD 1,09:1 Nicht bestanden
Aa #21B748 auf #A0A3B7 1,06:1 Nicht bestanden
Aa #21B748 auf #F57A13 1,03:1 Nicht bestanden
Aa #8AF6FF auf #EAE94F 1,03:1 Nicht bestanden

Ähnliche Paletten

#F9ED69 #F08A5D #B83B5E #6A2C70
4 Farben
#7D5A50 #B4846C #E5B299 #FCDEC0
4 Farben
#FFF8EA #9E7676 #815B5B #594545
4 Farben
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 Farben
#F67280 #C06C84 #6C5B7B #355C7D
4 Farben
#2B2E4A #E84545 #903749 #53354A
4 Farben
#E5D9B6 #A4BE7B #5F8D4E #285430
4 Farben
#A9907E #F3DEBA #ABC4AA #675D50
4 Farben