(T)est (F)reak

(T)est (F)reak

Palette mit 12 Farben · Neutral · Gemischt · Harmonie: Triadisch

(T)est (F)reak

Palette mit 12 Farben · Temperatur: Neutral · Ton: Gemischt · Harmonie: Triadisch

Bearbeiten
Lebendig 12 Farben Neutral Gemischt Triadisch blue purple limited neon
Likes 55
Farben 12


CSS-Variablen

:root {
  --c-vibrant-1: #B3DAEE;
  --c-vibrant-2: #5560D9;
  --c-vibrant-3: #4F138A;
  --c-vibrant-4: #EA9CC4;
  --c-vibrant-5: #B44DAB;
  --c-vibrant-6: #802392;
  --c-vibrant-7: #430960;
  --c-vibrant-8: #18072A;
  --c-vibrant-9: #C0788A;
  --c-vibrant-10: #CDA8A8;
  --c-vibrant-11: #DED4D1;
  --c-vibrant-12: #A1FF71;
}

Über diese Palette

Diese lebendige Palette mit 12 Farben reicht vom hellsten Ton Lima (#A1FF71) bis zum dunkelsten Ton Quiet Abyss (#18072A). Sie vereint Soap Bubble, Thick Blue, Pitch Violet, Be My Valentine, Ultraviolet Nusp, Druchii Violet, Obsidian Shell, Quiet Abyss, Japanese Coral, Baby Jane, Light Weathered Hide und Lima in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 19 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #18072A auf #A1FF71 mit 15,47:1.

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


Farben im Detail

Soap Bubble #B3DAEE
RGB
rgb(179, 218, 238)
HSL
hsl(200, 63%, 82%)
Luminanz
0,659
Thick Blue #5560D9
RGB
rgb(85, 96, 217)
HSL
hsl(235, 63%, 59%)
Luminanz
0,153
Pitch Violet #4F138A
RGB
rgb(79, 19, 138)
HSL
hsl(270, 76%, 31%)
Luminanz
0,040
Be My Valentine #EA9CC4
RGB
rgb(234, 156, 196)
HSL
hsl(329, 65%, 76%)
Luminanz
0,453
Ultraviolet Nusp #B44DAB
RGB
rgb(180, 77, 171)
HSL
hsl(305, 41%, 50%)
Luminanz
0,180
Druchii Violet #802392
RGB
rgb(128, 35, 146)
HSL
hsl(290, 61%, 35%)
Luminanz
0,079
Obsidian Shell #430960
RGB
rgb(67, 9, 96)
HSL
hsl(280, 83%, 21%)
Luminanz
0,022
Quiet Abyss #18072A
RGB
rgb(24, 7, 42)
HSL
hsl(269, 71%, 10%)
Luminanz
0,005
Japanese Coral #C0788A
RGB
rgb(192, 120, 138)
HSL
hsl(345, 36%, 61%)
Luminanz
0,265
Baby Jane #CDA8A8
RGB
rgb(205, 168, 168)
HSL
hsl(0, 27%, 73%)
Luminanz
0,438
Light Weathered Hide #DED4D1
RGB
rgb(222, 212, 209)
HSL
hsl(14, 16%, 85%)
Luminanz
0,672
Lima #A1FF71
RGB
rgb(161, 255, 113)
HSL
hsl(100, 100%, 72%)
Luminanz
0,803

Kontrast & Barrierefreiheit

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

Aa #18072A auf #A1FF71 15,47:1 AAA
Aa #18072A auf #DED4D1 13,10:1 AAA
Aa #B3DAEE auf #18072A 12,86:1 AAA
Aa #430960 auf #A1FF71 11,79:1 AAA
Aa #430960 auf #DED4D1 9,98:1 AAA
Aa #B3DAEE auf #430960 9,80:1 AAA
Aa #4F138A auf #A1FF71 9,52:1 AAA
Aa #EA9CC4 auf #18072A 9,12:1 AAA
Aa #18072A auf #CDA8A8 8,85:1 AAA
Aa #4F138A auf #DED4D1 8,06:1 AAA
Aa #B3DAEE auf #4F138A 7,91:1 AAA
Aa #EA9CC4 auf #430960 6,95:1 AA
Aa #430960 auf #CDA8A8 6,75:1 AA
Aa #802392 auf #A1FF71 6,63:1 AA
Aa #18072A auf #C0788A 5,71:1 AA
Aa #4F138A auf #EA9CC4 5,61:1 AA
Aa #802392 auf #DED4D1 5,61:1 AA
Aa #B3DAEE auf #802392 5,51:1 AA
Aa #4F138A auf #CDA8A8 5,45:1 AA
Aa #430960 auf #C0788A 4,35:1 AA (großer Text)
Aa #5560D9 auf #A1FF71 4,20:1 AA (großer Text)
Aa #B44DAB auf #18072A 4,16:1 AA (großer Text)
Aa #EA9CC4 auf #802392 3,91:1 AA (großer Text)
Aa #802392 auf #CDA8A8 3,79:1 AA (großer Text)
Aa #B44DAB auf #A1FF71 3,72:1 AA (großer Text)
Aa #5560D9 auf #18072A 3,68:1 AA (großer Text)
Aa #5560D9 auf #DED4D1 3,56:1 AA (großer Text)
Aa #4F138A auf #C0788A 3,51:1 AA (großer Text)
Aa #B3DAEE auf #5560D9 3,49:1 AA (großer Text)
Aa #B44DAB auf #430960 3,17:1 AA (großer Text)
Aa #B44DAB auf #DED4D1 3,15:1 AA (großer Text)
Aa #B3DAEE auf #B44DAB 3,09:1 AA (großer Text)
Aa #5560D9 auf #430960 2,81:1 Nicht bestanden
Aa #C0788A auf #A1FF71 2,71:1 Nicht bestanden
Aa #4F138A auf #B44DAB 2,56:1 Nicht bestanden
Aa #5560D9 auf #EA9CC4 2,47:1 Nicht bestanden
Aa #802392 auf #C0788A 2,45:1 Nicht bestanden
Aa #5560D9 auf #CDA8A8 2,40:1 Nicht bestanden
Aa #802392 auf #18072A 2,33:1 Nicht bestanden
Aa #C0788A auf #DED4D1 2,29:1 Nicht bestanden
Aa #5560D9 auf #4F138A 2,27:1 Nicht bestanden
Aa #B3DAEE auf #C0788A 2,25:1 Nicht bestanden
Aa #EA9CC4 auf #B44DAB 2,19:1 Nicht bestanden
Aa #B44DAB auf #CDA8A8 2,13:1 Nicht bestanden
Aa #B44DAB auf #802392 1,78:1 Nicht bestanden
Aa #802392 auf #430960 1,78:1 Nicht bestanden
Aa #CDA8A8 auf #A1FF71 1,75:1 Nicht bestanden
Aa #EA9CC4 auf #A1FF71 1,70:1 Nicht bestanden
Aa #4F138A auf #18072A 1,63:1 Nicht bestanden
Aa #EA9CC4 auf #C0788A 1,60:1 Nicht bestanden
Aa #5560D9 auf #802392 1,58:1 Nicht bestanden
Aa #5560D9 auf #C0788A 1,55:1 Nicht bestanden
Aa #C0788A auf #CDA8A8 1,55:1 Nicht bestanden
Aa #CDA8A8 auf #DED4D1 1,48:1 Nicht bestanden
Aa #B3DAEE auf #CDA8A8 1,45:1 Nicht bestanden
Aa #4F138A auf #802392 1,44:1 Nicht bestanden
Aa #EA9CC4 auf #DED4D1 1,44:1 Nicht bestanden
Aa #B3DAEE auf #EA9CC4 1,41:1 Nicht bestanden
Aa #B44DAB auf #C0788A 1,37:1 Nicht bestanden
Aa #430960 auf #18072A 1,31:1 Nicht bestanden
Aa #4F138A auf #430960 1,24:1 Nicht bestanden
Aa #B3DAEE auf #A1FF71 1,20:1 Nicht bestanden
Aa #DED4D1 auf #A1FF71 1,18:1 Nicht bestanden
Aa #5560D9 auf #B44DAB 1,13:1 Nicht bestanden
Aa #EA9CC4 auf #CDA8A8 1,03:1 Nicht bestanden
Aa #B3DAEE auf #DED4D1 1,02:1 Nicht bestanden

Ähnliche Paletten

#EDF1D6 #9DC08B #609966 #40513B
4 Farben
#F5F7F8 #F4CE14 #495E57 #45474B
4 Farben
#222831 #393E46 #FFD369 #EEEEEE
4 Farben
#000000 #52057B #892CDC #BC6FF1
4 Farben
#213555 #3E5879 #D8C4B6 #F5EFE7
4 Farben
#F5EFE7 #D8C4B6 #4F709C #213555
4 Farben
#191A19 #1E5128 #4E9F3D #D8E9A8
4 Farben
#352F44 #5C5470 #B9B4C7 #FAF0E6
4 Farben