Benannte Farbe · #C45655
Fuzzy Wuzzy Brown
Fuzzy Wuzzy Brown ist #C45655: rgb(196 86 85), hsl(1 48% 55%), oklch(0.592 0.142 22.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Fuzzy Wuzzy Brown color name →
#C45655
oklch(0.592 0.142 22.9)
Farbumrechnungen
- HEX
- #c45655
- RGB
- rgb(196 86 85)
- HSL
- hsl(1 48% 55%)
- HWB
- hwb(1 33% 23%)
- OKLCH
- oklch(0.592 0.142 22.9)
- OKLab
- oklab(0.592 0.13 0.055)
- CIE Lab
- lab(51.27 44.85 23.5)
- LCH
- lch(51.27 50.64 27.7)
- CMYK
- cmyk(0% 56% 57% 23%)
Tints · Shades · Tones
Tints
- CC6865
- D37975
- DA8A86
- E19A96
- E7ABA7
- EDBCB8
- F2CCCA
- F7DDDB
- FBEEED
Shades
- AA4A49
- 913E3D
- 783231
- 612726
- 4A1C1C
- 351211
- 210808
- 0E0202
- 020000
Tones
- BE5C5A
- B8615E
- B26663
- AC6A67
- A56E6B
- 9F726F
- 987674
- 907978
- 887D7C
Farbharmonien
Komplementär +180°
- C45655
Fuzzy Wuzzy Brown
- 008F98
≈ Splashy
Analog -30° +30°
- C45655
Fuzzy Wuzzy Brown
- BB5585
≈ Berry Boost
- BD6117
≈ Honey Ginger
Triadisch +120° +240°
- C45655
Fuzzy Wuzzy Brown
- 439240
≈ May Green
- 4F7BD1
≈ Serenity’s Reign
Geteilt komplementär +150° +210°
- C45655
Fuzzy Wuzzy Brown
- 009377
≈ Dòu Lǜ Green
- 0089BA
≈ Mermaid Dreams
Tetradisch +90° +180° +270°
- C45655
Fuzzy Wuzzy Brown
- 7F8500
≈ Elwynn Forest Olive
- 008F98
≈ Splashy
- 826BCA
≈ Venus Violet
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 4.36:1 · APCA Lc 70
Ag
AAAuf Schwarz
WCAG 4.80:1 · APCA Lc 32
Beste Textfarbe: #000000
WCAG 4.80:1 (AA) · APCA Lc 32
Contrast pairs
Code-Snippets
CSS
:root {
--fuzzy-wuzzy-brown: #c45655;
--fuzzy-wuzzy-brown-rgb: 196 86 85;
--fuzzy-wuzzy-brown-oklch: oklch(0.592 0.142 22.9);
}
.element {
color: var(--fuzzy-wuzzy-brown);
background-color: hsl(1 48% 55%);
border-color: oklch(0.592 0.142 22.9);
}Tailwind CSS v4
@theme {
--color-fuzzy-wuzzy-brown: #c45655;
--color-fuzzy-wuzzy-brown-50: #ffe6e1;
--color-fuzzy-wuzzy-brown-100: #ffd6d0;
--color-fuzzy-wuzzy-brown-200: #ffbdb6;
--color-fuzzy-wuzzy-brown-300: #f89a93;
--color-fuzzy-wuzzy-brown-400: #e67a77;
--color-fuzzy-wuzzy-brown-500: #d45958;
--color-fuzzy-wuzzy-brown-600: #b34c4b;
--color-fuzzy-wuzzy-brown-700: #903d3c;
--color-fuzzy-wuzzy-brown-800: #6b2b2c;
--color-fuzzy-wuzzy-brown-900: #4b1d1e;
--color-fuzzy-wuzzy-brown-950: #310c0e;
}SCSS
$fuzzy-wuzzy-brown: #c45655;
$fuzzy-wuzzy-brown-rgb: 196, 86, 85;
$fuzzy-wuzzy-brown-light: mix(#fff, $fuzzy-wuzzy-brown, 20%);
$fuzzy-wuzzy-brown-dark: mix(#000, $fuzzy-wuzzy-brown, 20%);
.element {
color: $fuzzy-wuzzy-brown;
box-shadow: 0 0 0 2px rgba($fuzzy-wuzzy-brown, 0.35);
}