← Back to Editor

#899D95 · #F2F2E6 · #C3BEAD · #D2D4BF · #99A191

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

WorkspaceReading

Color Details Color Details

#899D95

Mineral Blue · LightSlateGray · Silver Sand

HEX
#899D95
RGB
rgb(137, 157, 149)
HSL
hsl(156, 9%, 58%)
HSB
hsb(156, 13%, 62%)
CMYK
cmyk(13%, 0%, 5%, 38%)
Oklch
oklch(67.8% 0.025 169.5)

TraditionalMineral Blue」· PaintSilver Sand」· Creative Urban Concrete

#F2F2E6

Fresh Green · Linen · Lemon Cream

HEX
#F2F2E6
RGB
rgb(242, 242, 230)
HSL
hsl(60, 32%, 93%)
HSB
hsb(60, 5%, 95%)
CMYK
cmyk(0%, 0%, 5%, 5%)
Oklch
oklch(95.8% 0.016 106.7)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#C3BEAD

Goose Yellow · Silver · Sunflower

HEX
#C3BEAD
RGB
rgb(195, 190, 173)
HSL
hsl(46, 15%, 72%)
HSB
hsb(46, 11%, 76%)
CMYK
cmyk(0%, 3%, 11%, 24%)
Oklch
oklch(80.1% 0.024 93.4)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

#D2D4BF

Fresh Green · LightGray · Lemon Cream

HEX
#D2D4BF
RGB
rgb(210, 212, 191)
HSL
hsl(66, 20%, 79%)
HSB
hsb(66, 10%, 83%)
CMYK
cmyk(1%, 0%, 10%, 17%)
Oklch
oklch(86.3% 0.028 111.4)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#99A191

Celadon · DarkSeaGreen · Silver Sand

HEX
#99A191
RGB
rgb(153, 161, 145)
HSL
hsl(90, 8%, 60%)
HSB
hsb(90, 10%, 63%)
CMYK
cmyk(5%, 0%, 10%, 37%)
Oklch
oklch(69.8% 0.025 128.9)

TraditionalCeladon」· PaintSilver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

899D95
9E8A92

Analogous

8A9E8C
899D95
8A9C9E

Triadic

899D95
968A9E
9E968A

Split-Comp.

899D95
9E8A9C
9E8C8A

Tetradic

899D95
8C8A9E
9E8A92
9C9E8A

Contrast Matrix WCAG 2.1 Contrast

899D95
F2F2E6
C3BEAD
D2D4BF
99A191
2.5
Fail
1.5
Fail
1.9
Fail
1.1
Fail
2.5
Fail
1.6
Fail
1.3
Fail
2.4
Fail
1.5
Fail
1.6
Fail
1.2
Fail
1.4
Fail
1.9
Fail
1.3
Fail
1.2
Fail
1.8
Fail
1.1
Fail
2.4
Fail
1.4
Fail
1.8
Fail
White BG
2.9Fail
1.1Fail
1.9Fail
1.5Fail
2.7Fail
Black BG
7.3AAA
18.6AAA
11.3AAA
13.9AAA
7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

929297
F2F2E9
C1C1B1
D3D3C4
9C9D95

Deuteranopia

918F97
F2F2EA
C1C2B2
D3D3C5
9C9B96

Tritanopia

8A9899
F2EBEC
C3B4B5
D2C8C9
999899

Achromatopsia

969696
F1F1F1
BEBEBE
D1D1D1
9D9D9D

Shades & Tints Shades & Tints

#899D95

Dark
Light

#F2F2E6

Dark
Light

#C3BEAD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #899d95;
  --color-2: #f2f2e6;
  --color-3: #c3bead;
  --color-4: #d2d4bf;
  --color-5: #99a191;
}

SCSS

$color-1: #899d95;
$color-2: #f2f2e6;
$color-3: #c3bead;
$color-4: #d2d4bf;
$color-5: #99a191;

TAILWIND

colors: {
  'brand-1': '#899d95',
  'brand-2': '#f2f2e6',
  'brand-3': '#c3bead',
  'brand-4': '#d2d4bf',
  'brand-5': '#99a191',
}

RGB Array

[137, 157, 149], [242, 242, 230], [195, 190, 173], [210, 212, 191], [153, 161, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #899D95, #F2F2E6, #C3BEAD, #D2D4BF, #99A191 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #899d95; --color-2: #f2f2e6; --color-3: #c3bead; --color-4: #d2d4bf; --color-5: #99a191. 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 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