← Back to Editor

#7E786C · #ACC1B2 · #D3D8C1 · #FFDBC1 · #FFC0B0

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#7E786C

Ochre · Gray · Warm Gray

HEX
#7E786C
RGB
rgb(126, 120, 108)
HSL
hsl(40, 8%, 46%)
HSB
hsb(40, 14%, 49%)
CMYK
cmyk(0%, 5%, 14%, 51%)
Oklch
oklch(57.4% 0.019 84.6)

Traditional「Ochre」· Paint「Warm Gray」· Creative Urban Concrete

#ACC1B2

Celadon · Silver · Apple Green

HEX
#ACC1B2
RGB
rgb(172, 193, 178)
HSL
hsl(137, 14%, 72%)
HSB
hsb(137, 11%, 76%)
CMYK
cmyk(11%, 0%, 8%, 24%)
Oklch
oklch(79.1% 0.031 154.5)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D3D8C1

Willow Green · LightGray · Apple Green

HEX
#D3D8C1
RGB
rgb(211, 216, 193)
HSL
hsl(73, 23%, 80%)
HSB
hsb(73, 11%, 85%)
CMYK
cmyk(2%, 0%, 11%, 15%)
Oklch
oklch(87.2% 0.031 117.0)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#FFDBC1

Apricot · Bisque · Peach Orange

HEX
#FFDBC1
RGB
rgb(255, 219, 193)
HSL
hsl(25, 100%, 88%)
HSB
hsb(25, 24%, 100%)
CMYK
cmyk(0%, 14%, 24%, 0%)
Oklch
oklch(91.5% 0.053 57.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FFC0B0

Peach Pink · LightPink · Cherry Blossom

HEX
#FFC0B0
RGB
rgb(255, 192, 176)
HSL
hsl(12, 100%, 85%)
HSB
hsb(12, 31%, 100%)
CMYK
cmyk(0%, 25%, 31%, 0%)
Oklch
oklch(86.1% 0.076 34.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7E786C
6C727F

Analogous

7F6F6C
7E786C
7C7F6C

Triadic

7E786C
6C7F78
786C7F

Split-Comp.

7E786C
6C7C7F
6F6C7F

Tetradic

7E786C
6C7F6F
6C727F
7F6C7C

Contrast Matrix WCAG 2.1 Contrast

7E786C
ACC1B2
D3D8C1
FFDBC1
FFC0B0
—
2.3
Fail
3.0
Fail
3.4
AA Large
2.8
Fail
2.3
Fail
—
1.3
Fail
1.5
Fail
1.2
Fail
3.0
Fail
1.3
Fail
—
1.1
Fail
1.1
Fail
3.4
AA Large
1.5
Fail
1.1
Fail
—
1.2
Fail
2.8
Fail
1.2
Fail
1.1
Fail
1.2
Fail
—
White BG
4.4AA Large
1.9Fail
1.5Fail
1.3Fail
1.6Fail
Black BG
4.8AA
11.0AAA
14.4AAA
16.2AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B6F
B5B5B6
D5D5C7
EFEFC7
E4E3B4

Deuteranopia

7C7C70
B4B2B7
D5D5C8
F2F4C9
E7ECB5

Tritanopia

7E7172
ADB8B9
D3CBCC
FDCCCD
FCB7B8

Achromatopsia

787878
B9B9B9
D4D4D4
E3E3E3
D1D1D1

Shades & Tints Shades & Tints

#7E786C

Dark
Light

#ACC1B2

Dark
Light

#D3D8C1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7e786c;
  --color-2: #acc1b2;
  --color-3: #d3d8c1;
  --color-4: #ffdbc1;
  --color-5: #ffc0b0;
}

SCSS

$color-1: #7e786c;
$color-2: #acc1b2;
$color-3: #d3d8c1;
$color-4: #ffdbc1;
$color-5: #ffc0b0;

TAILWIND

colors: {
  'brand-1': '#7e786c',
  'brand-2': '#acc1b2',
  'brand-3': '#d3d8c1',
  'brand-4': '#ffdbc1',
  'brand-5': '#ffc0b0',
}

RGB Array

[126, 120, 108], [172, 193, 178], [211, 216, 193], [255, 219, 193], [255, 192, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7E786C, #ACC1B2, #D3D8C1, #FFDBC1, #FFC0B0 is ideal for: health products, baby brands, fresh-style blogs, 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: #7e786c; --color-2: #acc1b2; --color-3: #d3d8c1; --color-4: #ffdbc1; --color-5: #ffc0b0. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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