← Back to Editor

#D8E3D0 · #DAD782 · #FBA35D · #F21586 · #7B6372

spring

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#D8E3D0

Celadon · LightGray · Mint Green

HEX
#D8E3D0
RGB
rgb(216, 227, 208)
HSL
hsl(95, 25%, 85%)
HSB
hsb(95, 8%, 89%)
CMYK
cmyk(5%, 0%, 8%, 11%)
Oklch
oklch(90.2% 0.028 131.8)

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

#DAD782

Fresh Green · Khaki · Sunflower

HEX
#DAD782
RGB
rgb(218, 215, 130)
HSL
hsl(58, 54%, 68%)
HSB
hsb(58, 40%, 85%)
CMYK
cmyk(0%, 1%, 40%, 15%)
Oklch
oklch(86.3% 0.107 106.7)

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

#FBA35D

Apricot · SandyBrown · Warm Sun

HEX
#FBA35D
RGB
rgb(251, 163, 93)
HSL
hsl(27, 95%, 67%)
HSB
hsb(27, 63%, 98%)
CMYK
cmyk(0%, 35%, 63%, 2%)
Oklch
oklch(79.0% 0.135 57.6)

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

#F21586

Rose Purple · DeepPink · Rose Pink

HEX
#F21586
RGB
rgb(242, 21, 134)
HSL
hsl(329, 89%, 52%)
HSB
hsb(329, 91%, 95%)
CMYK
cmyk(0%, 91%, 45%, 5%)
Oklch
oklch(62.9% 0.248 358.7)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#7B6372

Rose Purple · DimGray · Camellia

HEX
#7B6372
RGB
rgb(123, 99, 114)
HSL
hsl(323, 11%, 44%)
HSB
hsb(323, 20%, 48%)
CMYK
cmyk(0%, 20%, 7%, 52%)
Oklch
oklch(52.8% 0.038 340.6)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E3D0
DACFE2

Analogous

E1E2CF
D8E3D0
CFE2D1

Triadic

D8E3D0
CFD7E2
E2CFD7

Split-Comp.

D8E3D0
D1CFE2
E2CFE1

Tetradic

D8E3D0
CFE1E2
DACFE2
E2D1CF

Contrast Matrix WCAG 2.1 Contrast

D8E3D0
DAD782
FBA35D
F21586
7B6372
—
1.1
Fail
1.5
Fail
3.0
AA Large
4.1
AA Large
1.1
Fail
—
1.3
Fail
2.7
Fail
3.6
AA Large
1.5
Fail
1.3
Fail
—
2.0
Fail
2.7
Fail
3.0
AA Large
2.7
Fail
2.0
Fail
—
1.4
Fail
4.1
AA Large
3.6
AA Large
2.7
Fail
1.4
Fail
—
White BG
1.3Fail
1.5Fail
2.0Fail
4.0AA Large
5.4AA
Black BG
15.8AAA
14.0AAA
10.5AAA
5.2AA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDD5
D9D997
D5D46E
92906B
71706E

Deuteranopia

DCDBD6
D9D99C
DAE172
9FB064
72746E

Tritanopia

D9D8D9
DAA7AA
F77B7E
E75550
7A6C6B

Achromatopsia

DEDEDE
CECECE
B5B5B5
646464
6C6C6C

Shades & Tints Shades & Tints

#D8E3D0

Dark
Light

#DAD782

Dark
Light

#FBA35D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e3d0;
  --color-2: #dad782;
  --color-3: #fba35d;
  --color-4: #f21586;
  --color-5: #7b6372;
}

SCSS

$color-1: #d8e3d0;
$color-2: #dad782;
$color-3: #fba35d;
$color-4: #f21586;
$color-5: #7b6372;

TAILWIND

colors: {
  'brand-1': '#d8e3d0',
  'brand-2': '#dad782',
  'brand-3': '#fba35d',
  'brand-4': '#f21586',
  'brand-5': '#7b6372',
}

RGB Array

[216, 227, 208], [218, 215, 130], [251, 163, 93], [242, 21, 134], [123, 99, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #D8E3D0, #DAD782, #FBA35D, #F21586, #7B6372 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: #d8e3d0; --color-2: #dad782; --color-3: #fba35d; --color-4: #f21586; --color-5: #7b6372. 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 spring-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