← Back to Editor

#957055 · #A19264 · #CED17F · #E3A26F · #F7725F

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

#957055

Tangerine · DimGray · Amber Brown

HEX
#957055
RGB
rgb(149, 112, 85)
HSL
hsl(25, 27%, 46%)
HSB
hsb(25, 43%, 58%)
CMYK
cmyk(0%, 25%, 43%, 42%)
Oklch
oklch(57.5% 0.061 57.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#A19264

Ginger · Gray · Sunflower

HEX
#A19264
RGB
rgb(161, 146, 100)
HSL
hsl(45, 24%, 51%)
HSB
hsb(45, 38%, 63%)
CMYK
cmyk(0%, 9%, 38%, 37%)
Oklch
oklch(66.2% 0.065 92.1)

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

#CED17F

Fresh Green · BurlyWood · Sunflower

HEX
#CED17F
RGB
rgb(206, 209, 127)
HSL
hsl(62, 47%, 66%)
HSB
hsb(62, 39%, 82%)
CMYK
cmyk(1%, 0%, 39%, 18%)
Oklch
oklch(84.0% 0.105 110.3)

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

#E3A26F

Apricot · DarkSalmon · Warm Sun

HEX
#E3A26F
RGB
rgb(227, 162, 111)
HSL
hsl(26, 67%, 66%)
HSB
hsb(26, 51%, 89%)
CMYK
cmyk(0%, 29%, 51%, 11%)
Oklch
oklch(76.4% 0.102 58.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#F7725F

Peach Pink · Coral · Coral Red

HEX
#F7725F
RGB
rgb(247, 114, 95)
HSL
hsl(8, 90%, 67%)
HSB
hsb(8, 62%, 97%)
CMYK
cmyk(0%, 54%, 62%, 3%)
Oklch
oklch(70.7% 0.167 30.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

957055
567B95

Analogous

95565B
957055
959056

Triadic

957055
569570
705695

Split-Comp.

957055
569590
565B95

Tetradic

957055
5B9556
567B95
905695

Contrast Matrix WCAG 2.1 Contrast

957055
A19264
CED17F
E3A26F
F7725F
—
1.4
Fail
2.8
Fail
2.0
Fail
1.6
Fail
1.4
Fail
—
1.9
Fail
1.4
Fail
1.1
Fail
2.8
Fail
1.9
Fail
—
1.4
Fail
1.7
Fail
2.0
Fail
1.4
Fail
1.4
Fail
—
1.3
Fail
1.6
Fail
1.1
Fail
1.7
Fail
1.3
Fail
—
White BG
4.4AA Large
3.1AA Large
1.6Fail
2.2Fail
2.8Fail
Black BG
4.7AA
6.8AA
13.1AAA
9.7AAA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

85855C
9B9A6F
CFCF93
C7C67B
BDBC64

Deuteranopia

878A5D
9B9D72
CFCF98
CBCF7E
C5CF65

Tritanopia

936162
A0787A
CEA3A6
E08587
F06768

Achromatopsia

787878
919191
C7C7C7
B0B0B0
989898

Shades & Tints Shades & Tints

#957055

Dark
Light

#A19264

Dark
Light

#CED17F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #957055;
  --color-2: #a19264;
  --color-3: #ced17f;
  --color-4: #e3a26f;
  --color-5: #f7725f;
}

SCSS

$color-1: #957055;
$color-2: #a19264;
$color-3: #ced17f;
$color-4: #e3a26f;
$color-5: #f7725f;

TAILWIND

colors: {
  'brand-1': '#957055',
  'brand-2': '#a19264',
  'brand-3': '#ced17f',
  'brand-4': '#e3a26f',
  'brand-5': '#f7725f',
}

RGB Array

[149, 112, 85], [161, 146, 100], [206, 209, 127], [227, 162, 111], [247, 114, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #957055, #A19264, #CED17F, #E3A26F, #F7725F 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: #957055; --color-2: #a19264; --color-3: #ced17f; --color-4: #e3a26f; --color-5: #f7725f. 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