← Back to Editor

#DEDED7 · #C1C4A5 · #D78124 · #D45B69 · #AD405F

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

#DEDED7

Fresh Green · LightGray · Lemon Cream

HEX
#DEDED7
RGB
rgb(222, 222, 215)
HSL
hsl(60, 10%, 86%)
HSB
hsb(60, 3%, 87%)
CMYK
cmyk(0%, 0%, 3%, 13%)
Oklch
oklch(89.9% 0.009 106.6)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#C1C4A5

Fresh Green · Silver · Sunflower

HEX
#C1C4A5
RGB
rgb(193, 196, 165)
HSL
hsl(66, 21%, 71%)
HSB
hsb(66, 16%, 77%)
CMYK
cmyk(2%, 0%, 16%, 23%)
Oklch
oklch(81.0% 0.042 111.8)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#D78124

Ochre · Chocolate · Amber Brown

HEX
#D78124
RGB
rgb(215, 129, 36)
HSL
hsl(31, 71%, 49%)
HSB
hsb(31, 83%, 84%)
CMYK
cmyk(0%, 40%, 83%, 16%)
Oklch
oklch(68.1% 0.145 61.7)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

#D45B69

Crimson · LightCoral · Passion Red

HEX
#D45B69
RGB
rgb(212, 91, 105)
HSL
hsl(353, 58%, 59%)
HSB
hsb(353, 57%, 83%)
CMYK
cmyk(0%, 57%, 50%, 17%)
Oklch
oklch(62.7% 0.153 15.6)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#AD405F

Dark Violet · Sienna · Camellia

HEX
#AD405F
RGB
rgb(173, 64, 95)
HSL
hsl(343, 46%, 46%)
HSB
hsb(343, 63%, 68%)
CMYK
cmyk(0%, 63%, 45%, 32%)
Oklch
oklch(53.0% 0.145 5.9)

TraditionalDark Violet」· PaintCamellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEDED7
D8D8DF

Analogous

DFDBD8
DEDED7
DBDFD8

Triadic

DEDED7
D8DFDF
DFD8DF

Split-Comp.

DEDED7
D8DBDF
DBD8DF

Tetradic

DEDED7
D8DFDB
D8D8DF
DFD8DB

Contrast Matrix WCAG 2.1 Contrast

DEDED7
C1C4A5
D78124
D45B69
AD405F
1.3
Fail
2.2
Fail
2.8
Fail
4.2
AA Large
1.3
Fail
1.7
Fail
2.1
Fail
3.2
AA Large
2.2
Fail
1.7
Fail
1.3
Fail
1.9
Fail
2.8
Fail
2.1
Fail
1.3
Fail
1.5
Fail
4.2
AA Large
3.2
AA Large
1.9
Fail
1.5
Fail
White BG
1.4Fail
1.8Fail
3.0Fail
3.8AA Large
5.7AA
Black BG
15.5AAA
11.7AAA
7.1AAA
5.5AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDED9
C2C2AD
B2B13B
A09F66
7E7D57

Deuteranopia

DEDED9
C2C2AE
B7BD40
A7B065
848C56

Tritanopia

DEDADA
C1B2B4
D34C50
CE6362
A85250

Achromatopsia

DDDDDD
C0C0C0
909090
818181
646464

Shades & Tints Shades & Tints

#DEDED7

Dark
Light

#C1C4A5

Dark
Light

#D78124

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #deded7;
  --color-2: #c1c4a5;
  --color-3: #d78124;
  --color-4: #d45b69;
  --color-5: #ad405f;
}

SCSS

$color-1: #deded7;
$color-2: #c1c4a5;
$color-3: #d78124;
$color-4: #d45b69;
$color-5: #ad405f;

TAILWIND

colors: {
  'brand-1': '#deded7',
  'brand-2': '#c1c4a5',
  'brand-3': '#d78124',
  'brand-4': '#d45b69',
  'brand-5': '#ad405f',
}

RGB Array

[222, 222, 215], [193, 196, 165], [215, 129, 36], [212, 91, 105], [173, 64, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEDED7, #C1C4A5, #D78124, #D45B69, #AD405F 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: #deded7; --color-2: #c1c4a5; --color-3: #d78124; --color-4: #d45b69; --color-5: #ad405f. 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