Nazwany kolor · #B66A50
Clay
Clay to #B66A50: rgb(182 106 80), hsl(15 41% 51%), oklch(0.603 0.105 39.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Clay color name →
#B66A50
oklch(0.603 0.105 39.6)
Konwersje koloru
- HEX
- #b66a50
- RGB
- rgb(182 106 80)
- HSL
- hsl(15 41% 51%)
- HWB
- hwb(15 31% 29%)
- OKLCH
- oklch(0.603 0.105 39.6)
- OKLab
- oklab(0.603 0.081 0.067)
- CIE Lab
- lab(53.2 29.24 28.28)
- LCH
- lch(53.2 40.67 44)
- CMYK
- cmyk(0% 42% 56% 29%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BE7961
- C68772
- CE9683
- D6A594
- DDB4A5
- E4C2B7
- EBD1C9
- F2E0DB
- F9F0ED
Odcienie ciemniejsze
- 9E5B44
- 864D39
- 6F3F2E
- 593124
- 44241A
- 301810
- 1D0D07
- 0C0402
- 020000
Tony
- B16D55
- AC6F5B
- A77260
- A27465
- 9D7669
- 97796E
- 927B73
- 8C7C77
- 867E7C
Harmonie kolorów
Komplementarna +180°
- B66A50
Clay
- 178FAC
≈ Zeftron
Analogowa -30° +30°
- B66A50
Clay
- B66573
≈ Slate Rose
- A97533
≈ Buff Leather
Triada +120° +240°
Komplementarna rozszczepiona +150° +210°
- B66A50
Clay
- 00958E
≈ Reef Encounter
- 4C85BD
≈ Blue Vault
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.06:1 · APCA Lc 68
Ag
AANa czerni
WCAG 5.16:1 · APCA Lc 34
Najlepszy kolor tekstu: #000000
WCAG 5.16:1 (AA) · APCA Lc 34
Contrast pairs
Fragmenty kodu
CSS
:root {
--clay: #b66a50;
--clay-rgb: 182 106 80;
--clay-oklch: oklch(0.603 0.105 39.6);
}
.element {
color: var(--clay);
background-color: hsl(15 41% 51%);
border-color: oklch(0.603 0.105 39.6);
}Tailwind CSS v4
@theme {
--color-clay: #b66a50;
--color-clay-50: #ffecde;
--color-clay-100: #ffddcd;
--color-clay-200: #fcc6b2;
--color-clay-300: #e6a68e;
--color-clay-400: #d4896f;
--color-clay-500: #c06c4f;
--color-clay-600: #a25c44;
--color-clay-700: #824936;
--color-clay-800: #613427;
--color-clay-900: #44241a;
--color-clay-950: #2c120b;
}SCSS
$clay: #b66a50;
$clay-rgb: 182, 106, 80;
$clay-light: mix(#fff, $clay, 20%);
$clay-dark: mix(#000, $clay, 20%);
.element {
color: $clay;
box-shadow: 0 0 0 2px rgba($clay, 0.35);
}