← Back to Editor

#3A2B2E · #A46846 · #FF8F58 · #D4E8B5 · #8DCB98

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

#3A2B2E

Crimson · DarkSlateGray · Deep Berry

HEX
#3A2B2E
RGB
rgb(58, 43, 46)
HSL
hsl(348, 15%, 20%)
HSB
hsb(348, 26%, 23%)
CMYK
cmyk(0%, 26%, 21%, 77%)
Oklch
oklch(30.7% 0.023 5.1)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#A46846

Tangerine · Sienna · Amber Brown

HEX
#A46846
RGB
rgb(164, 104, 70)
HSL
hsl(22, 40%, 46%)
HSB
hsb(22, 57%, 64%)
CMYK
cmyk(0%, 37%, 57%, 36%)
Oklch
oklch(57.5% 0.091 49.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#FF8F58

Apricot · Coral · Warm Sun

HEX
#FF8F58
RGB
rgb(255, 143, 88)
HSL
hsl(20, 100%, 67%)
HSB
hsb(20, 65%, 100%)
CMYK
cmyk(0%, 44%, 65%, 0%)
Oklch
oklch(76.1% 0.153 45.7)

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

#D4E8B5

Willow Green · Wheat · Mint Green

HEX
#D4E8B5
RGB
rgb(212, 232, 181)
HSL
hsl(84, 53%, 81%)
HSB
hsb(84, 22%, 91%)
CMYK
cmyk(9%, 0%, 22%, 9%)
Oklch
oklch(90.3% 0.071 125.2)

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

#8DCB98

Celadon · DarkSeaGreen · Apple Green

HEX
#8DCB98
RGB
rgb(141, 203, 152)
HSL
hsl(131, 37%, 67%)
HSB
hsb(131, 31%, 80%)
CMYK
cmyk(31%, 0%, 25%, 20%)
Oklch
oklch(78.6% 0.096 149.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A2B2E
2B3B38

Analogous

3B2B36
3A2B2E
3B302B

Triadic

3A2B2E
2E3B2B
2B2E3B

Split-Comp.

3A2B2E
2B3B30
2B363B

Tetradic

3A2B2E
363B2B
2B3B38
302B3B

Contrast Matrix WCAG 2.1 Contrast

3A2B2E
A46846
FF8F58
D4E8B5
8DCB98
—
3.0
Fail
6.0
AA
10.2
AAA
7.1
AAA
3.0
Fail
—
2.0
Fail
3.4
AA Large
2.4
Fail
6.0
AA
2.0
Fail
—
1.7
Fail
1.2
Fail
10.2
AAA
3.4
AA Large
1.7
Fail
—
1.4
Fail
7.1
AAA
2.4
Fail
1.2
Fail
1.4
Fail
—
White BG
13.4AAA
4.5AA
2.3Fail
1.3Fail
1.9Fail
Black BG
1.6Fail
4.6AA
9.3AAA
16.0AAA
11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

34332D
8A894E
CFCD65
DDDDC1
A8A8A4

Deuteranopia

34352D
8E9250
D5DD69
DCDAC4
A4A0A7

Tritanopia

392D2D
A15556
F97072
D5CBCD
90AEB0

Achromatopsia

303030
767676
AAAAAA
DCDCDC
B3B3B3

Shades & Tints Shades & Tints

#3A2B2E

Dark
Light

#A46846

Dark
Light

#FF8F58

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a2b2e;
  --color-2: #a46846;
  --color-3: #ff8f58;
  --color-4: #d4e8b5;
  --color-5: #8dcb98;
}

SCSS

$color-1: #3a2b2e;
$color-2: #a46846;
$color-3: #ff8f58;
$color-4: #d4e8b5;
$color-5: #8dcb98;

TAILWIND

colors: {
  'brand-1': '#3a2b2e',
  'brand-2': '#a46846',
  'brand-3': '#ff8f58',
  'brand-4': '#d4e8b5',
  'brand-5': '#8dcb98',
}

RGB Array

[58, 43, 46], [164, 104, 70], [255, 143, 88], [212, 232, 181], [141, 203, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This spring-style palette of #3A2B2E, #A46846, #FF8F58, #D4E8B5, #8DCB98 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: #3a2b2e; --color-2: #a46846; --color-3: #ff8f58; --color-4: #d4e8b5; --color-5: #8dcb98. 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