Adlandırılmış renk · #A58E71
Motif
Motif, #A58E71: rgb(165 142 113), hsl(33 22% 55%), oklch(0.66 0.049 73.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Motif color name →
#A58E71
oklch(0.66 0.049 73.2)
Renk dönüşümleri
- HEX
- #a58e71
- RGB
- rgb(165 142 113)
- HSL
- hsl(33 22% 55%)
- HWB
- hwb(33 44% 35%)
- OKLCH
- oklch(0.66 0.049 73.2)
- OKLab
- oklab(0.66 0.014 0.047)
- CIE Lab
- lab(60.57 5.66 18.87)
- LCH
- lch(60.57 19.7 73.3)
- CMYK
- cmyk(0% 14% 32% 35%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- AE997F
- B7A48C
- BFAF9A
- C8BAA8
- D1C5B6
- DAD1C4
- E3DCD3
- EDE8E1
- F6F3F0
Koyu tonlar
- 8F7B61
- 796852
- 655643
- 514435
- 3D3427
- 2B241A
- 1A150E
- 0A0704
- 010101
Gri tonlar
- A18D73
- 9E8B74
- 9A8A76
- 968978
- 938779
- 8F867B
- 8B847C
- 87837D
- 84817F
Renk uyumları
Tamamlayıcı +180°
- A58E71
Motif
- 7D94B0
≈ Accolade
Analog -30° +30°
- A58E71
Motif
- AD897A
≈ Nougat
- 979471
≈ Inness Sage
Üçlü +120° +240°
Bölünmüş tamamlayıcı +150° +210°
- A58E71
Motif
- 7199A9
≈ Smoky Blue
- 8D8FB0
≈ Persian Violet
Dörtlü +90° +180° +270°
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.13:1 · APCA Lc 58
Ag
AASiyah üzerinde
WCAG 6.70:1 · APCA Lc 43
En iyi metin rengi: #000000
WCAG 6.70:1 (AA) · APCA Lc 43
Contrast pairs
Kod parçacıkları
CSS
:root {
--motif: #a58e71;
--motif-rgb: 165 142 113;
--motif-oklch: oklch(0.66 0.049 73.2);
}
.element {
color: var(--motif);
background-color: hsl(33 22% 55%);
border-color: oklch(0.66 0.049 73.2);
}Tailwind CSS v4
@theme {
--color-motif: #a58e71;
--color-motif-50: #fef4e6;
--color-motif-100: #f2e6d6;
--color-motif-200: #e1d2be;
--color-motif-300: #c7b49c;
--color-motif-400: #b19a7f;
--color-motif-500: #9a8162;
--color-motif-600: #836e53;
--color-motif-700: #695842;
--color-motif-800: #4d4030;
--color-motif-900: #362c20;
--color-motif-950: #211910;
}SCSS
$motif: #a58e71;
$motif-rgb: 165, 142, 113;
$motif-light: mix(#fff, $motif, 20%);
$motif-dark: mix(#000, $motif, 20%);
.element {
color: $motif;
box-shadow: 0 0 0 2px rgba($motif, 0.35);
}