Nazwany kolor · #A47365
Toasted Nutmeg
Toasted Nutmeg to #A47365: rgb(164 115 101), hsl(13 26% 52%), oklch(0.602 0.066 36.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Toasted Nutmeg color name →
#A47365
oklch(0.602 0.066 36.6)
Konwersje koloru
- HEX
- #a47365
- RGB
- rgb(164 115 101)
- HSL
- hsl(13 26% 52%)
- HWB
- hwb(13 40% 36%)
- OKLCH
- oklch(0.602 0.066 36.6)
- OKLab
- oklab(0.602 0.053 0.039)
- CIE Lab
- lab(53.32 18.55 15.9)
- LCH
- lch(53.32 24.43 40.6)
- CMYK
- cmyk(0% 30% 38% 36%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- AD8073
- B78E82
- C09B91
- C9A9A0
- D2B7AF
- DBC5BF
- E4D3CF
- EDE2DF
- F6F0EF
Odcienie ciemniejsze
- 8E6357
- 795449
- 64453C
- 50362F
- 3D2822
- 2B1B17
- 1A0F0C
- 0A0503
- 010100
Tony
- A17468
- 9D766B
- 9A776D
- 967970
- 937A73
- 8F7B76
- 8C7D78
- 887E7B
- 847F7D
Harmonie kolorów
Komplementarna +180°
- A47365
Toasted Nutmeg
- 508B9A
≈ Blue Square
Analogowa -30° +30°
- A47365
Toasted Nutmeg
- A3707A
≈ Black Elder
- 9C7956
≈ Prince Paris
Triada +120° +240°
- A47365
Toasted Nutmeg
- 5F8D71
≈ Slate Green
- 767EA8
≈ Roseine Plum
Komplementarna rozszczepiona +150° +210°
- A47365
Toasted Nutmeg
- 4F8E87
≈ Sea Garden
- 6085A6
≈ Moody Indigo
Tetrada +90° +180° +270°
- A47365
Toasted Nutmeg
- 76885D
≈ Fern Canopy
- 508B9A
≈ Blue Square
- 8B77A0
≈ Smashed Grape
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.02:1 · APCA Lc 67
Ag
AANa czerni
WCAG 5.21:1 · APCA Lc 34
Najlepszy kolor tekstu: #000000
WCAG 5.21:1 (AA) · APCA Lc 34
Contrast pairs
Fragmenty kodu
CSS
:root {
--toasted-nutmeg: #a47365;
--toasted-nutmeg-rgb: 164 115 101;
--toasted-nutmeg-oklch: oklch(0.602 0.066 36.6);
}
.element {
color: var(--toasted-nutmeg);
background-color: hsl(13 26% 52%);
border-color: oklch(0.602 0.066 36.6);
}Tailwind CSS v4
@theme {
--color-toasted-nutmeg: #a47365;
--color-toasted-nutmeg-50: #ffefe8;
--color-toasted-nutmeg-100: #fde1d8;
--color-toasted-nutmeg-200: #efcbc0;
--color-toasted-nutmeg-300: #d6ac9f;
--color-toasted-nutmeg-400: #c29183;
--color-toasted-nutmeg-500: #ad7767;
--color-toasted-nutmeg-600: #926558;
--color-toasted-nutmeg-700: #755046;
--color-toasted-nutmeg-800: #573a33;
--color-toasted-nutmeg-900: #3d2823;
--color-toasted-nutmeg-950: #261612;
}SCSS
$toasted-nutmeg: #a47365;
$toasted-nutmeg-rgb: 164, 115, 101;
$toasted-nutmeg-light: mix(#fff, $toasted-nutmeg, 20%);
$toasted-nutmeg-dark: mix(#000, $toasted-nutmeg, 20%);
.element {
color: $toasted-nutmeg;
box-shadow: 0 0 0 2px rgba($toasted-nutmeg, 0.35);
}