← Back to Editor

#C1ACAC · #D19B9B · #D88D82 · #E1825D · #D98022

earth

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

#C1ACAC

Peach Pink · DarkGray · Coral Red

HEX
#C1ACAC
RGB
rgb(193, 172, 172)
HSL
hsl(0, 14%, 72%)
HSB
hsb(0, 11%, 76%)
CMYK
cmyk(0%, 11%, 11%, 24%)
Oklch
oklch(76.2% 0.024 17.7)

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

#D19B9B

Peach Pink · Tan · Coral Red

HEX
#D19B9B
RGB
rgb(209, 155, 155)
HSL
hsl(0, 37%, 71%)
HSB
hsb(0, 26%, 82%)
CMYK
cmyk(0%, 26%, 26%, 18%)
Oklch
oklch(74.1% 0.065 18.7)

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

#D88D82

Peach Pink · DarkSalmon · Coral Red

HEX
#D88D82
RGB
rgb(216, 141, 130)
HSL
hsl(8, 52%, 68%)
HSB
hsb(8, 40%, 85%)
CMYK
cmyk(0%, 35%, 40%, 15%)
Oklch
oklch(71.7% 0.094 28.7)

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

#E1825D

Apricot · Salmon · Warm Sun

HEX
#E1825D
RGB
rgb(225, 130, 93)
HSL
hsl(17, 69%, 62%)
HSB
hsb(17, 59%, 88%)
CMYK
cmyk(0%, 42%, 59%, 12%)
Oklch
oklch(70.2% 0.128 41.7)

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

#D98022

Ochre · Chocolate · Amber Brown

HEX
#D98022
RGB
rgb(217, 128, 34)
HSL
hsl(31, 73%, 49%)
HSB
hsb(31, 84%, 85%)
CMYK
cmyk(0%, 41%, 84%, 15%)
Oklch
oklch(68.2% 0.148 60.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1ACAC
AEC2C2

Analogous

C2AEB8
C1ACAC
C2B8AE

Triadic

C1ACAC
AEC2AE
AEAEC2

Split-Comp.

C1ACAC
AEC2B8
AEB8C2

Tetradic

C1ACAC
B8C2AE
AEC2C2
B8AEC2

Contrast Matrix WCAG 2.1 Contrast

C1ACAC
D19B9B
D88D82
E1825D
D98022
—
1.1
Fail
1.2
Fail
1.3
Fail
1.4
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.3
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.1
Fail
—
White BG
2.2Fail
2.4Fail
2.6Fail
2.8Fail
3.0Fail
Black BG
9.8AAA
8.9AAA
8.1AAA
7.6AAA
7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B8AC
BAB99B
B8B785
B8B766
B2B239

Deuteranopia

B9BBAC
BDC19B
BCC285
BDC568
B8BE3E

Tritanopia

C0ACAC
CE9B9B
D48787
DC6D6F
D54B4F

Achromatopsia

B2B2B2
ABABAB
A2A2A2
9A9A9A
909090

Shades & Tints Shades & Tints

#C1ACAC

Dark
Light

#D19B9B

Dark
Light

#D88D82

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1acac;
  --color-2: #d19b9b;
  --color-3: #d88d82;
  --color-4: #e1825d;
  --color-5: #d98022;
}

SCSS

$color-1: #c1acac;
$color-2: #d19b9b;
$color-3: #d88d82;
$color-4: #e1825d;
$color-5: #d98022;

TAILWIND

colors: {
  'brand-1': '#c1acac',
  'brand-2': '#d19b9b',
  'brand-3': '#d88d82',
  'brand-4': '#e1825d',
  'brand-5': '#d98022',
}

RGB Array

[193, 172, 172], [209, 155, 155], [216, 141, 130], [225, 130, 93], [217, 128, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #C1ACAC, #D19B9B, #D88D82, #E1825D, #D98022 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: #c1acac; --color-2: #d19b9b; --color-3: #d88d82; --color-4: #e1825d; --color-5: #d98022. 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 earth-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