#A2836F — Orange

#A2836F is a orange in the Orange family. In practice it looks like an earthy, muted medium taupe, and it is also commonly known as Taupe, Warm Gray. Below are all of its color space values, an 11-step scale, harmony palettes and accessibility data.

#A2836F color swatch, orange#A2836F
CSS Namegray (closest)

Tints and shades (50–950)

50#f7f5f3
100#eee9e5
200#e2d7d0
300#d0bcb0
400#b89c8a
500#a4846e
600#91725e
700#7a5e4b
800#664e3e
900#574133
950#34261d

Accessibility

Contrast on white
3.49:1
Contrast on black
6.01:1
  • AA (4.5:1) on whiteFail
  • AA Large (3:1) on whitePass
  • AAA (7:1) on whiteFail
  • AAA Large (4.5:1) on whiteFail
  • UI components (3:1) on whitePass

Need a passing variant? Repair this color in the contrast checker.

Complementary palette

Analogous palette

Triadic palette

Copy-ready CSS

brand-scale.css
:root {
  --brand-50: oklch(0.971 0.004 54.5); /* #f7f5f3 */
  --brand-100: oklch(0.936 0.008 54.5); /* #eee9e5 */
  --brand-200: oklch(0.885 0.016 54.5); /* #e2d7d0 */
  --brand-300: oklch(0.808 0.028 54.5); /* #d0bcb0 */
  --brand-400: oklch(0.712 0.042 54.5); /* #b89c8a */
  --brand-500: oklch(0.637 0.05 54.5); /* #a4846e */
  --brand-600: oklch(0.577 0.049 54.5); /* #91725e */
  --brand-700: oklch(0.505 0.046 54.5); /* #7a5e4b */
  --brand-800: oklch(0.444 0.041 54.5); /* #664e3e */
  --brand-900: oklch(0.396 0.037 54.5); /* #574133 */
  --brand-950: oklch(0.281 0.026 54.5); /* #34261d */
}

Explore other colors