← Back to Editor

#C23A25 · #B56244 · #A5926B · #899A7C · #6DA28C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C23A25

Vermilion · FireBrick · Passion Red

HEX
#C23A25
RGB
rgb(194, 58, 37)
HSL
hsl(8, 68%, 45%)
HSB
hsb(8, 81%, 76%)
CMYK
cmyk(0%, 70%, 81%, 24%)
Oklch
oklch(54.7% 0.176 31.6)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#B56244

Tangerine · Sienna · Amber Brown

HEX
#B56244
RGB
rgb(181, 98, 68)
HSL
hsl(16, 45%, 49%)
HSB
hsb(16, 62%, 71%)
CMYK
cmyk(0%, 46%, 62%, 29%)
Oklch
oklch(58.6% 0.116 40.3)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#A5926B

Ginger · Gray · Sunflower

HEX
#A5926B
RGB
rgb(165, 146, 107)
HSL
hsl(40, 24%, 53%)
HSB
hsb(40, 35%, 65%)
CMYK
cmyk(0%, 12%, 35%, 35%)
Oklch
oklch(66.7% 0.058 84.9)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#899A7C

Celadon · Gray · Olive Green

HEX
#899A7C
RGB
rgb(137, 154, 124)
HSL
hsl(94, 13%, 55%)
HSB
hsb(94, 19%, 60%)
CMYK
cmyk(11%, 0%, 19%, 40%)
Oklch
oklch(66.4% 0.047 131.7)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#6DA28C

Mineral Blue · CadetBlue · Olive Green

HEX
#6DA28C
RGB
rgb(109, 162, 140)
HSL
hsl(155, 22%, 53%)
HSB
hsb(155, 33%, 64%)
CMYK
cmyk(33%, 0%, 14%, 36%)
Oklch
oklch(66.9% 0.065 166.6)

TraditionalMineral Blue」· PaintOlive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C23A25
25ACC1

Analogous

C1255E
C23A25
C18825

Triadic

C23A25
25C13A
3A25C1

Split-Comp.

C23A25
25C188
255EC1

Tetradic

C23A25
5EC125
25ACC1
8825C1

Contrast Matrix WCAG 2.1 Contrast

C23A25
B56244
A5926B
899A7C
6DA28C
1.2
Fail
1.8
Fail
1.8
Fail
1.8
Fail
1.2
Fail
1.4
Fail
1.5
Fail
1.5
Fail
1.8
Fail
1.4
Fail
1.0
Fail
1.0
Fail
1.8
Fail
1.5
Fail
1.0
Fail
1.0
Fail
1.8
Fail
1.5
Fail
1.0
Fail
1.0
Fail
White BG
5.3AA
4.4AA Large
3.0AA Large
3.0AA Large
2.9Fail
Black BG
3.9AA Large
4.8AA
6.9AA
7.0AA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

87862A
91904B
9D9D74
909183
848491

Deuteranopia

8F992B
969C4D
9E9F77
8F8E85
817D93

Tritanopia

BB2E2F
B15152
A47C7E
8A898A
709696

Achromatopsia

606060
777777
939393
919191
909090

Shades & Tints Shades & Tints

#C23A25

Dark
Light

#B56244

Dark
Light

#A5926B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c23a25;
  --color-2: #b56244;
  --color-3: #a5926b;
  --color-4: #899a7c;
  --color-5: #6da28c;
}

SCSS

$color-1: #c23a25;
$color-2: #b56244;
$color-3: #a5926b;
$color-4: #899a7c;
$color-5: #6da28c;

TAILWIND

colors: {
  'brand-1': '#c23a25',
  'brand-2': '#b56244',
  'brand-3': '#a5926b',
  'brand-4': '#899a7c',
  'brand-5': '#6da28c',
}

RGB Array

[194, 58, 37], [181, 98, 68], [165, 146, 107], [137, 154, 124], [109, 162, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C23A25, #B56244, #A5926B, #899A7C, #6DA28C 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: #c23a25; --color-2: #b56244; --color-3: #a5926b; --color-4: #899a7c; --color-5: #6da28c. 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