Bakery Bliss

Palette mit 8 Farben · Warm · Hell · Harmonie: Komplementär

Zurück zur Bibliothek

Bakery Bliss

Palette mit 8 Farben · Temperatur: Warm · Ton: Hell · Harmonie: Komplementär

Bearbeiten

Lebendig 8 Farben Warm Hell Komplementär cute eight bread kittens

Likes 23

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #511E43;
  --c-vibrant-2: #B55E6E;
  --c-vibrant-3: #FFB675;
  --c-vibrant-4: #FFE6CC;
  --c-vibrant-5: #E8666F;
  --c-vibrant-6: #FF99AD;
  --c-vibrant-7: #8596C7;
  --c-vibrant-8: #C1CEDE;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Kansas Grain (#FFE6CC) bis zum dunkelsten Ton Prestige Mauve (#511E43). Sie vereint Prestige Mauve, Sensuous, Durazno Maduro, Kansas Grain, Purehearted, Fight the Sunrise, Blue Hyacinth und Saltwater in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 4 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #511E43 auf #FFE6CC mit 10,79:1.

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

Farben im Detail

Prestige Mauve #511E43

RGB: rgb(81, 30, 67)
HSL: hsl(316, 46%, 22%)
Luminanz: 0,031

Sensuous #B55E6E

RGB: rgb(181, 94, 110)
HSL: hsl(349, 37%, 54%)
Luminanz: 0,190

Durazno Maduro #FFB675

RGB: rgb(255, 182, 117)
HSL: hsl(28, 100%, 73%)
Luminanz: 0,560

Kansas Grain #FFE6CC

RGB: rgb(255, 230, 204)
HSL: hsl(31, 100%, 90%)
Luminanz: 0,822

Purehearted #E8666F

RGB: rgb(232, 102, 111)
HSL: hsl(356, 74%, 65%)
Luminanz: 0,278

Fight the Sunrise #FF99AD

RGB: rgb(255, 153, 173)
HSL: hsl(348, 100%, 80%)
Luminanz: 0,471

Blue Hyacinth #8596C7

RGB: rgb(133, 150, 199)
HSL: hsl(225, 37%, 65%)
Luminanz: 0,309

Saltwater #C1CEDE

RGB: rgb(193, 206, 222)
HSL: hsl(213, 31%, 81%)
Luminanz: 0,608

Kontrast & Barrierefreiheit

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

Aa #511E43 auf #FFE6CC 10,79:1 AAA

Aa #511E43 auf #C1CEDE 8,13:1 AAA

Aa #511E43 auf #FFB675 7,55:1 AAA

Aa #511E43 auf #FF99AD 6,44:1 AA

Aa #511E43 auf #8596C7 4,44:1 AA (großer Text)

Aa #511E43 auf #E8666F 4,06:1 AA (großer Text)

Aa #B55E6E auf #FFE6CC 3,64:1 AA (großer Text)

Aa #511E43 auf #B55E6E 2,96:1 Nicht bestanden

Aa #B55E6E auf #C1CEDE 2,74:1 Nicht bestanden

Aa #FFE6CC auf #E8666F 2,66:1 Nicht bestanden

Aa #B55E6E auf #FFB675 2,55:1 Nicht bestanden

Aa #FFE6CC auf #8596C7 2,43:1 Nicht bestanden

Aa #B55E6E auf #FF99AD 2,17:1 Nicht bestanden

Aa #E8666F auf #C1CEDE 2,00:1 Nicht bestanden

Aa #FFB675 auf #E8666F 1,86:1 Nicht bestanden

Aa #8596C7 auf #C1CEDE 1,83:1 Nicht bestanden

Aa #FFB675 auf #8596C7 1,70:1 Nicht bestanden

Aa #FFE6CC auf #FF99AD 1,68:1 Nicht bestanden

Aa #E8666F auf #FF99AD 1,59:1 Nicht bestanden

Aa #B55E6E auf #8596C7 1,50:1 Nicht bestanden

Aa #FF99AD auf #8596C7 1,45:1 Nicht bestanden

Aa #FFB675 auf #FFE6CC 1,43:1 Nicht bestanden

Aa #B55E6E auf #E8666F 1,37:1 Nicht bestanden

Aa #FFE6CC auf #C1CEDE 1,33:1 Nicht bestanden

Aa #FF99AD auf #C1CEDE 1,26:1 Nicht bestanden

Aa #FFB675 auf #FF99AD 1,17:1 Nicht bestanden

Aa #E8666F auf #8596C7 1,09:1 Nicht bestanden

Aa #FFB675 auf #C1CEDE 1,08:1 Nicht bestanden

Bakery Bliss

Bakery Bliss

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen