Hypocrites

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

Zurück zur Bibliothek

Hypocrites

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

Bearbeiten

Lebendig 9 Farben Warm Gemischt Triadisch hypocrite

Likes 14

Farben 9

CSS-Variablen

:root {
  --c-vibrant-1: #000000;
  --c-vibrant-2: #B80049;
  --c-vibrant-3: #EA569E;
  --c-vibrant-4: #FFA653;
  --c-vibrant-5: #FBE7B5;
  --c-vibrant-6: #FF89DC;
  --c-vibrant-7: #BB19E1;
  --c-vibrant-8: #4A17A1;
  --c-vibrant-9: #071C5A;
}

Über diese Palette

Diese lebendige Palette mit 9 Farben reicht vom hellsten Ton Banana Yoghurt (#FBE7B5) bis zum dunkelsten Ton Black (#000000). Sie vereint Black, Red Paracentrotus, Tutuji Pink, Echinoidea Thorns, Banana Yoghurt, Pink Delight, Promiscuous Pink, Amarklor Violet und Downriver in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 12 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #000000 auf #FBE7B5 mit 17,2:1.

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

Farben im Detail

Black #000000

RGB: rgb(0, 0, 0)
HSL: hsl(0, 0%, 0%)
Luminanz: 0,000

Red Paracentrotus #B80049

RGB: rgb(184, 0, 73)
HSL: hsl(336, 100%, 36%)
Luminanz: 0,107

Tutuji Pink #EA569E

RGB: rgb(234, 86, 158)
HSL: hsl(331, 78%, 63%)
Luminanz: 0,266

Echinoidea Thorns #FFA653

RGB: rgb(255, 166, 83)
HSL: hsl(29, 100%, 66%)
Luminanz: 0,492

Banana Yoghurt #FBE7B5

RGB: rgb(251, 231, 181)
HSL: hsl(43, 90%, 85%)
Luminanz: 0,810

Pink Delight #FF89DC

RGB: rgb(255, 137, 220)
HSL: hsl(318, 100%, 77%)
Luminanz: 0,443

Promiscuous Pink #BB19E1

RGB: rgb(187, 25, 225)
HSL: hsl(289, 80%, 49%)
Luminanz: 0,167

Amarklor Violet #4A17A1

RGB: rgb(74, 23, 161)
HSL: hsl(262, 75%, 36%)
Luminanz: 0,046

Downriver #071C5A

RGB: rgb(7, 28, 90)
HSL: hsl(225, 86%, 19%)
Luminanz: 0,016

Kontrast & Barrierefreiheit

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

Aa #000000 auf #FBE7B5 17,20:1 AAA

Aa #FBE7B5 auf #071C5A 13,00:1 AAA

Aa #000000 auf #FFA653 10,83:1 AAA

Aa #000000 auf #FF89DC 9,86:1 AAA

Aa #FBE7B5 auf #4A17A1 8,92:1 AAA

Aa #FFA653 auf #071C5A 8,19:1 AAA

Aa #FF89DC auf #071C5A 7,46:1 AAA

Aa #000000 auf #EA569E 6,32:1 AA

Aa #FFA653 auf #4A17A1 5,62:1 AA

Aa #B80049 auf #FBE7B5 5,49:1 AA

Aa #FF89DC auf #4A17A1 5,12:1 AA

Aa #EA569E auf #071C5A 4,78:1 AA

Aa #000000 auf #BB19E1 4,34:1 AA (großer Text)

Aa #FBE7B5 auf #BB19E1 3,96:1 AA (großer Text)

Aa #B80049 auf #FFA653 3,46:1 AA (großer Text)

Aa #EA569E auf #4A17A1 3,28:1 AA (großer Text)

Aa #BB19E1 auf #071C5A 3,28:1 AA (großer Text)

Aa #B80049 auf #FF89DC 3,15:1 AA (großer Text)

Aa #000000 auf #B80049 3,13:1 AA (großer Text)

Aa #EA569E auf #FBE7B5 2,72:1 Nicht bestanden

Aa #FFA653 auf #BB19E1 2,50:1 Nicht bestanden

Aa #B80049 auf #071C5A 2,37:1 Nicht bestanden

Aa #FF89DC auf #BB19E1 2,27:1 Nicht bestanden

Aa #BB19E1 auf #4A17A1 2,25:1 Nicht bestanden

Aa #B80049 auf #EA569E 2,02:1 Nicht bestanden

Aa #000000 auf #4A17A1 1,93:1 Nicht bestanden

Aa #FBE7B5 auf #FF89DC 1,74:1 Nicht bestanden

Aa #EA569E auf #FFA653 1,71:1 Nicht bestanden

Aa #B80049 auf #4A17A1 1,63:1 Nicht bestanden

Aa #FFA653 auf #FBE7B5 1,59:1 Nicht bestanden

Aa #EA569E auf #FF89DC 1,56:1 Nicht bestanden

Aa #EA569E auf #BB19E1 1,46:1 Nicht bestanden

Aa #4A17A1 auf #071C5A 1,46:1 Nicht bestanden

Aa #B80049 auf #BB19E1 1,38:1 Nicht bestanden

Aa #000000 auf #071C5A 1,32:1 Nicht bestanden

Aa #FFA653 auf #FF89DC 1,10:1 Nicht bestanden

Hypocrites

Hypocrites

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen