← Back to Editor

#C3C4A2 · #6E9884 · #7C6F5F · #B9A17F · #E9AE8C

sunset

A 5-color sunset 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

#C3C4A2

Fresh Green · Silver · Sunflower

HEX
#C3C4A2
RGB
rgb(195, 196, 162)
HSL
hsl(62, 22%, 70%)
HSB
hsb(62, 17%, 77%)
CMYK
cmyk(1%, 0%, 17%, 23%)
Oklch
oklch(81.1% 0.046 108.8)

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

#6E9884

Mineral Blue · SlateGray · Olive Green

HEX
#6E9884
RGB
rgb(110, 152, 132)
HSL
hsl(151, 17%, 51%)
HSB
hsb(151, 28%, 60%)
CMYK
cmyk(28%, 0%, 13%, 40%)
Oklch
oklch(64.3% 0.055 163.8)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#7C6F5F

Ochre · DimGray · Amber Brown

HEX
#7C6F5F
RGB
rgb(124, 111, 95)
HSL
hsl(33, 13%, 43%)
HSB
hsb(33, 23%, 49%)
CMYK
cmyk(0%, 10%, 23%, 51%)
Oklch
oklch(54.9% 0.029 72.9)

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

#B9A17F

Ginger · Tan · Warm Sun

HEX
#B9A17F
RGB
rgb(185, 161, 127)
HSL
hsl(35, 29%, 61%)
HSB
hsb(35, 31%, 73%)
CMYK
cmyk(0%, 13%, 31%, 27%)
Oklch
oklch(72.1% 0.055 76.3)

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

#E9AE8C

Apricot · BurlyWood · Warm Sun

HEX
#E9AE8C
RGB
rgb(233, 174, 140)
HSL
hsl(22, 68%, 73%)
HSB
hsb(22, 40%, 91%)
CMYK
cmyk(0%, 25%, 40%, 9%)
Oklch
oklch(79.7% 0.083 51.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C3C4A2
A3A2C3

Analogous

C3B4A2
C3C4A2
B1C3A2

Triadic

C3C4A2
A2C2C3
C3A2C2

Split-Comp.

C3C4A2
A2B1C3
B4A2C3

Tetradic

C3C4A2
A2C3B4
A3A2C3
C3A2B1

Contrast Matrix WCAG 2.1 Contrast

C3C4A2
6E9884
7C6F5F
B9A17F
E9AE8C
—
1.8
Fail
2.7
Fail
1.4
Fail
1.1
Fail
1.8
Fail
—
1.5
Fail
1.3
Fail
1.7
Fail
2.7
Fail
1.5
Fail
—
2.0
Fail
2.5
Fail
1.4
Fail
1.3
Fail
2.0
Fail
—
1.3
Fail
1.1
Fail
1.7
Fail
2.5
Fail
1.3
Fail
—
White BG
1.8Fail
3.2AA Large
4.9AA
2.5Fail
1.9Fail
Black BG
11.7AAA
6.5AA
4.3AA Large
8.5AAA
10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C3AA
808189
767663
AFAE87
CFCF94

Deuteranopia

C3C3AC
7E7B8A
777864
B0B289
D3D796

Tritanopia

C3B1B2
708D8E
7B6667
B88E8F
E69B9C

Achromatopsia

C0C0C0
898989
717171
A4A4A4
BCBCBC

Shades & Tints Shades & Tints

#C3C4A2

Dark
Light

#6E9884

Dark
Light

#7C6F5F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c3c4a2;
  --color-2: #6e9884;
  --color-3: #7c6f5f;
  --color-4: #b9a17f;
  --color-5: #e9ae8c;
}

SCSS

$color-1: #c3c4a2;
$color-2: #6e9884;
$color-3: #7c6f5f;
$color-4: #b9a17f;
$color-5: #e9ae8c;

TAILWIND

colors: {
  'brand-1': '#c3c4a2',
  'brand-2': '#6e9884',
  'brand-3': '#7c6f5f',
  'brand-4': '#b9a17f',
  'brand-5': '#e9ae8c',
}

RGB Array

[195, 196, 162], [110, 152, 132], [124, 111, 95], [185, 161, 127], [233, 174, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #C3C4A2, #6E9884, #7C6F5F, #B9A17F, #E9AE8C is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c3c4a2; --color-2: #6e9884; --color-3: #7c6f5f; --color-4: #b9a17f; --color-5: #e9ae8c. 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 sunset-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. 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