Benannte Farbe · #6D5542
Breakfast Blend
Breakfast Blend ist #6D5542: rgb(109 85 66), hsl(27 25% 34%), oklch(0.469 0.043 59.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Brown mean? → · Breakfast Blend color name →
#6D5542
oklch(0.469 0.043 59.8)
Farbumrechnungen
- HEX
- #6d5542
- RGB
- rgb(109 85 66)
- HSL
- hsl(27 25% 34%)
- HWB
- hwb(27 26% 57%)
- OKLCH
- oklch(0.469 0.043 59.8)
- OKLab
- oklab(0.469 0.022 0.037)
- CIE Lab
- lab(38.28 8.14 15.1)
- LCH
- lch(38.28 17.16 61.7)
- CMYK
- cmyk(0% 22% 39% 57%)
Tints · Shades · Tones
Tints
- 7B6553
- 897465
- 978577
- A59589
- B4A69C
- C3B7AF
- D1C9C3
- E0DBD6
- F0EDEB
Shades
- 5E4938
- 4F3D2F
- 413125
- 33261C
- 261C14
- 19110B
- 0D0805
- 040201
- 010000
Tones
- 6F5948
- 715E4E
- 736254
- 75665B
- 776A61
- 796F67
- 7B736D
- 7C7773
- 7E7C7A
Farbharmonien
Komplementär +180°
- 6D5542
Breakfast Blend
- 445E71
≈ Eclipse Blue
Analog -30° +30°
- 6D5542
Breakfast Blend
- 71524C
≈ Susu-Take Bamboo
- 645A3E
≈ Puff Dragon
Triadisch +120° +240°
- 6D5542
Breakfast Blend
- 3F635B
≈ Forest Greenery
- 5E5570
≈ Arraign
Geteilt komplementär +150° +210°
- 6D5542
Breakfast Blend
- 3D6168
≈ Mediterranea
- 515A73
≈ Nightshade Purple
Tetradisch +90° +180° +270°
- 6D5542
Breakfast Blend
- 49624E
≈ Mission Jewel
- 445E71
≈ Eclipse Blue
- 695266
≈ Vintner
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.93:1 · APCA Lc 84
Ag
FailAuf Schwarz
WCAG 3.02:1 · APCA Lc 18
Beste Textfarbe: #FFFFFF
WCAG 6.93:1 (AA) · APCA Lc 84
Contrast pairs
Code-Snippets
CSS
:root {
--breakfast-blend: #6d5542;
--breakfast-blend-rgb: 109 85 66;
--breakfast-blend-oklch: oklch(0.469 0.043 59.8);
}
.element {
color: var(--breakfast-blend);
background-color: hsl(27 25% 34%);
border-color: oklch(0.469 0.043 59.8);
}Tailwind CSS v4
@theme {
--color-breakfast-blend: #6d5542;
--color-breakfast-blend-50: #fff3e9;
--color-breakfast-blend-100: #f3e5da;
--color-breakfast-blend-200: #e2d1c2;
--color-breakfast-blend-300: #c8b3a1;
--color-breakfast-blend-400: #b29985;
--color-breakfast-blend-500: #9c806a;
--color-breakfast-blend-600: #846c5a;
--color-breakfast-blend-700: #6a5747;
--color-breakfast-blend-800: #4e3f34;
--color-breakfast-blend-900: #362b23;
--color-breakfast-blend-950: #211912;
}SCSS
$breakfast-blend: #6d5542;
$breakfast-blend-rgb: 109, 85, 66;
$breakfast-blend-light: mix(#fff, $breakfast-blend, 20%);
$breakfast-blend-dark: mix(#000, $breakfast-blend, 20%);
.element {
color: $breakfast-blend;
box-shadow: 0 0 0 2px rgba($breakfast-blend, 0.35);
}