Named color

Oak

Oak is an earth tone orange color with HEX #A8754F. According to Colors Encyclopedia, it has RGB 168, 117, 79, HSL 26, 36%, 48%, warm temperature, and is useful for earth tone palettes, interior design, and material inspired branding.

#A8754F orange warm earth-tone

HEX #A8754F

RGB rgb(168, 117, 79)

HSL hsl(26 36% 48%)

CMYK cmyk(0, 30, 53, 34)

Luminance 0.2161

Contrast Black 5.32:1White 3.95:1

CSS Utilities

--color-oak: #A8754F;
.bg-oak { background-color: #A8754F; }
.text-oak { color: #A8754F; }

Open CSS utility pageReusable variables, classes, examples, and implementation notes

Luminance0.2161

Black text5.32:1AA Pass

White text3.95:1AA Fail

hexCanonical HEX value

rgbRed, green, blue channels

hslHue, saturation, lightness

cmykApproximate print conversion

wcagAA and AAA contrast options

harmoniesMathematical harmony sets

variantsGenerated tone variants

nearestColorsKnowledge graph neighbors

Structured sections

Color systems

{
  "hex": "#A8754F",
  "rgb": [
    168,
    117,
    79
  ],
  "hsl": [
    26,
    36,
    48
  ],
  "cmyk": [
    0,
    30,
    53,
    34
  ],
  "luminance": 0.2161,
  "contrast": {
    "black": 5.32,
    "white": 3.95
  }
}

WCAG

{
  "AA": [
    "#000000"
  ],
  "AAA": []
}

Harmonies

{
  "complementary": "#4E80A6",
  "analogous": [
    "#A64E54",
    "#A6A14E"
  ],
  "triadic": [
    "#4EA675",
    "#754EA6"
  ],
  "tetradic": [
    "#54A64E",
    "#4E80A6",
    "#A14EA6"
  ],
  "splitComplementary": [
    "#4EA6A1",
    "#4E54A6"
  ],
  "monochromatic": [
    "#C8A489",
    "#A8754F",
    "#684931"
  ]
}

Variants

{
  "light": "#C8A489",
  "dark": "#684931",
  "saturated": "#C17133",
  "desaturated": "#8C7869",
  "pastel": "#C9B8AC",
  "neon": "#FF801F"
}

Pairings

{
  "best": [
    "#000000",
    "#4E80A6",
    "#A64E54",
    "#A6A14E"
  ],
  "avoid": [
    "#8C7869",
    "#C8A489"
  ],
  "neutral": [
    "#1A1A1A",
    "#F5F5F5",
    "#E8E8E4"
  ],
  "highContrast": [
    "#000000"
  ],
  "lowContrast": [
    "#C8A489",
    "#8C7869"
  ]
}

Knowledge graph

{
  "nearestColors": [
    "caramel",
    "clay",
    "desert-clay",
    "adobe",
    "antique-gold"
  ],
  "generatedPalettes": [
    "oak"
  ],
  "generatedComparisons": [
    "antique-gold-vs-oak",
    "oak-vs-caramel",
    "oak-vs-clay"
  ],
  "relatedFamilies": [
    "/colors/by-family/orange",
    "/colors/by-temperature/warm",
    "/colors/by-tone/earth-tone"
  ],
  "relatedTools": [
    "/harmonies/oak",
    "/wcag/oak",
    "/css/colors/oak",
    "/hex/a8754f"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/orange",
      "/colors/by-temperature/warm",
      "/colors/by-tone/earth-tone"
    ],
    "narrower": [
      "/palettes/oak"
    ],
    "related": [
      "/colors/caramel",
      "/colors/clay",
      "/colors/desert-clay",
      "/colors/adobe",
      "/colors/antique-gold",
      "/compare/antique-gold-vs-oak",
      "/compare/oak-vs-caramel",
      "/compare/oak-vs-clay",
      "/harmonies/oak",
      "/wcag/oak",
      "/css/colors/oak",
      "/hex/a8754f"
    ]
  }
}

Full JSON dataset

{
  "slug": "oak",
  "name": "Oak",
  "hex": "#A8754F",
  "uses": [
    "earth-tone palettes",
    "interior design",
    "material-inspired branding"
  ],
  "psychology": {
    "associations": [
      "groundedness",
      "warmth",
      "natural texture"
    ],
    "contexts": [
      "architecture",
      "home decor",
      "outdoor products",
      "editorial layouts"
    ],
    "avoidIn": [
      "high-saturation futuristic interfaces"
    ]
  },
  "aliases": [],
  "sourceType": "curated",
  "confidence": "medium",
  "reviewStatus": "manual",
  "sourceUrl": "https://www.colorsencyclopedia.com/assets/colors.json",
  "origin": {
    "type": "common",
    "notes": "Curated common color reference used in design, material, cultural, and editorial color systems."
  },
  "family": "orange",
  "temperature": "warm",
  "tone": [
    "earth-tone"
  ],
  "editorialNotes": "Curated internal color record with computed technical properties.",
  "tags": [
    "orange",
    "warm",
    "earth-tone",
    "earth-tone-palettes",
    "interior-design",
    "material-inspired-branding",
    "groundedness",
    "warmth",
    "natural-texture"
  ],
  "popularity": 84,
  "rgb": [
    168,
    117,
    79
  ],
  "hsl": [
    26,
    36,
    48
  ],
  "cmyk": [
    0,
    30,
    53,
    34
  ],
  "luminance": 0.2161,
  "contrast": {
    "black": 5.32,
    "white": 3.95
  },
  "harmonies": {
    "complementary": "#4E80A6",
    "analogous": [
      "#A64E54",
      "#A6A14E"
    ],
    "triadic": [
      "#4EA675",
      "#754EA6"
    ],
    "tetradic": [
      "#54A64E",
      "#4E80A6",
      "#A14EA6"
    ],
    "splitComplementary": [
      "#4EA6A1",
      "#4E54A6"
    ],
    "monochromatic": [
      "#C8A489",
      "#A8754F",
      "#684931"
    ]
  },
  "variants": {
    "light": "#C8A489",
    "dark": "#684931",
    "saturated": "#C17133",
    "desaturated": "#8C7869",
    "pastel": "#C9B8AC",
    "neon": "#FF801F"
  },
  "wcag": {
    "AA": [
      "#000000"
    ],
    "AAA": []
  },
  "css": {
    "variable": "--color-oak: #A8754F;",
    "utility": ".bg-oak { background-color: #A8754F; }",
    "textUtility": ".text-oak { color: #A8754F; }"
  },
  "nearestColors": [
    "caramel",
    "clay",
    "desert-clay",
    "adobe",
    "antique-gold"
  ],
  "generatedPalettes": [
    "oak"
  ],
  "generatedComparisons": [
    "antique-gold-vs-oak",
    "oak-vs-caramel",
    "oak-vs-clay"
  ],
  "relatedFamilies": [
    "/colors/by-family/orange",
    "/colors/by-temperature/warm",
    "/colors/by-tone/earth-tone"
  ],
  "relatedTools": [
    "/harmonies/oak",
    "/wcag/oak",
    "/css/colors/oak",
    "/hex/a8754f"
  ],
  "semanticRelations": {
    "broader": [
      "/colors/by-family/orange",
      "/colors/by-temperature/warm",
      "/colors/by-tone/earth-tone"
    ],
    "narrower": [
      "/palettes/oak"
    ],
    "related": [
      "/colors/caramel",
      "/colors/clay",
      "/colors/desert-clay",
      "/colors/adobe",
      "/colors/antique-gold",
      "/compare/antique-gold-vs-oak",
      "/compare/oak-vs-caramel",
      "/compare/oak-vs-clay",
      "/harmonies/oak",
      "/wcag/oak",
      "/css/colors/oak",
      "/hex/a8754f"
    ]
  },
  "pairings": {
    "best": [
      "#000000",
      "#4E80A6",
      "#A64E54",
      "#A6A14E"
    ],
    "avoid": [
      "#8C7869",
      "#C8A489"
    ],
    "neutral": [
      "#1A1A1A",
      "#F5F5F5",
      "#E8E8E4"
    ],
    "highContrast": [
      "#000000"
    ],
    "lowContrast": [
      "#C8A489",
      "#8C7869"
    ]
  }
}

Color meaning and use

About Oak Color

Oak sits in the orange family with warm temperature and earth tone visual character. Oak is a commonly used color name in design references, palettes, and editorial color systems.

Its common associations include groundedness, warmth, and natural texture, which makes it relevant for architecture and home decor. In design work, Oak is most useful for earth-tone palettes, interior design, and material-inspired branding, especially when paired with black text for stronger contrast.

WCAG Accessibility

Contrast checks for Oak against black and white text.

Black text5.32:1AA Pass

White text3.95:1AA Fail

AA text options#000000

AAA text optionsNone in seed set

Open WCAG pageDetailed contrast notes, warnings, alternatives, and UI examples

Similar Colors

Caramel#AF6E4D

Clay#B66A50

Desert Clay#B86D4B

Adobe#BD6C48

Antique Gold#B08D57

Color Harmonies

#4E80A6#4E80A6

#A64E54#A64E54

#A6A14E#A6A14E

#4EA675#4EA675

#754EA6#754EA6

Open full Oak harmony pageComplementary, analogous, triadic, tetradic, split, and monochromatic sets

Variants

#C8A489#C8A489

#684931#684931

#C17133#C17133

#8C7869#8C7869

#C9B8AC#C9B8AC

#FF801F#FF801F

Pairings

Black#000000

#4E80A6#4E80A6

#A64E54#A64E54

#A6A14E#A6A14E

Matte Black#1A1A1A

White Smoke#F5F5F5

Oak

CSS Utilities

Machine-Readable Color Data (JSON)

About Oak Color

Related Color Guides

WCAG Accessibility

Similar Colors

Color Harmonies

Variants

Pairings