Nearest named color · #A27C48
#A27C48
Nearest named color: Tosty Crust
#A27C48 (rgb(162 124 72), hsl(35 38% 46%), oklch(0.612 0.084 73.8)) is closest to the named color Tosty Crust. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#A27C48
oklch(0.612 0.084 73.8)
Color conversions
- HEX
- #a27c48
- RGB
- rgb(162 124 72)
- HSL
- hsl(35 38% 46%)
- HWB
- hwb(35 28% 36%)
- OKLCH
- oklch(0.612 0.084 73.8)
- OKLab
- oklab(0.612 0.023 0.08)
- CIE Lab
- lab(54.95 10.63 34.08)
- LCH
- lch(54.95 35.7 72.7)
- CMYK
- cmyk(0% 23% 56% 36%)
Tints · Shades · Tones
Tints
- AB895A
- B5956D
- BEA27E
- C7AF90
- D0BCA2
- DAC9B5
- E3D7C7
- ECE4D9
- F6F1EC
Shades
- 8C6B3D
- 775A33
- 634A29
- 4F3B1F
- 3C2C16
- 2A1E0D
- 191106
- 0A0502
- 010100
Tones
- 9F7D4F
- 9B7D55
- 987E5B
- 957E61
- 917F66
- 8E7F6C
- 8B7F71
- 878076
- 84807B
Color harmonies
Complementary +180°
- A27C48
Tosty Crust
- 6086B5
≈ Pacific Coast
Analogous -30° +30°
- A27C48
Tosty Crust
- AE735A
≈ Arizona Clay
- 8C8648
≈ Frog’s Legs
Triadic +120° +240°
- A27C48
Tosty Crust
- 3B9492
≈ Catalan
- 9675A7
≈ Ce Soir
Split-complementary +150° +210°
- A27C48
Tosty Crust
- 448FA9
≈ Boston Blue
- 7D7DB5
≈ Astro Zinger
Tetradic +90° +180° +270°
- A27C48
Tosty Crust
- 509476
≈ Good Luck
- 6086B5
≈ Pacific Coast
- A86F90
≈ Mauve Orchid
Contrast & accessibility
Ag
FailOn white
WCAG 3.80:1 · APCA Lc 66
Ag
AAOn black
WCAG 5.51:1 · APCA Lc 36
Best text color: #000000
WCAG 5.51:1 (AA) · APCA Lc 36
Contrast pairs
Code snippets
CSS
:root {
--tosty-crust: #a27c48;
--tosty-crust-rgb: 162 124 72;
--tosty-crust-oklch: oklch(0.612 0.084 73.8);
}
.element {
color: var(--tosty-crust);
background-color: hsl(35 38% 46%);
border-color: oklch(0.612 0.084 73.8);
}Tailwind CSS v4
@theme {
--color-tosty-crust: #a27c48;
--color-tosty-crust-50: #fff2db;
--color-tosty-crust-100: #f9e5ca;
--color-tosty-crust-200: #e9d0ad;
--color-tosty-crust-300: #d1b287;
--color-tosty-crust-400: #bc9766;
--color-tosty-crust-500: #a77d43;
--color-tosty-crust-600: #8d6a39;
--color-tosty-crust-700: #71552e;
--color-tosty-crust-800: #543d20;
--color-tosty-crust-900: #3b2a15;
--color-tosty-crust-950: #251807;
}SCSS
$tosty-crust: #a27c48;
$tosty-crust-rgb: 162, 124, 72;
$tosty-crust-light: mix(#fff, $tosty-crust, 20%);
$tosty-crust-dark: mix(#000, $tosty-crust, 20%);
.element {
color: $tosty-crust;
box-shadow: 0 0 0 2px rgba($tosty-crust, 0.35);
}