← Back to Editor

#FBFBFB · #F3F3E2 · #D6D2C5 · #BEB3AF · #968B90

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

#FBFBFB

Moonlight White · Snow · Cloud White

HEX
#FBFBFB
RGB
rgb(251, 251, 251)
HSL
hsl(0, 0%, 98%)
HSB
hsb(0, 0%, 98%)
CMYK
cmyk(0%, 0%, 0%, 2%)
Oklch
oklch(98.8% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#F3F3E2

Fresh Green · Beige · Lemon Cream

HEX
#F3F3E2
RGB
rgb(243, 243, 226)
HSL
hsl(60, 41%, 92%)
HSB
hsb(60, 7%, 95%)
CMYK
cmyk(0%, 0%, 7%, 5%)
Oklch
oklch(96.0% 0.022 106.8)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#D6D2C5

Goose Yellow · LightGray · Lemon Cream

HEX
#D6D2C5
RGB
rgb(214, 210, 197)
HSL
hsl(46, 17%, 81%)
HSB
hsb(46, 8%, 84%)
CMYK
cmyk(0%, 2%, 8%, 16%)
Oklch
oklch(86.3% 0.018 92.7)

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

#BEB3AF

Apricot · Silver · Warm Sun

HEX
#BEB3AF
RGB
rgb(190, 179, 175)
HSL
hsl(16, 10%, 72%)
HSB
hsb(16, 8%, 75%)
CMYK
cmyk(0%, 6%, 8%, 25%)
Oklch
oklch(77.5% 0.014 41.2)

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

#968B90

Ash · Gray · Silver Sand

HEX
#968B90
RGB
rgb(150, 139, 144)
HSL
hsl(333, 5%, 57%)
HSB
hsb(333, 7%, 59%)
CMYK
cmyk(0%, 7%, 4%, 41%)
Oklch
oklch(64.8% 0.015 348.2)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBFBFB
FAFAFA

Analogous

FAFAFA
FBFBFB
FAFAFA

Triadic

FBFBFB
FAFAFA
FAFAFA

Split-Comp.

FBFBFB
FAFAFA
FAFAFA

Tetradic

FBFBFB
FAFAFA
FAFAFA
FAFAFA

Contrast Matrix WCAG 2.1 Contrast

FBFBFB
F3F3E2
D6D2C5
BEB3AF
968B90
—
1.1
Fail
1.5
Fail
2.0
Fail
3.2
AA Large
1.1
Fail
—
1.3
Fail
1.8
Fail
2.9
Fail
1.5
Fail
1.3
Fail
—
1.4
Fail
2.2
Fail
2.0
Fail
1.8
Fail
1.4
Fail
—
1.6
Fail
3.2
AA Large
2.9
Fail
2.2
Fail
1.6
Fail
—
White BG
1.0Fail
1.1Fail
1.5Fail
2.0Fail
3.3AA Large
Black BG
20.3AAA
18.7AAA
13.9AAA
10.3AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBFB
F3F3E6
D4D4C8
B9B9B0
91918F

Deuteranopia

FBFBFB
F3F3E7
D5D5C9
BABBB0
92938F

Tritanopia

FBFBFB
F3E9EA
D6CBCB
BDB1B1
958E8E

Achromatopsia

FBFBFB
F1F1F1
D2D2D2
B6B6B6
8F8F8F

Shades & Tints Shades & Tints

#FBFBFB

Dark
Light

#F3F3E2

Dark
Light

#D6D2C5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbfbfb;
  --color-2: #f3f3e2;
  --color-3: #d6d2c5;
  --color-4: #beb3af;
  --color-5: #968b90;
}

SCSS

$color-1: #fbfbfb;
$color-2: #f3f3e2;
$color-3: #d6d2c5;
$color-4: #beb3af;
$color-5: #968b90;

TAILWIND

colors: {
  'brand-1': '#fbfbfb',
  'brand-2': '#f3f3e2',
  'brand-3': '#d6d2c5',
  'brand-4': '#beb3af',
  'brand-5': '#968b90',
}

RGB Array

[251, 251, 251], [243, 243, 226], [214, 210, 197], [190, 179, 175], [150, 139, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FBFBFB, #F3F3E2, #D6D2C5, #BEB3AF, #968B90 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: #fbfbfb; --color-2: #f3f3e2; --color-3: #d6d2c5; --color-4: #beb3af; --color-5: #968b90. 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