Nazwany kolor · #524A46
Périgord Truffle
Périgord Truffle to #524A46: rgb(82 74 70), hsl(20 8% 30%), oklch(0.416 0.013 48.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Périgord Truffle color name →
#524A46
oklch(0.416 0.013 48.4)
Konwersje koloru
- HEX
- #524a46
- RGB
- rgb(82 74 70)
- HSL
- hsl(20 8% 30%)
- HWB
- hwb(20 27% 68%)
- OKLCH
- oklch(0.416 0.013 48.4)
- OKLab
- oklab(0.416 0.008 0.009)
- CIE Lab
- lab(32.16 2.88 3.68)
- LCH
- lch(32.16 4.67 51.9)
- CMYK
- cmyk(0% 10% 15% 68%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 625A56
- 726B67
- 827C79
- 938E8B
- A4A09D
- B6B2B0
- C8C5C3
- DAD8D7
- ECEBEB
Odcienie ciemniejsze
- 463F3C
- 3B3532
- 2F2A28
- 25201E
- 1A1715
- 110E0D
- 080605
- 020202
- 000000
Tony
- 564F4C
- 5B5451
- 5F5A57
- 645F5D
- 696462
- 6D6A68
- 726F6E
- 777574
- 7B7A7A
Harmonie kolorów
Komplementarna +180°
- 524A46
Périgord Truffle
- 454D51
≈ Sooty Lashes
Analogowa -30° +30°
- 524A46
Périgord Truffle
- 534949
≈ Emperor
- 504B44
≈ Périgord Truffle
Triada +120° +240°
- 524A46
Périgord Truffle
- 464E4B
≈ Spinel Black
- 4B4B53
≈ Deep Night
Komplementarna rozszczepiona +150° +210°
- 524A46
Périgord Truffle
- 444E4E
≈ Spinel Black
- 484C53
≈ Black Ribbon
Tetrada +90° +180° +270°
- 524A46
Périgord Truffle
- 494E47
≈ Model T
- 454D51
≈ Sooty Lashes
- 4F4A50
≈ Galaxy
Kontrast i dostępność
Ag
AAANa bieli
WCAG 8.65:1 · APCA Lc 90
Ag
FailNa czerni
WCAG 2.42:1 · APCA Lc 13
Najlepszy kolor tekstu: #FFFFFF
WCAG 8.65:1 (AAA) · APCA Lc 90
Contrast pairs
Fragmenty kodu
CSS
:root {
--perigord-truffle: #524a46;
--perigord-truffle-rgb: 82 74 70;
--perigord-truffle-oklch: oklch(0.416 0.013 48.4);
}
.element {
color: var(--perigord-truffle);
background-color: hsl(20 8% 30%);
border-color: oklch(0.416 0.013 48.4);
}Tailwind CSS v4
@theme {
--color-perigord-truffle: #524a46;
--color-perigord-truffle-50: #f8f4f2;
--color-perigord-truffle-100: #ece7e4;
--color-perigord-truffle-200: #d9d3cf;
--color-perigord-truffle-300: #bdb6b2;
--color-perigord-truffle-400: #a59c98;
--color-perigord-truffle-500: #8e847f;
--color-perigord-truffle-600: #78706c;
--color-perigord-truffle-700: #605956;
--color-perigord-truffle-800: #46413f;
--color-perigord-truffle-900: #312d2b;
--color-perigord-truffle-950: #1d1a18;
}SCSS
$perigord-truffle: #524a46;
$perigord-truffle-rgb: 82, 74, 70;
$perigord-truffle-light: mix(#fff, $perigord-truffle, 20%);
$perigord-truffle-dark: mix(#000, $perigord-truffle, 20%);
.element {
color: $perigord-truffle;
box-shadow: 0 0 0 2px rgba($perigord-truffle, 0.35);
}