← Back to Editor

#A5D3D1 · #A4AE90 · #BDB687 · #FFFAE6 · #DDBB0C

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

WorkspaceReadingData Visualization

Color Details Color Details

#A5D3D1

Jade · LightSteelBlue · Lake Green

HEX
#A5D3D1
RGB
rgb(165, 211, 209)
HSL
hsl(177, 34%, 74%)
HSB
hsb(177, 22%, 83%)
CMYK
cmyk(22%, 0%, 1%, 17%)
Oklch
oklch(83.4% 0.048 193.0)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#A4AE90

Willow Green · DarkSeaGreen · Apple Green

HEX
#A4AE90
RGB
rgb(164, 174, 144)
HSL
hsl(80, 16%, 62%)
HSB
hsb(80, 17%, 68%)
CMYK
cmyk(6%, 0%, 17%, 32%)
Oklch
oklch(73.5% 0.043 122.5)

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

#BDB687

Fresh Green · Tan · Sunflower

HEX
#BDB687
RGB
rgb(189, 182, 135)
HSL
hsl(52, 29%, 64%)
HSB
hsb(52, 29%, 74%)
CMYK
cmyk(0%, 4%, 29%, 26%)
Oklch
oklch(77.0% 0.064 100.6)

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

#FFFAE6

Goose Yellow · LightYellow · Lemon Cream

HEX
#FFFAE6
RGB
rgb(255, 250, 230)
HSL
hsl(48, 100%, 95%)
HSB
hsb(48, 10%, 100%)
CMYK
cmyk(0%, 2%, 10%, 0%)
Oklch
oklch(98.4% 0.027 95.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#DDBB0C

Autumn Sage · GoldenRod · Honey Gold

HEX
#DDBB0C
RGB
rgb(221, 187, 12)
HSL
hsl(50, 90%, 46%)
HSB
hsb(50, 95%, 87%)
CMYK
cmyk(0%, 15%, 95%, 13%)
Oklch
oklch(79.8% 0.162 95.6)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A5D3D1
D3A6A8

Analogous

A6D3BA
A5D3D1
A6BFD3

Triadic

A5D3D1
D1A6D3
D3D1A6

Split-Comp.

A5D3D1
D3A6BF
D3BAA6

Tetradic

A5D3D1
BAA6D3
D3A6A8
BFD3A6

Contrast Matrix WCAG 2.1 Contrast

A5D3D1
A4AE90
BDB687
FFFAE6
DDBB0C
—
1.4
Fail
1.3
Fail
1.6
Fail
1.1
Fail
1.4
Fail
—
1.1
Fail
2.2
Fail
1.2
Fail
1.3
Fail
1.1
Fail
—
2.0
Fail
1.1
Fail
1.6
Fail
2.2
Fail
2.0
Fail
—
1.8
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.8
Fail
—
White BG
1.6Fail
2.3Fail
2.1Fail
1.0Fail
1.9Fail
Black BG
12.8AAA
9.0AAA
10.2AAA
20.1AAA
11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B9D1
A8A897
BABA92
FDFDEB
CECE36

Deuteranopia

B6B3D2
A8A799
BABB95
FDFEEC
D0D341

Tritanopia

A7D2D2
A49D9E
BD9B9D
FFEFF0
DB585F

Achromatopsia

C5C5C5
A8A8A8
B3B3B3
F9F9F9
B1B1B1

Shades & Tints Shades & Tints

#A5D3D1

Dark
Light

#A4AE90

Dark
Light

#BDB687

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a5d3d1;
  --color-2: #a4ae90;
  --color-3: #bdb687;
  --color-4: #fffae6;
  --color-5: #ddbb0c;
}

SCSS

$color-1: #a5d3d1;
$color-2: #a4ae90;
$color-3: #bdb687;
$color-4: #fffae6;
$color-5: #ddbb0c;

TAILWIND

colors: {
  'brand-1': '#a5d3d1',
  'brand-2': '#a4ae90',
  'brand-3': '#bdb687',
  'brand-4': '#fffae6',
  'brand-5': '#ddbb0c',
}

RGB Array

[165, 211, 209], [164, 174, 144], [189, 182, 135], [255, 250, 230], [221, 187, 12]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A5D3D1, #A4AE90, #BDB687, #FFFAE6, #DDBB0C 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: #a5d3d1; --color-2: #a4ae90; --color-3: #bdb687; --color-4: #fffae6; --color-5: #ddbb0c. 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 general-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