Dichtstbijzijnde benoemde kleur · #7D552F
#7D552F
Dichtstbijzijnde benoemde kleur: Chocolate Bells
#7D552F (rgb(125 85 47), hsl(29 45% 34%), oklch(0.485 0.075 63)) komt het dichtst bij de benoemde kleur Chocolate Bells. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#7D552F
oklch(0.485 0.075 63)
Kleurconversies
- HEX
- #7d552f
- RGB
- rgb(125 85 47)
- HSL
- hsl(29 45% 34%)
- HWB
- hwb(29 18% 51%)
- OKLCH
- oklch(0.485 0.075 63)
- OKLab
- oklab(0.485 0.034 0.067)
- CIE Lab
- lab(39.99 14.02 28.86)
- LCH
- lch(39.99 32.09 64.1)
- CMYK
- cmyk(0% 32% 62% 51%)
Tinten · Schaduwen · Tonen
Tinten
- 8A6543
- 977557
- A3856B
- B0967F
- BDA794
- CAB8A8
- D7C9BE
- E5DBD3
- F2EDE9
Schaduwen
- 6C4927
- 5B3D20
- 4B3119
- 3B2612
- 2C1C0C
- 1E1106
- 110803
- 050201
- 010000
Tonen
- 7E5938
- 7E5E41
- 7F6249
- 7F6751
- 806B59
- 806F61
- 807369
- 807870
- 807C78
Kleurharmonieën
Complementair +180°
- 7D552F
Chocolate Bells
- 366486
≈ Drake’s Neck
Analoog -30° +30°
- 7D552F
Chocolate Bells
- 844E43
≈ Beauty Patch
- 6E5E28
≈ Bean Green
Triadisch +120° +240°
- 7D552F
Chocolate Bells
- 1F6D63
≈ Antique Green
- 675482
≈ Virtual Violet
Gesplitst complementair +150° +210°
- 7D552F
Chocolate Bells
- 1C6A78
≈ Jester Blue
- 515C8A
≈ Marlin
Tetradisch +90° +180° +270°
- 7D552F
Chocolate Bells
- 3B6B4A
≈ Jungle Book Green
- 366486
≈ Drake’s Neck
- 784E71
≈ Brocade Violet
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 6.53:1 · APCA Lc 82
Ag
FailOp zwart
WCAG 3.21:1 · APCA Lc 20
Beste tekstkleur: #FFFFFF
WCAG 6.53:1 (AA) · APCA Lc 82
Contrast pairs
Codefragmenten
CSS
:root {
--chocolate-bells: #7d552f;
--chocolate-bells-rgb: 125 85 47;
--chocolate-bells-oklch: oklch(0.485 0.075 63);
}
.element {
color: var(--chocolate-bells);
background-color: hsl(29 45% 34%);
border-color: oklch(0.485 0.075 63);
}Tailwind CSS v4
@theme {
--color-chocolate-bells: #7d552f;
--color-chocolate-bells-50: #fff1df;
--color-chocolate-bells-100: #fae3ce;
--color-chocolate-bells-200: #ecceb3;
--color-chocolate-bells-300: #d3b08f;
--color-chocolate-bells-400: #bf9570;
--color-chocolate-bells-500: #aa7b50;
--color-chocolate-bells-600: #8f6844;
--color-chocolate-bells-700: #735336;
--color-chocolate-bells-800: #553c27;
--color-chocolate-bells-900: #3c291a;
--color-chocolate-bells-950: #25170a;
}SCSS
$chocolate-bells: #7d552f;
$chocolate-bells-rgb: 125, 85, 47;
$chocolate-bells-light: mix(#fff, $chocolate-bells, 20%);
$chocolate-bells-dark: mix(#000, $chocolate-bells, 20%);
.element {
color: $chocolate-bells;
box-shadow: 0 0 0 2px rgba($chocolate-bells, 0.35);
}