Benoemde kleur · #68554E
Library Leather
Library Leather is #68554E: rgb(104 85 78), hsl(16 14% 36%), oklch(0.467 0.028 41.2). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · Library Leather color name →
#68554E
oklch(0.467 0.028 41.2)
Kleurconversies
- HEX
- #68554e
- RGB
- rgb(104 85 78)
- HSL
- hsl(16 14% 36%)
- HWB
- hwb(16 31% 59%)
- OKLCH
- oklch(0.467 0.028 41.2)
- OKLab
- oklab(0.467 0.021 0.018)
- CIE Lab
- lab(37.94 7.21 7.2)
- LCH
- lch(37.94 10.19 44.9)
- CMYK
- cmyk(0% 18% 25% 59%)
Tinten · Schaduwen · Tonen
Tinten
- 76645E
- 84746E
- 93857F
- A29590
- B1A6A2
- C0B7B4
- D0C9C6
- DFDBD9
- EFEDEC
Schaduwen
- 594943
- 4B3D38
- 3E312D
- 302623
- 241C19
- 18110F
- 0C0807
- 040202
- 000000
Tonen
- 6A5953
- 6D5D58
- 6F625D
- 726662
- 746A67
- 776F6C
- 797371
- 7B7776
- 7E7C7B
Kleurharmonieën
Complementair +180°
- 68554E
Library Leather
- 495E65
≈ Blue Tapestry
Analoog -30° +30°
- 68554E
Library Leather
- 685456
≈ Ripe Fig
- 645849
≈ Winter Oak
Triadisch +120° +240°
- 68554E
Library Leather
- 4D5F55
≈ Cloudy Viridian
- 575869
≈ Ripe Berry
Gesplitst complementair +150° +210°
- 68554E
Library Leather
- 485F5E
≈ Midnight Teal
- 4F5B69
≈ Storm Rising
Tetradisch +90° +180° +270°
- 68554E
Library Leather
- 545D4D
≈ Brierwood Green
- 495E65
≈ Blue Tapestry
- 5F5666
≈ Ripe Berry
Contrast en toegankelijkheid
Ag
AAAOp wit
WCAG 7.00:1 · APCA Lc 84
Ag
FailOp zwart
WCAG 2.99:1 · APCA Lc 18
Beste tekstkleur: #FFFFFF
WCAG 7.00:1 (AAA) · APCA Lc 84
Contrast pairs
Codefragmenten
CSS
:root {
--library-leather: #68554e;
--library-leather-rgb: 104 85 78;
--library-leather-oklch: oklch(0.467 0.028 41.2);
}
.element {
color: var(--library-leather);
background-color: hsl(16 14% 36%);
border-color: oklch(0.467 0.028 41.2);
}Tailwind CSS v4
@theme {
--color-library-leather: #68554e;
--color-library-leather-50: #fdf3ef;
--color-library-leather-100: #f0e5e1;
--color-library-leather-200: #dfd1cb;
--color-library-leather-300: #c4b3ac;
--color-library-leather-400: #ae9992;
--color-library-leather-500: #978178;
--color-library-leather-600: #806d66;
--color-library-leather-700: #665751;
--color-library-leather-800: #4b3f3b;
--color-library-leather-900: #342c29;
--color-library-leather-950: #201917;
}SCSS
$library-leather: #68554e;
$library-leather-rgb: 104, 85, 78;
$library-leather-light: mix(#fff, $library-leather, 20%);
$library-leather-dark: mix(#000, $library-leather, 20%);
.element {
color: $library-leather;
box-shadow: 0 0 0 2px rgba($library-leather, 0.35);
}