Benannte Farbe · #614432
Boston Brown Bread
Boston Brown Bread ist #614432: rgb(97 68 50), hsl(23 32% 29%), oklch(0.414 0.049 52.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Brown mean? → · Boston Brown Bread color name →
#614432
oklch(0.414 0.049 52.7)
Farbumrechnungen
- HEX
- #614432
- RGB
- rgb(97 68 50)
- HSL
- hsl(23 32% 29%)
- HWB
- hwb(23 20% 62%)
- OKLCH
- oklch(0.414 0.049 52.7)
- OKLab
- oklab(0.414 0.03 0.039)
- CIE Lab
- lab(31.8 11.08 16.12)
- LCH
- lch(31.8 19.56 55.5)
- CMYK
- cmyk(0% 30% 48% 62%)
Tints · Shades · Tones
Tints
- 705544
- 7F6657
- 8E786B
- 9E8A7E
- AE9D93
- BEB0A8
- CEC3BD
- DED7D2
- EEEBE9
Shades
- 533A2A
- 463022
- 39261B
- 2D1D14
- 21140D
- 150C07
- 0B0503
- 030201
- 000000
Tones
- 644A3A
- 685041
- 6B5649
- 6E5C51
- 716258
- 746860
- 776E68
- 7A7470
- 7D7A78
Farbharmonien
Komplementär +180°
- 614432
Boston Brown Bread
- 2F5062
≈ Shadow of Night
Analog -30° +30°
- 614432
Boston Brown Bread
- 64413F
≈ Federation Brown
- 59492B
≈ Nightingale
Triadisch +120° +240°
- 614432
Boston Brown Bread
- 2D5449
≈ Hunter
- 4C4764
≈ Berry Charm
Geteilt komplementär +150° +210°
- 614432
Boston Brown Bread
- 275357
≈ Hidden Waters
- 3D4C67
≈ Buster
Tetradisch +90° +180° +270°
- 614432
Boston Brown Bread
- 3C533A
≈ Highlander
- 2F5062
≈ Shadow of Night
- 59425B
≈ Dreamy Heaven
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 8.81:1 · APCA Lc 90
Ag
FailAuf Schwarz
WCAG 2.38:1 · APCA Lc 12
Beste Textfarbe: #FFFFFF
WCAG 8.81:1 (AAA) · APCA Lc 90
Contrast pairs
Code-Snippets
CSS
:root {
--boston-brown-bread: #614432;
--boston-brown-bread-rgb: 97 68 50;
--boston-brown-bread-oklch: oklch(0.414 0.049 52.7);
}
.element {
color: var(--boston-brown-bread);
background-color: hsl(23 32% 29%);
border-color: oklch(0.414 0.049 52.7);
}Tailwind CSS v4
@theme {
--color-boston-brown-bread: #614432;
--color-boston-brown-bread-50: #fff2e8;
--color-boston-brown-bread-100: #f6e4d9;
--color-boston-brown-bread-200: #e6cfc1;
--color-boston-brown-bread-300: #ccb1a0;
--color-boston-brown-bread-400: #b79784;
--color-boston-brown-bread-500: #a17e68;
--color-boston-brown-bread-600: #886a58;
--color-boston-brown-bread-700: #6d5546;
--color-boston-brown-bread-800: #513e33;
--color-boston-brown-bread-900: #382a23;
--color-boston-brown-bread-950: #231812;
}SCSS
$boston-brown-bread: #614432;
$boston-brown-bread-rgb: 97, 68, 50;
$boston-brown-bread-light: mix(#fff, $boston-brown-bread, 20%);
$boston-brown-bread-dark: mix(#000, $boston-brown-bread, 20%);
.element {
color: $boston-brown-bread;
box-shadow: 0 0 0 2px rgba($boston-brown-bread, 0.35);
}