TetraVibe6

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

Zurück zur Bibliothek

TetraVibe6

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

Bearbeiten

Lebendig 6 Farben Warm Gemischt Komplementär

Likes 10

Farben 6

CSS-Variablen

:root {
  --c-vibrant-1: #C6FFEC;
  --c-vibrant-2: #7BFCD0;
  --c-vibrant-3: #2CD79D;
  --c-vibrant-4: #D72C87;
  --c-vibrant-5: #962458;
  --c-vibrant-6: #53001A;
}

Über diese Palette

Diese lebendige Palette mit 6 Farben reicht vom hellsten Ton Arabica Mint (#C6FFEC) bis zum dunkelsten Ton Bloedworst (#53001A). Sie vereint Arabica Mint, Hiroshima Aquamarine, Reptile Green, Highlighter Lilac, Figue Pulp und Bloedworst in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 15. Davon erreichen 5 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #C6FFEC auf #53001A mit 13,68:1.

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

Farben im Detail

Arabica Mint #C6FFEC

RGB: rgb(198, 255, 236)
HSL: hsl(160, 100%, 89%)
Luminanz: 0,896

Hiroshima Aquamarine #7BFCD0

RGB: rgb(123, 252, 208)
HSL: hsl(160, 96%, 74%)
Luminanz: 0,784

Reptile Green #2CD79D

RGB: rgb(44, 215, 157)
HSL: hsl(160, 68%, 51%)
Luminanz: 0,516

Highlighter Lilac #D72C87

RGB: rgb(215, 44, 135)
HSL: hsl(328, 68%, 51%)
Luminanz: 0,180

Figue Pulp #962458

RGB: rgb(150, 36, 88)
HSL: hsl(333, 61%, 36%)
Luminanz: 0,085

Bloedworst #53001A

RGB: rgb(83, 0, 26)
HSL: hsl(341, 100%, 16%)
Luminanz: 0,019

Kontrast & Barrierefreiheit

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

Aa #C6FFEC auf #53001A 13,68:1 AAA

Aa #7BFCD0 auf #53001A 12,06:1 AAA

Aa #2CD79D auf #53001A 8,18:1 AAA

Aa #C6FFEC auf #962458 7,03:1 AAA

Aa #7BFCD0 auf #962458 6,20:1 AA

Aa #2CD79D auf #962458 4,21:1 AA (großer Text)

Aa #C6FFEC auf #D72C87 4,11:1 AA (großer Text)

Aa #7BFCD0 auf #D72C87 3,63:1 AA (großer Text)

Aa #D72C87 auf #53001A 3,33:1 AA (großer Text)

Aa #2CD79D auf #D72C87 2,46:1 Nicht bestanden

Aa #962458 auf #53001A 1,95:1 Nicht bestanden

Aa #D72C87 auf #962458 1,71:1 Nicht bestanden

Aa #C6FFEC auf #2CD79D 1,67:1 Nicht bestanden

Aa #7BFCD0 auf #2CD79D 1,47:1 Nicht bestanden

Aa #C6FFEC auf #7BFCD0 1,13:1 Nicht bestanden

TetraVibe6

TetraVibe6

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen