#6A908C + #C696A5 + #F0AAA2 + #F0C7A9 + #DDE2D5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#6A908C

Mineral Blue · SlateGray · Mint Ice

HEX

#6A908C

RGB

rgb(106, 144, 140)

HSL

hsl(174, 15%, 49%)

HSB

hsb(174, 26%, 56%)

CMYK

cmyk(26%, 0%, 3%, 44%)

Oklch

oklch(62.4% 0.043 188.1)

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

#C696A5

Rouge · DarkGray · Rose Pink

HEX

#C696A5

RGB

rgb(198, 150, 165)

HSL

hsl(341, 30%, 68%)

HSB

hsb(341, 24%, 78%)

CMYK

cmyk(0%, 24%, 17%, 22%)

Oklch

oklch(72.3% 0.061 358.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#F0AAA2

Peach Pink · BurlyWood · Coral Red

HEX

#F0AAA2

RGB

rgb(240, 170, 162)

HSL

hsl(6, 72%, 79%)

HSB

hsb(6, 33%, 94%)

CMYK

cmyk(0%, 29%, 33%, 6%)

Oklch

oklch(80.2% 0.084 26.4)

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

#F0C7A9

Apricot · Wheat · Peach Orange

HEX

#F0C7A9

RGB

rgb(240, 199, 169)

HSL

hsl(25, 70%, 80%)

HSB

hsb(25, 30%, 94%)

CMYK

cmyk(0%, 17%, 30%, 6%)

Oklch

oklch(85.8% 0.062 58.0)

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

#DDE2D5

Willow Green · LightGray · Mint Green

HEX

#DDE2D5

RGB

rgb(221, 226, 213)

HSL

hsl(83, 18%, 86%)

HSB

hsb(83, 6%, 89%)

CMYK

cmyk(2%, 0%, 6%, 11%)

Oklch

oklch(90.5% 0.018 124.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6A908C

906A6E

Analogous

6A9079

6A908C

6A8190

Triadic

6A908C

8C6A90

908C6A

Split-Comp.

6A908C

906A81

90796A

Tetradic

6A908C

796A90

906A6E

81906A

Contrast Matrix WCAG 2.1 Contrast

6A908C	C696A5	F0AAA2	F0C7A9	DDE2D5
—	1.4 Fail	1.8 Fail	2.2 Fail	2.7 Fail
1.4 Fail	—	1.3 Fail	1.6 Fail	1.9 Fail
1.8 Fail	1.3 Fail	—	1.2 Fail	1.4 Fail
2.2 Fail	1.6 Fail	1.2 Fail	—	1.2 Fail
2.7 Fail	1.9 Fail	1.4 Fail	1.2 Fail	—

White BG

3.5AA Large

2.5Fail

1.9Fail

1.6Fail

1.3Fail

Black BG

6.0AA

8.3AAA

11.0AAA

13.4AAA

15.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7A7B8D

B1B1A1

D2D1A4

DEDEB0

DFDFD8

Deuteranopia

78758D

B4B8A1

D6DBA4

E1E4B2

DFDFD9

Tritanopia

6C8E8E

C49F9E

EDA5A6

EEB6B7

DDDBDB

Achromatopsia

848484

A6A6A6

BEBEBE

D0D0D0

DFDFDF

Shades & Tints Shades & Tints

#6A908C

Dark

Light

#C696A5

Dark

Light

#F0AAA2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6a908c;
  --color-2: #c696a5;
  --color-3: #f0aaa2;
  --color-4: #f0c7a9;
  --color-5: #dde2d5;
}

SCSS

$color-1: #6a908c;
$color-2: #c696a5;
$color-3: #f0aaa2;
$color-4: #f0c7a9;
$color-5: #dde2d5;

TAILWIND

colors: {
  'brand-1': '#6a908c',
  'brand-2': '#c696a5',
  'brand-3': '#f0aaa2',
  'brand-4': '#f0c7a9',
  'brand-5': '#dde2d5',
}

RGB Array

[106, 144, 140], [198, 150, 165], [240, 170, 162], [240, 199, 169], [221, 226, 213]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6A908C, #C696A5, #F0AAA2, #F0C7A9, #DDE2D5 is ideal for: health products, baby brands, fresh-style blogs. 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: #6a908c; --color-2: #c696a5; --color-3: #f0aaa2; --color-4: #f0c7a9; --color-5: #dde2d5. 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. 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