Nazwany kolor · #D08F73
Terra Cotta Clay
Terra Cotta Clay to #D08F73: rgb(208 143 115), hsl(18 50% 63%), oklch(0.708 0.089 44.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Terra Cotta Clay color name →
#D08F73
oklch(0.708 0.089 44.1)
Konwersje koloru
- HEX
- #d08f73
- RGB
- rgb(208 143 115)
- HSL
- hsl(18 50% 63%)
- HWB
- hwb(18 45% 18%)
- OKLCH
- oklch(0.708 0.089 44.1)
- OKLab
- oklab(0.708 0.064 0.062)
- CIE Lab
- lab(65.56 22.98 25.38)
- LCH
- lch(65.56 34.24 47.8)
- CMYK
- cmyk(0% 31% 45% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D59A81
- DBA58E
- E0B09C
- E4BBAA
- E9C7B8
- EED2C6
- F2DDD4
- F7E8E2
- FBF4F1
Odcienie ciemniejsze
- B57C63
- 9A6954
- 805745
- 674536
- 4F3428
- 39241B
- 23150F
- 100705
- 020101
Tony
- C88E75
- C08C76
- B88B78
- B08A79
- A9887B
- A1877C
- 99857D
- 90837E
- 88827F
Harmonie kolorów
Komplementarna +180°
- D08F73
Terra Cotta Clay
- 5DADCA
≈ Frozen Wave
Analogowa -30° +30°
- D08F73
Terra Cotta Clay
- D28A90
≈ Doric Pink
- C29960
≈ Lion
Triada +120° +240°
- D08F73
Terra Cotta Clay
- 69B392
≈ Keppel
- 9A9AD7
≈ Bluebell Frost
Komplementarna rozszczepiona +150° +210°
- D08F73
Terra Cotta Clay
- 55B2B1
≈ Crystalsong Blue
- 7AA4D8
≈ Boudoir Blue
Tetrada +90° +180° +270°
- D08F73
Terra Cotta Clay
- 8AAD74
≈ Sage
- 5DADCA
≈ Frozen Wave
- B590C8
≈ Cut Velvet
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.67:1 · APCA Lc 52
Ag
AAANa czerni
WCAG 7.85:1 · APCA Lc 50
Najlepszy kolor tekstu: #000000
WCAG 7.85:1 (AAA) · APCA Lc 50
Contrast pairs
Fragmenty kodu
CSS
:root {
--terra-cotta-clay: #d08f73;
--terra-cotta-clay-rgb: 208 143 115;
--terra-cotta-clay-oklch: oklch(0.708 0.089 44.1);
}
.element {
color: var(--terra-cotta-clay);
background-color: hsl(18 50% 63%);
border-color: oklch(0.708 0.089 44.1);
}Tailwind CSS v4
@theme {
--color-terra-cotta-clay: #d08f73;
--color-terra-cotta-clay-50: #ffeee0;
--color-terra-cotta-clay-100: #ffe0d0;
--color-terra-cotta-clay-200: #f6c9b5;
--color-terra-cotta-clay-300: #dfaa91;
--color-terra-cotta-clay-400: #cb8e73;
--color-terra-cotta-clay-500: #b77254;
--color-terra-cotta-clay-600: #9b6148;
--color-terra-cotta-clay-700: #7c4d39;
--color-terra-cotta-clay-800: #5c3829;
--color-terra-cotta-clay-900: #41261c;
--color-terra-cotta-clay-950: #29140c;
}SCSS
$terra-cotta-clay: #d08f73;
$terra-cotta-clay-rgb: 208, 143, 115;
$terra-cotta-clay-light: mix(#fff, $terra-cotta-clay, 20%);
$terra-cotta-clay-dark: mix(#000, $terra-cotta-clay, 20%);
.element {
color: $terra-cotta-clay;
box-shadow: 0 0 0 2px rgba($terra-cotta-clay, 0.35);
}