← Back to Editor

#FBECB1 · #B7CBA8 · #F2BE0A · #D53734 · #566B66

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

#FBECB1

Goose Yellow · Wheat · Lemon Cream

HEX
#FBECB1
RGB
rgb(251, 236, 177)
HSL
hsl(48, 90%, 84%)
HSB
hsb(48, 29%, 98%)
CMYK
cmyk(0%, 6%, 29%, 2%)
Oklch
oklch(94.1% 0.077 95.5)

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

#B7CBA8

Celadon · Silver · Apple Green

HEX
#B7CBA8
RGB
rgb(183, 203, 168)
HSL
hsl(94, 25%, 73%)
HSB
hsb(94, 17%, 80%)
CMYK
cmyk(10%, 0%, 17%, 20%)
Oklch
oklch(81.8% 0.053 131.8)

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

#F2BE0A

Ochre · Orange · Honey Gold

HEX
#F2BE0A
RGB
rgb(242, 190, 10)
HSL
hsl(47, 92%, 49%)
HSB
hsb(47, 96%, 95%)
CMYK
cmyk(0%, 21%, 96%, 5%)
Oklch
oklch(82.5% 0.167 88.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#D53734

Vermilion · Crimson · Passion Red

HEX
#D53734
RGB
rgb(213, 55, 52)
HSL
hsl(1, 66%, 52%)
HSB
hsb(1, 76%, 84%)
CMYK
cmyk(0%, 74%, 76%, 16%)
Oklch
oklch(57.9% 0.195 26.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#566B66

Mineral Blue · DimGray · Mint Ice

HEX
#566B66
RGB
rgb(86, 107, 102)
HSL
hsl(166, 11%, 38%)
HSB
hsb(166, 20%, 42%)
CMYK
cmyk(20%, 0%, 5%, 58%)
Oklch
oklch(50.9% 0.026 179.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBECB1
B1C0FB

Analogous

FBC8B1
FBECB1
E5FBB1

Triadic

FBECB1
B1FBEC
ECB1FB

Split-Comp.

FBECB1
B1E5FB
C8B1FB

Tetradic

FBECB1
B1FBC8
B1C0FB
FBB1E5

Contrast Matrix WCAG 2.1 Contrast

FBECB1
B7CBA8
F2BE0A
D53734
566B66
—
1.5
Fail
1.5
Fail
4.0
AA Large
4.8
AA
1.5
Fail
—
1.0
Fail
2.7
Fail
3.3
AA Large
1.5
Fail
1.0
Fail
—
2.7
Fail
3.3
AA Large
4.0
AA Large
2.7
Fail
2.7
Fail
—
1.2
Fail
4.8
AA
3.3
AA Large
3.3
AA Large
1.2
Fail
—
White BG
1.2Fail
1.7Fail
1.7Fail
4.7AA
5.7AA
Black BG
17.7AAA
12.1AAA
12.1AAA
4.4AA Large
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F4BF
C0C0B0
DBDB36
918F35
5F5F67

Deuteranopia

F5F7C3
BFBDB3
DFE240
9AA635
5E5C68

Tritanopia

FACBCD
B8B7B9
EF5860
CD3535
576868

Achromatopsia

EAEAEA
C1C1C1
B9B9B9
666666
646464

Shades & Tints Shades & Tints

#FBECB1

Dark
Light

#B7CBA8

Dark
Light

#F2BE0A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbecb1;
  --color-2: #b7cba8;
  --color-3: #f2be0a;
  --color-4: #d53734;
  --color-5: #566b66;
}

SCSS

$color-1: #fbecb1;
$color-2: #b7cba8;
$color-3: #f2be0a;
$color-4: #d53734;
$color-5: #566b66;

TAILWIND

colors: {
  'brand-1': '#fbecb1',
  'brand-2': '#b7cba8',
  'brand-3': '#f2be0a',
  'brand-4': '#d53734',
  'brand-5': '#566b66',
}

RGB Array

[251, 236, 177], [183, 203, 168], [242, 190, 10], [213, 55, 52], [86, 107, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBECB1, #B7CBA8, #F2BE0A, #D53734, #566B66 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: #fbecb1; --color-2: #b7cba8; --color-3: #f2be0a; --color-4: #d53734; --color-5: #566b66. 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