Watermelon 21

Watermelon 21

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

Watermelon 21

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

Bearbeiten
Lebendig 12 Farben Warm Gemischt Triadisch cute happy summer fruit
Likes 10
Farben 12


CSS-Variablen

:root {
  --c-vibrant-1: #EE0E66;
  --c-vibrant-2: #F25290;
  --c-vibrant-3: #FA9ABF;
  --c-vibrant-4: #FCE7F0;
  --c-vibrant-5: #F3DAA4;
  --c-vibrant-6: #A7B363;
  --c-vibrant-7: #808B2D;
  --c-vibrant-8: #397E09;
  --c-vibrant-9: #3F854F;
  --c-vibrant-10: #E9FAFE;
  --c-vibrant-11: #C4F9FD;
  --c-vibrant-12: #97C8CF;
}

Über diese Palette

Diese lebendige Palette mit 12 Farben reicht vom hellsten Ton Placebo Sky (#E9FAFE) bis zum dunkelsten Ton Green People (#397E09). Sie vereint Borderline Pink, Pansy, Pastel Magenta, Cherubic, Double Cream, Cornstalk, Absinthe Dreams, Green People, Imperial Green, Placebo Sky, Thin Air und Adriatic Haze in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreicht 1 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #397E09 auf #E9FAFE mit 4,7:1.

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


Farben im Detail

Borderline Pink #EE0E66
RGB
rgb(238, 14, 102)
HSL
hsl(336, 89%, 49%)
Luminanz
0,195
Pansy #F25290
RGB
rgb(242, 82, 144)
HSL
hsl(337, 86%, 64%)
Luminanz
0,269
Pastel Magenta #FA9ABF
RGB
rgb(250, 154, 191)
HSL
hsl(337, 91%, 79%)
Luminanz
0,472
Cherubic #FCE7F0
RGB
rgb(252, 231, 240)
HSL
hsl(334, 78%, 95%)
Luminanz
0,841
Double Cream #F3DAA4
RGB
rgb(243, 218, 164)
HSL
hsl(41, 77%, 80%)
Luminanz
0,719
Cornstalk #A7B363
RGB
rgb(167, 179, 99)
HSL
hsl(69, 34%, 55%)
Luminanz
0,414
Absinthe Dreams #808B2D
RGB
rgb(128, 139, 45)
HSL
hsl(67, 51%, 36%)
Luminanz
0,232
Green People #397E09
RGB
rgb(57, 126, 9)
HSL
hsl(95, 87%, 26%)
Luminanz
0,158
Imperial Green #3F854F
RGB
rgb(63, 133, 79)
HSL
hsl(134, 36%, 38%)
Luminanz
0,184
Placebo Sky #E9FAFE
RGB
rgb(233, 250, 254)
HSL
hsl(191, 91%, 95%)
Luminanz
0,929
Thin Air #C4F9FD
RGB
rgb(196, 249, 253)
HSL
hsl(184, 93%, 88%)
Luminanz
0,866
Adriatic Haze #97C8CF
RGB
rgb(151, 200, 207)
HSL
hsl(188, 37%, 70%)
Luminanz
0,524

Kontrast & Barrierefreiheit

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

Aa #397E09 auf #E9FAFE 4,70:1 AA
Aa #397E09 auf #C4F9FD 4,40:1 AA (großer Text)
Aa #FCE7F0 auf #397E09 4,28:1 AA (großer Text)
Aa #3F854F auf #E9FAFE 4,18:1 AA (großer Text)
Aa #EE0E66 auf #E9FAFE 4,00:1 AA (großer Text)
Aa #3F854F auf #C4F9FD 3,91:1 AA (großer Text)
Aa #FCE7F0 auf #3F854F 3,81:1 AA (großer Text)
Aa #EE0E66 auf #C4F9FD 3,75:1 AA (großer Text)
Aa #F3DAA4 auf #397E09 3,69:1 AA (großer Text)
Aa #EE0E66 auf #FCE7F0 3,65:1 AA (großer Text)
Aa #808B2D auf #E9FAFE 3,46:1 AA (großer Text)
Aa #F3DAA4 auf #3F854F 3,29:1 AA (großer Text)
Aa #808B2D auf #C4F9FD 3,24:1 AA (großer Text)
Aa #FCE7F0 auf #808B2D 3,16:1 AA (großer Text)
Aa #EE0E66 auf #F3DAA4 3,14:1 AA (großer Text)
Aa #F25290 auf #E9FAFE 3,06:1 AA (großer Text)
Aa #F25290 auf #C4F9FD 2,87:1 Nicht bestanden
Aa #F25290 auf #FCE7F0 2,79:1 Nicht bestanden
Aa #397E09 auf #97C8CF 2,76:1 Nicht bestanden
Aa #F3DAA4 auf #808B2D 2,72:1 Nicht bestanden
Aa #FA9ABF auf #397E09 2,51:1 Nicht bestanden
Aa #3F854F auf #97C8CF 2,45:1 Nicht bestanden
Aa #F25290 auf #F3DAA4 2,41:1 Nicht bestanden
Aa #EE0E66 auf #97C8CF 2,35:1 Nicht bestanden
Aa #FA9ABF auf #3F854F 2,23:1 Nicht bestanden
Aa #A7B363 auf #397E09 2,23:1 Nicht bestanden
Aa #EE0E66 auf #FA9ABF 2,13:1 Nicht bestanden
Aa #A7B363 auf #E9FAFE 2,11:1 Nicht bestanden
Aa #808B2D auf #97C8CF 2,03:1 Nicht bestanden
Aa #A7B363 auf #3F854F 1,98:1 Nicht bestanden
Aa #A7B363 auf #C4F9FD 1,98:1 Nicht bestanden
Aa #FCE7F0 auf #A7B363 1,92:1 Nicht bestanden
Aa #EE0E66 auf #A7B363 1,90:1 Nicht bestanden
Aa #FA9ABF auf #E9FAFE 1,87:1 Nicht bestanden
Aa #FA9ABF auf #808B2D 1,85:1 Nicht bestanden
Aa #F25290 auf #97C8CF 1,80:1 Nicht bestanden
Aa #FA9ABF auf #C4F9FD 1,75:1 Nicht bestanden
Aa #FA9ABF auf #FCE7F0 1,71:1 Nicht bestanden
Aa #E9FAFE auf #97C8CF 1,70:1 Nicht bestanden
Aa #F3DAA4 auf #A7B363 1,66:1 Nicht bestanden
Aa #A7B363 auf #808B2D 1,64:1 Nicht bestanden
Aa #F25290 auf #FA9ABF 1,63:1 Nicht bestanden
Aa #C4F9FD auf #97C8CF 1,60:1 Nicht bestanden
Aa #FCE7F0 auf #97C8CF 1,55:1 Nicht bestanden
Aa #F25290 auf #397E09 1,53:1 Nicht bestanden
Aa #FA9ABF auf #F3DAA4 1,47:1 Nicht bestanden
Aa #F25290 auf #A7B363 1,45:1 Nicht bestanden
Aa #F25290 auf #3F854F 1,36:1 Nicht bestanden
Aa #808B2D auf #397E09 1,36:1 Nicht bestanden
Aa #F3DAA4 auf #97C8CF 1,34:1 Nicht bestanden
Aa #EE0E66 auf #F25290 1,31:1 Nicht bestanden
Aa #F3DAA4 auf #E9FAFE 1,27:1 Nicht bestanden
Aa #A7B363 auf #97C8CF 1,24:1 Nicht bestanden
Aa #808B2D auf #3F854F 1,21:1 Nicht bestanden
Aa #F3DAA4 auf #C4F9FD 1,19:1 Nicht bestanden
Aa #EE0E66 auf #397E09 1,17:1 Nicht bestanden
Aa #EE0E66 auf #808B2D 1,16:1 Nicht bestanden
Aa #FCE7F0 auf #F3DAA4 1,16:1 Nicht bestanden
Aa #F25290 auf #808B2D 1,13:1 Nicht bestanden
Aa #FA9ABF auf #A7B363 1,13:1 Nicht bestanden
Aa #397E09 auf #3F854F 1,12:1 Nicht bestanden
Aa #FA9ABF auf #97C8CF 1,10:1 Nicht bestanden
Aa #FCE7F0 auf #E9FAFE 1,10:1 Nicht bestanden
Aa #E9FAFE auf #C4F9FD 1,07:1 Nicht bestanden
Aa #EE0E66 auf #3F854F 1,05:1 Nicht bestanden
Aa #FCE7F0 auf #C4F9FD 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