← Back to Editor

#8FADB5 · #707686 · #E6ECE8 · #C9AA95 · #F7E6CC

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#8FADB5

Sky Blue · DarkGray · Lake Green

HEX
#8FADB5
RGB
rgb(143, 173, 181)
HSL
hsl(193, 20%, 64%)
HSB
hsb(193, 21%, 71%)
CMYK
cmyk(21%, 4%, 0%, 29%)
Oklch
oklch(72.8% 0.035 215.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#707686

Indigo · SlateGray · Warm Gray

HEX
#707686
RGB
rgb(112, 118, 134)
HSL
hsl(224, 9%, 48%)
HSB
hsb(224, 16%, 53%)
CMYK
cmyk(16%, 12%, 0%, 47%)
Oklch
oklch(56.6% 0.026 269.2)

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

#E6ECE8

Celadon · Lavender · Mint Green

HEX
#E6ECE8
RGB
rgb(230, 236, 232)
HSL
hsl(140, 14%, 91%)
HSB
hsb(140, 3%, 93%)
CMYK
cmyk(3%, 0%, 2%, 7%)
Oklch
oklch(93.7% 0.008 157.1)

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

#C9AA95

Apricot · Tan · Warm Sun

HEX
#C9AA95
RGB
rgb(201, 170, 149)
HSL
hsl(24, 32%, 69%)
HSB
hsb(24, 26%, 79%)
CMYK
cmyk(0%, 15%, 26%, 21%)
Oklch
oklch(76.0% 0.047 56.0)

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

#F7E6CC

Goose Yellow · Bisque · Peach Orange

HEX
#F7E6CC
RGB
rgb(247, 230, 204)
HSL
hsl(36, 73%, 88%)
HSB
hsb(36, 17%, 97%)
CMYK
cmyk(0%, 7%, 17%, 3%)
Oklch
oklch(93.2% 0.039 78.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8FADB5
B69991

Analogous

91B6AB
8FADB5
919BB6

Triadic

8FADB5
B691AE
AEB691

Split-Comp.

8FADB5
B6919B
B6AB91

Tetradic

8FADB5
AB91B6
B69991
9BB691

Contrast Matrix WCAG 2.1 Contrast

8FADB5
707686
E6ECE8
C9AA95
F7E6CC
—
1.9
Fail
2.0
Fail
1.1
Fail
1.9
Fail
1.9
Fail
—
3.8
AA Large
2.1
Fail
3.7
AA Large
2.0
Fail
3.8
AA Large
—
1.8
Fail
1.0
Fail
1.1
Fail
2.1
Fail
1.8
Fail
—
1.8
Fail
1.9
Fail
3.7
AA Large
1.0
Fail
1.8
Fail
—
White BG
2.4Fail
4.5AA
1.2Fail
2.2Fail
1.2Fail
Black BG
8.8AAA
4.6AA
17.5AAA
9.7AAA
17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9C9CB3
737382
E9E9E9
BCBB9A
F0EFD2

Deuteranopia

9A98B3
727281
E8E8E9
BDC09B
F1F2D4

Tritanopia

91B2B1
707F7E
E6EAEA
C79E9F
F6D7D8

Achromatopsia

A5A5A5
767676
EAEAEA
B1B1B1
E8E8E8

Shades & Tints Shades & Tints

#8FADB5

Dark
Light

#707686

Dark
Light

#E6ECE8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8fadb5;
  --color-2: #707686;
  --color-3: #e6ece8;
  --color-4: #c9aa95;
  --color-5: #f7e6cc;
}

SCSS

$color-1: #8fadb5;
$color-2: #707686;
$color-3: #e6ece8;
$color-4: #c9aa95;
$color-5: #f7e6cc;

TAILWIND

colors: {
  'brand-1': '#8fadb5',
  'brand-2': '#707686',
  'brand-3': '#e6ece8',
  'brand-4': '#c9aa95',
  'brand-5': '#f7e6cc',
}

RGB Array

[143, 173, 181], [112, 118, 134], [230, 236, 232], [201, 170, 149], [247, 230, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8FADB5, #707686, #E6ECE8, #C9AA95, #F7E6CC is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #8fadb5; --color-2: #707686; --color-3: #e6ece8; --color-4: #c9aa95; --color-5: #f7e6cc. 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 beauty, lifestyle, arts 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