Startseite Farbpaletten Royal Armoury

Royal Armoury

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

Zurück zur Bibliothek

Royal Armoury

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Komplementär gold autumn royal shiny

Likes 40

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #000030;
  --c-vibrant-2: #3F0A57;
  --c-vibrant-3: #85106B;
  --c-vibrant-4: #B02C2C;
  --c-vibrant-5: #B8673E;
  --c-vibrant-6: #D9932B;
  --c-vibrant-7: #F0BD71;
  --c-vibrant-8: #FFE3BA;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Butter Creme (#FFE3BA) bis zum dunkelsten Ton Abyssopelagic Water (#000030). Sie vereint Abyssopelagic Water, Clairvoyant, Possessed Purple, Cross My Heart, Mincemeat, Buttercup, Pineapple Cake und Butter Creme in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 10 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #000030 auf #FFE3BA mit 16,25:1.

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

Farben im Detail

Abyssopelagic Water #000030

RGB: rgb(0, 0, 48)
HSL: hsl(240, 100%, 9%)
Luminanz: 0,002

Clairvoyant #3F0A57

RGB: rgb(63, 10, 87)
HSL: hsl(281, 79%, 19%)
Luminanz: 0,020

Possessed Purple #85106B

RGB: rgb(133, 16, 107)
HSL: hsl(313, 79%, 29%)
Luminanz: 0,064

Cross My Heart #B02C2C

RGB: rgb(176, 44, 44)
HSL: hsl(0, 60%, 43%)
Luminanz: 0,112

Mincemeat #B8673E

RGB: rgb(184, 103, 62)
HSL: hsl(20, 50%, 48%)
Luminanz: 0,202

Buttercup #D9932B

RGB: rgb(217, 147, 43)
HSL: hsl(36, 70%, 51%)
Luminanz: 0,358

Pineapple Cake #F0BD71

RGB: rgb(240, 189, 113)
HSL: hsl(36, 81%, 69%)
Luminanz: 0,561

Butter Creme #FFE3BA

RGB: rgb(255, 227, 186)
HSL: hsl(36, 100%, 86%)
Luminanz: 0,797

Kontrast & Barrierefreiheit

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

Aa #000030 auf #FFE3BA 16,25:1 AAA

Aa #3F0A57 auf #FFE3BA 12,17:1 AAA

Aa #000030 auf #F0BD71 11,72:1 AAA

Aa #3F0A57 auf #F0BD71 8,78:1 AAA

Aa #000030 auf #D9932B 7,82:1 AAA

Aa #85106B auf #FFE3BA 7,42:1 AAA

Aa #3F0A57 auf #D9932B 5,86:1 AA

Aa #85106B auf #F0BD71 5,35:1 AA

Aa #B02C2C auf #FFE3BA 5,23:1 AA

Aa #000030 auf #B8673E 4,84:1 AA

Aa #B02C2C auf #F0BD71 3,77:1 AA (großer Text)

Aa #3F0A57 auf #B8673E 3,63:1 AA (großer Text)

Aa #85106B auf #D9932B 3,57:1 AA (großer Text)

Aa #B8673E auf #FFE3BA 3,36:1 AA (großer Text)

Aa #000030 auf #B02C2C 3,11:1 AA (großer Text)

Aa #B02C2C auf #D9932B 2,52:1 Nicht bestanden

Aa #B8673E auf #F0BD71 2,42:1 Nicht bestanden

Aa #3F0A57 auf #B02C2C 2,33:1 Nicht bestanden

Aa #85106B auf #B8673E 2,21:1 Nicht bestanden

Aa #000030 auf #85106B 2,19:1 Nicht bestanden

Aa #D9932B auf #FFE3BA 2,08:1 Nicht bestanden

Aa #3F0A57 auf #85106B 1,64:1 Nicht bestanden

Aa #B8673E auf #D9932B 1,62:1 Nicht bestanden

Aa #B02C2C auf #B8673E 1,56:1 Nicht bestanden

Aa #D9932B auf #F0BD71 1,50:1 Nicht bestanden

Aa #85106B auf #B02C2C 1,42:1 Nicht bestanden

Aa #F0BD71 auf #FFE3BA 1,39:1 Nicht bestanden

Aa #000030 auf #3F0A57 1,34:1 Nicht bestanden

Royal Armoury

Royal Armoury

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen