← Back to Editor

#C69456 · #BD754F · #B35748 · #AA3841 · #A0193A

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

#C69456

Ginger · SandyBrown · Warm Sun

HEX
#C69456
RGB
rgb(198, 148, 86)
HSL
hsl(33, 50%, 56%)
HSB
hsb(33, 57%, 78%)
CMYK
cmyk(0%, 25%, 57%, 22%)
Oklch
oklch(70.1% 0.100 70.9)

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

#BD754F

Tangerine · Chocolate · Warm Sun

HEX
#BD754F
RGB
rgb(189, 117, 79)
HSL
hsl(21, 45%, 53%)
HSB
hsb(21, 58%, 74%)
CMYK
cmyk(0%, 38%, 58%, 26%)
Oklch
oklch(63.2% 0.105 48.0)

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

#B35748

Crimson · Sienna · Passion Red

HEX
#B35748
RGB
rgb(179, 87, 72)
HSL
hsl(8, 43%, 49%)
HSB
hsb(8, 60%, 70%)
CMYK
cmyk(0%, 51%, 60%, 30%)
Oklch
oklch(56.6% 0.123 30.8)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#AA3841

Crimson · Brown · Passion Red

HEX
#AA3841
RGB
rgb(170, 56, 65)
HSL
hsl(355, 50%, 44%)
HSB
hsb(355, 67%, 67%)
CMYK
cmyk(0%, 67%, 62%, 33%)
Oklch
oklch(50.8% 0.149 19.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#A0193A

Vermilion · Brown · Wine Red

HEX
#A0193A
RGB
rgb(160, 25, 58)
HSL
hsl(345, 73%, 36%)
HSB
hsb(345, 84%, 63%)
CMYK
cmyk(0%, 84%, 64%, 37%)
Oklch
oklch(46.1% 0.168 14.3)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C69456
5789C7

Analogous

C75C57
C69456
C1C757

Triadic

C69456
57C794
9457C7

Split-Comp.

C69456
57C1C7
5C57C7

Tetradic

C69456
57C75C
5789C7
C757C1

Contrast Matrix WCAG 2.1 Contrast

C69456
BD754F
B35748
AA3841
A0193A
—
1.3
Fail
1.8
Fail
2.3
Fail
2.9
Fail
1.3
Fail
—
1.3
Fail
1.7
Fail
2.2
Fail
1.8
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
2.3
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.9
Fail
2.2
Fail
1.6
Fail
1.2
Fail
—
White BG
2.7Fail
3.6AA Large
4.8AA
6.3AA
7.8AAA
Black BG
7.8AAA
5.8AA
4.4AA Large
3.4AA Large
2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B065
9E9D58
8B8A4C
79783F
666432

Deuteranopia

B3B769
A2A75A
91974D
7F883E
6D7830

Tritanopia

C47173
B95F61
AE4E4F
A43D3D
992C2A

Achromatopsia

9C9C9C
868686
717171
5B5B5B
454545

Shades & Tints Shades & Tints

#C69456

Dark
Light

#BD754F

Dark
Light

#B35748

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c69456;
  --color-2: #bd754f;
  --color-3: #b35748;
  --color-4: #aa3841;
  --color-5: #a0193a;
}

SCSS

$color-1: #c69456;
$color-2: #bd754f;
$color-3: #b35748;
$color-4: #aa3841;
$color-5: #a0193a;

TAILWIND

colors: {
  'brand-1': '#c69456',
  'brand-2': '#bd754f',
  'brand-3': '#b35748',
  'brand-4': '#aa3841',
  'brand-5': '#a0193a',
}

RGB Array

[198, 148, 86], [189, 117, 79], [179, 87, 72], [170, 56, 65], [160, 25, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C69456, #BD754F, #B35748, #AA3841, #A0193A 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: #c69456; --color-2: #bd754f; --color-3: #b35748; --color-4: #aa3841; --color-5: #a0193a. 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