Nearest named color · #AF7C4D
#AF7C4D
Nearest named color: Rocky Racoon
#AF7C4D (rgb(175 124 77), hsl(29 39% 49%), oklch(0.627 0.09 62.7)) is closest to the named color Rocky Racoon. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#AF7C4D
oklch(0.627 0.09 62.7)
Color conversions
- HEX
- #af7c4d
- RGB
- rgb(175 124 77)
- HSL
- hsl(29 39% 49%)
- HWB
- hwb(29 30% 31%)
- OKLCH
- oklch(0.627 0.09 62.7)
- OKLab
- oklab(0.627 0.041 0.08)
- CIE Lab
- lab(56.52 16.59 33.72)
- LCH
- lch(56.52 37.58 63.8)
- CMYK
- cmyk(0% 29% 56% 31%)
Tints · Shades · Tones
Tints
- B7895F
- C09670
- C8A282
- D0AF93
- D8BCA5
- E0CAB7
- E8D7C9
- EFE4DB
- F7F1ED
Shades
- 986B42
- 815A37
- 6B4A2C
- 563B22
- 412C18
- 2E1E0F
- 1C1107
- 0B0502
- 010100
Tones
- AB7D53
- A67D59
- A17E5E
- 9D7E64
- 987F69
- 947F6E
- 8F7F72
- 8A8077
- 85807C
Color harmonies
Complementary +180°
- AF7C4D
Rocky Racoon
- 558FBA
≈ Cliff Blue
Analogous -30° +30°
- AF7C4D
Rocky Racoon
- B87465
≈ Azalea Pot
- 9B8745
≈ Wild Grass
Triadic +120° +240°
- AF7C4D
Rocky Racoon
- 3D9A8D
≈ Temple Guard Blue
- 937BB5
≈ Lavender Purple
Split-complementary +150° +210°
- AF7C4D
Rocky Racoon
- 3A96A8
≈ Aqua Dance
- 7685BF
≈ Deep Periwinkle
Tetradic +90° +180° +270°
- AF7C4D
Rocky Racoon
- 5C986E
≈ Endless
- 558FBA
≈ Cliff Blue
- A974A0
≈ Orchid Kiss
Contrast & accessibility
Ag
FailOn white
WCAG 3.61:1 · APCA Lc 64
Ag
AAOn black
WCAG 5.81:1 · APCA Lc 38
Best text color: #000000
WCAG 5.81:1 (AA) · APCA Lc 38
Contrast pairs
Code snippets
CSS
:root {
--rocky-racoon: #af7c4d;
--rocky-racoon-rgb: 175 124 77;
--rocky-racoon-oklch: oklch(0.627 0.09 62.7);
}
.element {
color: var(--rocky-racoon);
background-color: hsl(29 39% 49%);
border-color: oklch(0.627 0.09 62.7);
}Tailwind CSS v4
@theme {
--color-rocky-racoon: #af7c4d;
--color-rocky-racoon-50: #fff1db;
--color-rocky-racoon-100: #fee2c9;
--color-rocky-racoon-200: #f0cdad;
--color-rocky-racoon-300: #d8ae87;
--color-rocky-racoon-400: #c59366;
--color-rocky-racoon-500: #b07843;
--color-rocky-racoon-600: #95663a;
--color-rocky-racoon-700: #77512e;
--color-rocky-racoon-800: #593b20;
--color-rocky-racoon-900: #3e2815;
--color-rocky-racoon-950: #271607;
}SCSS
$rocky-racoon: #af7c4d;
$rocky-racoon-rgb: 175, 124, 77;
$rocky-racoon-light: mix(#fff, $rocky-racoon, 20%);
$rocky-racoon-dark: mix(#000, $rocky-racoon, 20%);
.element {
color: $rocky-racoon;
box-shadow: 0 0 0 2px rgba($rocky-racoon, 0.35);
}