← Back to Editor

#C97245 · #DEA939 · #EFE27C · #BECA8C · #B79975

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C97245

Tangerine · Chocolate · Warm Sun

HEX
#C97245
RGB
rgb(201, 114, 69)
HSL
hsl(20, 55%, 53%)
HSB
hsb(20, 66%, 79%)
CMYK
cmyk(0%, 43%, 66%, 21%)
Oklch
oklch(64.0% 0.125 46.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#DEA939

Ginger · GoldenRod · Sunflower

HEX
#DEA939
RGB
rgb(222, 169, 57)
HSL
hsl(41, 71%, 55%)
HSB
hsb(41, 74%, 87%)
CMYK
cmyk(0%, 24%, 74%, 13%)
Oklch
oklch(76.5% 0.138 82.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#EFE27C

Fresh Green · Khaki · Sunflower

HEX
#EFE27C
RGB
rgb(239, 226, 124)
HSL
hsl(53, 78%, 71%)
HSB
hsb(53, 48%, 94%)
CMYK
cmyk(0%, 5%, 48%, 6%)
Oklch
oklch(90.2% 0.124 102.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#BECA8C

Willow Green · Tan · Apple Green

HEX
#BECA8C
RGB
rgb(190, 202, 140)
HSL
hsl(72, 37%, 67%)
HSB
hsb(72, 31%, 79%)
CMYK
cmyk(6%, 0%, 31%, 21%)
Oklch
oklch(81.5% 0.083 117.2)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#B79975

Ginger · Tan · Warm Sun

HEX
#B79975
RGB
rgb(183, 153, 117)
HSL
hsl(33, 31%, 59%)
HSB
hsb(33, 36%, 72%)
CMYK
cmyk(0%, 16%, 36%, 28%)
Oklch
oklch(70.1% 0.061 71.7)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C97245
459DC9

Analogous

C9455B
C97245
C9B345

Triadic

C97245
45C971
7145C9

Split-Comp.

C97245
45C9B3
455BC9

Tetradic

C97245
5BC945
459DC9
B345C9

Contrast Matrix WCAG 2.1 Contrast

C97245
DEA939
EFE27C
BECA8C
B79975
—
1.6
Fail
2.7
Fail
2.0
Fail
1.3
Fail
1.6
Fail
—
1.6
Fail
1.2
Fail
1.3
Fail
2.7
Fail
1.6
Fail
—
1.3
Fail
2.0
Fail
2.0
Fail
1.2
Fail
1.3
Fail
—
1.5
Fail
1.3
Fail
1.3
Fail
2.0
Fail
1.5
Fail
—
White BG
3.5AA Large
2.1Fail
1.3Fail
1.7Fail
2.7Fail
Black BG
6.0AA
9.8AAA
15.8AAA
12.0AAA
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A3A350
C7C754
E9E995
C3C39B
AAAA7E

Deuteranopia

A8AF53
CACE5B
EAEB9B
C3C29F
ACAE80

Tritanopia

C5585A
DB696E
EEA8AC
BFA7A9
B68586

Achromatopsia

878787
ACACAC
DADADA
BFBFBF
9E9E9E

Shades & Tints Shades & Tints

#C97245

Dark
Light

#DEA939

Dark
Light

#EFE27C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c97245;
  --color-2: #dea939;
  --color-3: #efe27c;
  --color-4: #beca8c;
  --color-5: #b79975;
}

SCSS

$color-1: #c97245;
$color-2: #dea939;
$color-3: #efe27c;
$color-4: #beca8c;
$color-5: #b79975;

TAILWIND

colors: {
  'brand-1': '#c97245',
  'brand-2': '#dea939',
  'brand-3': '#efe27c',
  'brand-4': '#beca8c',
  'brand-5': '#b79975',
}

RGB Array

[201, 114, 69], [222, 169, 57], [239, 226, 124], [190, 202, 140], [183, 153, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C97245, #DEA939, #EFE27C, #BECA8C, #B79975 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c97245; --color-2: #dea939; --color-3: #efe27c; --color-4: #beca8c; --color-5: #b79975. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color