← Back to Editor

#FF824D · #9BEEEA · #FEF48B · #F6F6F6 · #515760

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

WorkspaceReadingData Visualization

Color Details Color Details

#FF824D

Apricot · Coral · Warm Sun

HEX
#FF824D
RGB
rgb(255, 130, 77)
HSL
hsl(18, 100%, 65%)
HSB
hsb(18, 70%, 100%)
CMYK
cmyk(0%, 49%, 70%, 0%)
Oklch
oklch(73.9% 0.167 42.5)

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

#9BEEEA

Jade · LightBlue · Glacier Blue

HEX
#9BEEEA
RGB
rgb(155, 238, 234)
HSL
hsl(177, 71%, 77%)
HSB
hsb(177, 35%, 93%)
CMYK
cmyk(35%, 0%, 2%, 7%)
Oklch
oklch(89.5% 0.081 191.9)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#FEF48B

Fresh Green · Khaki · Lemon Cream

HEX
#FEF48B
RGB
rgb(254, 244, 139)
HSL
hsl(55, 98%, 77%)
HSB
hsb(55, 45%, 100%)
CMYK
cmyk(0%, 4%, 45%, 0%)
Oklch
oklch(95.3% 0.127 103.7)

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

#F6F6F6

Moonlight White · Snow · Cloud White

HEX
#F6F6F6
RGB
rgb(246, 246, 246)
HSL
hsl(0, 0%, 96%)
HSB
hsb(0, 0%, 96%)
CMYK
cmyk(0%, 0%, 0%, 4%)
Oklch
oklch(97.3% 0.000 89.9)

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

#515760

Indigo · DimGray · Charcoal

HEX
#515760
RGB
rgb(81, 87, 96)
HSL
hsl(216, 8%, 35%)
HSB
hsb(216, 16%, 38%)
CMYK
cmyk(16%, 9%, 0%, 62%)
Oklch
oklch(45.5% 0.017 258.4)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF824D
4DC9FF

Analogous

FF4D70
FF824D
FFDB4D

Triadic

FF824D
4DFF82
824DFF

Split-Comp.

FF824D
4DFFDB
4D70FF

Tetradic

FF824D
70FF4D
4DC9FF
DB4DFF

Contrast Matrix WCAG 2.1 Contrast

FF824D
9BEEEA
FEF48B
F6F6F6
515760
—
1.8
Fail
2.2
Fail
2.3
Fail
3.0
Fail
1.8
Fail
—
1.2
Fail
1.2
Fail
5.5
AA
2.2
Fail
1.2
Fail
—
1.0
Fail
6.4
AA
2.3
Fail
1.2
Fail
1.0
Fail
—
6.7
AA
3.0
Fail
5.5
AA
6.4
AA
6.7
AA
—
White BG
2.5Fail
1.3Fail
1.1Fail
1.1Fail
7.3AAA
Black BG
8.6AAA
15.8AAA
18.5AAA
19.4AAA
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C85A
BFC0EB
FAFAA4
F6F6F6
54545E

Deuteranopia

D0DA5D
BAB4EB
FAFBAB
F6F6F6
53535D

Tritanopia

F96466
9FECEC
FDB8BD
F6F6F6
515C5C

Achromatopsia

A1A1A1
D5D5D5
EBEBEB
F6F6F6
565656

Shades & Tints Shades & Tints

#FF824D

Dark
Light

#9BEEEA

Dark
Light

#FEF48B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff824d;
  --color-2: #9beeea;
  --color-3: #fef48b;
  --color-4: #f6f6f6;
  --color-5: #515760;
}

SCSS

$color-1: #ff824d;
$color-2: #9beeea;
$color-3: #fef48b;
$color-4: #f6f6f6;
$color-5: #515760;

TAILWIND

colors: {
  'brand-1': '#ff824d',
  'brand-2': '#9beeea',
  'brand-3': '#fef48b',
  'brand-4': '#f6f6f6',
  'brand-5': '#515760',
}

RGB Array

[255, 130, 77], [155, 238, 234], [254, 244, 139], [246, 246, 246], [81, 87, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #FF824D, #9BEEEA, #FEF48B, #F6F6F6, #515760 is ideal for: health products, baby brands, fresh-style blogs, 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: #ff824d; --color-2: #9beeea; --color-3: #fef48b; --color-4: #f6f6f6; --color-5: #515760. 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 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