← Back to Editor

#DDD1B7 · #B8CDAB · #AAB0A0 · #988994 · #787090

spring

A 5-color spring 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

#DDD1B7

Goose Yellow · Wheat · Lemon Cream

HEX
#DDD1B7
RGB
rgb(221, 209, 183)
HSL
hsl(41, 36%, 79%)
HSB
hsb(41, 17%, 87%)
CMYK
cmyk(0%, 5%, 17%, 13%)
Oklch
oklch(86.4% 0.037 86.2)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#B8CDAB

Celadon · Silver · Apple Green

HEX
#B8CDAB
RGB
rgb(184, 205, 171)
HSL
hsl(97, 25%, 74%)
HSB
hsb(97, 17%, 80%)
CMYK
cmyk(10%, 0%, 17%, 20%)
Oklch
oklch(82.3% 0.052 133.5)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#AAB0A0

Willow Green · DarkGray · Silver Sand

HEX
#AAB0A0
RGB
rgb(170, 176, 160)
HSL
hsl(83, 9%, 66%)
HSB
hsb(83, 9%, 69%)
CMYK
cmyk(3%, 0%, 9%, 31%)
Oklch
oklch(74.8% 0.023 123.8)

TraditionalWillow Green」· PaintSilver Sand」· Creative Urban Concrete

#988994

Ash · Gray · Silver Sand

HEX
#988994
RGB
rgb(152, 137, 148)
HSL
hsl(316, 7%, 57%)
HSB
hsb(316, 10%, 60%)
CMYK
cmyk(0%, 10%, 3%, 40%)
Oklch
oklch(64.7% 0.024 335.2)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#787090

Deep Indigo · SlateGray · Navy Blue

HEX
#787090
RGB
rgb(120, 112, 144)
HSL
hsl(255, 13%, 50%)
HSB
hsb(255, 22%, 56%)
CMYK
cmyk(17%, 22%, 0%, 44%)
Oklch
oklch(56.4% 0.050 296.2)

TraditionalDeep Indigo」· PaintNavy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDD1B7
B6C2DD

Analogous

DDBDB6
DDD1B7
D6DDB6

Triadic

DDD1B7
B6DDD1
D1B6DD

Split-Comp.

DDD1B7
B6D6DD
BDB6DD

Tetradic

DDD1B7
B6DDBD
B6C2DD
DDB6D6

Contrast Matrix WCAG 2.1 Contrast

DDD1B7
B8CDAB
AAB0A0
988994
787090
1.1
Fail
1.5
Fail
2.2
Fail
3.1
AA Large
1.1
Fail
1.3
Fail
1.9
Fail
2.7
Fail
1.5
Fail
1.3
Fail
1.5
Fail
2.1
Fail
2.2
Fail
1.9
Fail
1.5
Fail
1.4
Fail
3.1
AA Large
2.7
Fail
2.1
Fail
1.4
Fail
White BG
1.5Fail
1.7Fail
2.2Fail
3.3AA Large
4.6AA
Black BG
13.9AAA
12.4AAA
9.4AAA
6.3AA
4.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D8BD
C1C1B3
ADADA4
929191
757488

Deuteranopia

D9D9BF
C0BEB5
ACACA5
929491
757686

Tritanopia

DCC2C3
B9BABB
AAA7A8
978F8F
788281

Achromatopsia

D2D2D2
C3C3C3
ACACAC
8F8F8F
767676

Shades & Tints Shades & Tints

#DDD1B7

Dark
Light

#B8CDAB

Dark
Light

#AAB0A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ddd1b7;
  --color-2: #b8cdab;
  --color-3: #aab0a0;
  --color-4: #988994;
  --color-5: #787090;
}

SCSS

$color-1: #ddd1b7;
$color-2: #b8cdab;
$color-3: #aab0a0;
$color-4: #988994;
$color-5: #787090;

TAILWIND

colors: {
  'brand-1': '#ddd1b7',
  'brand-2': '#b8cdab',
  'brand-3': '#aab0a0',
  'brand-4': '#988994',
  'brand-5': '#787090',
}

RGB Array

[221, 209, 183], [184, 205, 171], [170, 176, 160], [152, 137, 148], [120, 112, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #DDD1B7, #B8CDAB, #AAB0A0, #988994, #787090 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: #ddd1b7; --color-2: #b8cdab; --color-3: #aab0a0; --color-4: #988994; --color-5: #787090. 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 spring-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