← Back to Editor

#FFC37E · #FF7D5A · #878265 · #466E66 · #2A2E3A

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 LibraryData Visualization

Color Details Color Details

#FFC37E

Goose Yellow · LightSalmon · Warm Sun

HEX
#FFC37E
RGB
rgb(255, 195, 126)
HSL
hsl(32, 100%, 75%)
HSB
hsb(32, 51%, 100%)
CMYK
cmyk(0%, 24%, 51%, 0%)
Oklch
oklch(85.7% 0.110 69.4)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#FF7D5A

Peach Pink · Coral · Coral Red

HEX
#FF7D5A
RGB
rgb(255, 125, 90)
HSL
hsl(13, 100%, 68%)
HSB
hsb(13, 65%, 100%)
CMYK
cmyk(0%, 51%, 65%, 0%)
Oklch
oklch(73.3% 0.167 36.1)

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

#878265

Autumn Sage · Gray · Honey Gold

HEX
#878265
RGB
rgb(135, 130, 101)
HSL
hsl(51, 14%, 46%)
HSB
hsb(51, 25%, 53%)
CMYK
cmyk(0%, 4%, 25%, 47%)
Oklch
oklch(60.3% 0.042 99.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#466E66

Mineral Blue · DimGray · Mint Ice

HEX
#466E66
RGB
rgb(70, 110, 102)
HSL
hsl(168, 22%, 35%)
HSB
hsb(168, 36%, 43%)
CMYK
cmyk(36%, 0%, 7%, 57%)
Oklch
oklch(50.6% 0.047 180.3)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#2A2E3A

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#2A2E3A
RGB
rgb(42, 46, 58)
HSL
hsl(225, 16%, 20%)
HSB
hsb(225, 28%, 23%)
CMYK
cmyk(28%, 21%, 0%, 77%)
Oklch
oklch(30.2% 0.022 270.6)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFC37E
80BBFF

Analogous

FF8480
FFC37E
FBFF80

Triadic

FFC37E
80FFC3
C380FF

Split-Comp.

FFC37E
80FBFF
8480FF

Tetradic

FFC37E
80FF84
80BBFF
FF80FB

Contrast Matrix WCAG 2.1 Contrast

FFC37E
FF7D5A
878265
466E66
2A2E3A
—
1.6
Fail
2.5
Fail
3.6
AA Large
8.6
AAA
1.6
Fail
—
1.5
Fail
2.3
Fail
5.4
AA
2.5
Fail
1.5
Fail
—
1.5
Fail
3.5
AA Large
3.6
AA Large
2.3
Fail
1.5
Fail
—
2.4
Fail
8.6
AAA
5.4
AA
3.5
AA Large
2.4
Fail
—
White BG
1.6Fail
2.5Fail
3.9AA Large
5.7AA
13.5AAA
Black BG
13.4AAA
8.3AAA
5.4AA
3.7AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E48F
C7C662
85856C
575868
2C2C37

Deuteranopia

E9ED93
CED865
85866E
555268
2C2B36

Tritanopia

FC9C9F
F9696B
877273
48696A
2A3534

Achromatopsia

CDCDCD
A0A0A0
808080
616161
2E2E2E

Shades & Tints Shades & Tints

#FFC37E

Dark
Light

#FF7D5A

Dark
Light

#878265

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffc37e;
  --color-2: #ff7d5a;
  --color-3: #878265;
  --color-4: #466e66;
  --color-5: #2a2e3a;
}

SCSS

$color-1: #ffc37e;
$color-2: #ff7d5a;
$color-3: #878265;
$color-4: #466e66;
$color-5: #2a2e3a;

TAILWIND

colors: {
  'brand-1': '#ffc37e',
  'brand-2': '#ff7d5a',
  'brand-3': '#878265',
  'brand-4': '#466e66',
  'brand-5': '#2a2e3a',
}

RGB Array

[255, 195, 126], [255, 125, 90], [135, 130, 101], [70, 110, 102], [42, 46, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFC37E, #FF7D5A, #878265, #466E66, #2A2E3A is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #ffc37e; --color-2: #ff7d5a; --color-3: #878265; --color-4: #466e66; --color-5: #2a2e3a. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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