← Back to Editor

#FCF5D8 · #BEEBD4 · #98D8C7 · #27A9A7 · #2D3E45

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FCF5D8

Goose Yellow · Beige · Lemon Cream

HEX
#FCF5D8
RGB
rgb(252, 245, 216)
HSL
hsl(48, 86%, 92%)
HSB
hsb(48, 14%, 99%)
CMYK
cmyk(0%, 3%, 14%, 1%)
Oklch
oklch(96.8% 0.039 95.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#BEEBD4

Emerald · LightBlue · Mint Green

HEX
#BEEBD4
RGB
rgb(190, 235, 212)
HSL
hsl(149, 53%, 83%)
HSB
hsb(149, 19%, 92%)
CMYK
cmyk(19%, 0%, 10%, 8%)
Oklch
oklch(90.2% 0.056 162.8)

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

#98D8C7

Jade · LightBlue · Lake Green

HEX
#98D8C7
RGB
rgb(152, 216, 199)
HSL
hsl(164, 45%, 72%)
HSB
hsb(164, 30%, 85%)
CMYK
cmyk(30%, 0%, 8%, 15%)
Oklch
oklch(83.4% 0.069 176.2)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#27A9A7

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#27A9A7
RGB
rgb(39, 169, 167)
HSL
hsl(179, 63%, 41%)
HSB
hsb(179, 77%, 66%)
CMYK
cmyk(77%, 0%, 1%, 34%)
Oklch
oklch(66.9% 0.106 193.3)

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

#2D3E45

Slate Blue · DarkSlateGray · Peacock Green

HEX
#2D3E45
RGB
rgb(45, 62, 69)
HSL
hsl(197, 21%, 22%)
HSB
hsb(197, 35%, 27%)
CMYK
cmyk(35%, 10%, 0%, 73%)
Oklch
oklch(35.2% 0.025 225.2)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCF5D8
D9E0FC

Analogous

FCE4D9
FCF5D8
F2FCD9

Triadic

FCF5D8
D9FCF5
F5D9FC

Split-Comp.

FCF5D8
D9F2FC
E4D9FC

Tetradic

FCF5D8
D9FCE4
D9E0FC
FCD9F2

Contrast Matrix WCAG 2.1 Contrast

FCF5D8
BEEBD4
98D8C7
27A9A7
2D3E45
—
1.2
Fail
1.5
Fail
2.6
Fail
10.2
AAA
1.2
Fail
—
1.2
Fail
2.2
Fail
8.5
AAA
1.5
Fail
1.2
Fail
—
1.8
Fail
6.9
AA
2.6
Fail
2.2
Fail
1.8
Fail
—
3.9
AA Large
10.2
AAA
8.5
AAA
6.9
AA
3.9
AA Large
—
White BG
1.1Fail
1.3Fail
1.6Fail
2.9Fail
11.1AAA
Black BG
19.2AAA
16.0AAA
13.0AAA
7.3AAA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F9F9DF
D1D2DA
B4B4CB
5F60A7
343543

Deuteranopia

F9FAE1
CFCCDB
B0ABCC
584EA8
333243

Tritanopia

FCE5E6
C0DEDF
9BCECF
2EA8A8
2E4242

Achromatopsia

F4F4F4
DBDBDB
C3C3C3
828282
3A3A3A

Shades & Tints Shades & Tints

#FCF5D8

Dark
Light

#BEEBD4

Dark
Light

#98D8C7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcf5d8;
  --color-2: #beebd4;
  --color-3: #98d8c7;
  --color-4: #27a9a7;
  --color-5: #2d3e45;
}

SCSS

$color-1: #fcf5d8;
$color-2: #beebd4;
$color-3: #98d8c7;
$color-4: #27a9a7;
$color-5: #2d3e45;

TAILWIND

colors: {
  'brand-1': '#fcf5d8',
  'brand-2': '#beebd4',
  'brand-3': '#98d8c7',
  'brand-4': '#27a9a7',
  'brand-5': '#2d3e45',
}

RGB Array

[252, 245, 216], [190, 235, 212], [152, 216, 199], [39, 169, 167], [45, 62, 69]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCF5D8, #BEEBD4, #98D8C7, #27A9A7, #2D3E45 is ideal for: 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: #fcf5d8; --color-2: #beebd4; --color-3: #98d8c7; --color-4: #27a9a7; --color-5: #2d3e45. 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. 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