Couleur nommée · #A48B74
Natural
Natural correspond à #A48B74 : rgb(164 139 116), hsl(29 21% 55%), oklch(0.653 0.045 64.5). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Natural color name →
#A48B74
oklch(0.653 0.045 64.5)
Conversions de couleur
- HEX
- #a48b74
- RGB
- rgb(164 139 116)
- HSL
- hsl(29 21% 55%)
- HWB
- hwb(29 45% 36%)
- OKLCH
- oklch(0.653 0.045 64.5)
- OKLab
- oklab(0.653 0.019 0.04)
- CIE Lab
- lab(59.73 7.13 16.04)
- LCH
- lch(59.73 17.56 66)
- CMYK
- cmyk(0% 15% 29% 36%)
Teintes · Ombres · Tons
Teintes
- AD9681
- B6A18F
- BFAD9C
- C8B8AA
- D1C4B8
- DACFC6
- E3DBD4
- ECE7E2
- F6F3F0
Ombres
- 8E7864
- 796654
- 645445
- 504337
- 3D3229
- 2B231B
- 1A140F
- 0A0705
- 010101
Tons
- A08A75
- 9D8977
- 998878
- 968779
- 92867A
- 8E857C
- 8B837D
- 87827E
- 84817F
Harmonies de couleurs
Complémentaire +180°
- A48B74
Natural
- 7A94AA
≈ Nordland Blue
Analogue -30° +30°
- A48B74
Natural
- AA877E
≈ Bedford Brown
- 999071
≈ Gurkha
Triadique +120° +240°
- A48B74
Natural
- 729A93
≈ Pale Verdigris
- 968AA7
≈ Smoky Mauve
Complémentaire divisée +150° +210°
- A48B74
Natural
- 7198A1
≈ Cameo Blue
- 888FAC
≈ Papilio Argeotus
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 3.21:1 · APCA Lc 59
Ag
AASur noir
WCAG 6.52:1 · APCA Lc 42
Meilleure couleur de texte: #000000
WCAG 6.52:1 (AA) · APCA Lc 42
Contrast pairs
Extraits de code
CSS
:root {
--natural: #a48b74;
--natural-rgb: 164 139 116;
--natural-oklch: oklch(0.653 0.045 64.5);
}
.element {
color: var(--natural);
background-color: hsl(29 21% 55%);
border-color: oklch(0.653 0.045 64.5);
}Tailwind CSS v4
@theme {
--color-natural: #a48b74;
--color-natural-50: #fef3e8;
--color-natural-100: #f3e5d9;
--color-natural-200: #e2d1c1;
--color-natural-300: #c8b3a0;
--color-natural-400: #b29983;
--color-natural-500: #9c8067;
--color-natural-600: #836d58;
--color-natural-700: #695746;
--color-natural-800: #4e3f32;
--color-natural-900: #362b22;
--color-natural-950: #211911;
}SCSS
$natural: #a48b74;
$natural-rgb: 164, 139, 116;
$natural-light: mix(#fff, $natural, 20%);
$natural-dark: mix(#000, $natural, 20%);
.element {
color: $natural;
box-shadow: 0 0 0 2px rgba($natural, 0.35);
}