#E2CD99 Pale Amber

Q: What color is #E2CD99?

Pale Amber is #E2CD99, or #E2CD99 in uppercase notation. In RGB it is rgb(226,205,153), in HSL about hsl(43 56% 74%), and in OKLCH oklch(0.853 0.072 88.6).

Q: What does Pale Amber symbolize?

It usually stands for energy, warmth and confidence, with a ceremonial edge. Local culture can shift that reading, so check the context.

Q: Where is Pale Amber used?

You will see it in Campaign landing pages, Editorial cover systems, Product packaging labels, Dashboard status accents, Retail wayfinding signs. It also appears across healthcare, finance, agriculture, outdoor.

Q: Which colors go well with Pale Amber?

Muted neutrals, deeper steps of the same hue and one metallic accent work well. editorial layouts that need one warm focal point; packaging that should feel appetizing without shouting; interfaces where an accent has to stay legible

Q: How does Pale Amber affect mood?

It raises perceived energy and draws the eye quickly. Large fields feel intense, so accent use is safer.

Q: Which industries use Pale Amber?

It is common in healthcare, finance, agriculture, outdoor, particularly where brands want to feel fresh, balanced, healthy, grounded, calm.

Q: What is the history of Pale Amber?

The pigment story is concrete: Green borrows its authority from foliage and renewal, moving easily from medical clean to deep forest calm. It reads as balance because the eye resolves it without strain.

Q: How should I use Pale Amber in design?

Give it one focal element, keep body copy neutral and confirm contrast at 1.56 against white and 12.07 against black.

Q: Is Pale Amber accessible?

Contrast is 1.56 against white (FAIL) and 12.07 against black (AAA). Use it for large text when the level reaches AA.

Color conversion

CMYK profile: Coated FOGRA39 · Formats follow CSS Color 4 naming and WCAG 2.2 contrast rules.

About this color

Pale AmberGreendigital color

Growth with a steady pulse

Pale Amber is #E2CD99, a Green tone with a clear cultural lineage. Read on its own it belongs to the Green family; read through its digital color roots, it carries a second layer of meaning.

Design tip

Test Pale Amber (#E2CD99) on a neutral surface first; a Green accent then looks intentional rather than decorative.

Best use

Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.

freshbalancedhealthygroundedcalm

Psychology

How it is perceived

freshbalancedhealthygroundedcalm

Psychological effect

Pale Amber raises the perceived energy of a Green composition and pulls the eye toward action.

Emotional impact

It feels immediate and warm, so it can lift a restrained layout without making it loud.

Symbolism

What it stands for

growthhealth and sustainability

Cultural significance

In digital color settings the shade carries local references, so verify its symbolism before a campaign.

Positive associations

Positive associations lean toward growth, health and sustainability, which is why it appears in invitations and seasonal work.

Use with care

Too much surface area can read as envy or dullness when desaturated too far, so keep it to accents and small fields.

Where it appears

Common design applications

Campaign landing pages: Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.
Editorial cover systems: Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.
Product packaging labels: Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.
Dashboard status accents: Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.
Retail wayfinding signs: Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.

Design guidance

How to make it work

Keep saturated fills below about twenty percent of the layout.
Use it for the primary call to action and nothing else.
Check the pairing at small sizes on a neutral background.

Avoid

Do not place it beside clashing neon greens or electric blues.
Never use it for long body text on white.
Avoid gradients that shift its hue into another family.

Brand fit

healthcare, finance, agriculture, outdoor

Brands built on The Caregiver, The Sage use it to signal character before they say a word.

Trend signal

Growth with a steady pulse

Green borrows its authority from foliage and renewal, moving easily from medical clean to deep forest calm. It reads as balance because the eye resolves it without strain.

Pairing

Colors that complete it

#BBCEFFeditorial layouts that need one warm focal point #A89462interfaces where an accent has to stay legible #96DCE8packaging that should feel appetizing without shouting

History

Pigments and provenance

Before synthetic dyes, Pale Amber was matched with mineral and plant pigments, and the Green family depended on sources such as ochre, madder and indigo. Screens now reproduce it more consistently than any single pigment ever could.

Variations

Shades darken and tints lighten while the hue angle stays fixed.

Pro tip: Shades darken and tints lighten while the hue angle stays fixed.

Shades

Darker steps built from the same hue.

0% #E2CD99 10% #CBB98A 20% #B5A47A 30% #9E906B 40% #887B5C 50% #71674D 60% #5A523D 70% #443E2E 80% #2D291F 90% #17140F 100% #000000

Tints

Lighter steps for surfaces and backgrounds.

0% #E2CD99 10% #E5D2A3 20% #E8D7AD 30% #EBDCB8 40% #EEE1C2 50% #F1E6CC 60% #F3EBD6 70% #F6F0E0 80% #F9F5EB 90% #FCFAF5 100% #FFFFFF

Use cases

Shades → hover, shadows, depth
Tints → highlights, surfaces
Balance → consistent color systems

Design tip

Keep one dominant tone, one supporter and one accent.

Color combinations

Rotate the hue wheel while holding lightness steady.

How to use it

Three moves keep the color readable and deliberate.

Why it works

The perceptual reasoning behind the palette.

Complementary

Opposite the hue wheel; it sharpens the focal color by contrast.

#E2CD99 #BBCEFF

Best use: Calls to action and single-feature highlights

Split-complementary

Two neighbors of the opposite hue; softer than a direct complement.

#E2CD99 #A3D6F9 #D4C5F8

Best use: Balanced marketing layouts with two accents

Triadic

Three hues spaced evenly; lively but needs one dominant voice.

#E2CD99 #96DCE8 #EABFE7

Best use: Event identities and playful editorial spreads

Analogous

Neighbors on the wheel; quiet, cohesive and easy to scan.

#F3C4A1 #E2CD99 #CAD6A1

Best use: Backgrounds, charts and calm product pages

Monochromatic

One hue across lightness steps; disciplined and premium.

#A3946E #E2CD99 #EADBB6

Best use: Design systems, packaging and typographic hierarchy

Tetradic

Two complementary pairs; rich, but requires strict proportion.

#E2CD99 #AFDCB5 #BBCEFF #EABFE7

Best use: Complex dashboards and multi-service brands

Export palette

CSS

:root {
  --color-1: #887B5C;
  --color-2: #B5A47A;
  --color-3: #E2CD99;
  --color-4: #E8D7AD;
  --color-5: #EEE1C2;
}

Tailwind

colors: {
  color1: '#887B5C',
  color2: '#B5A47A',
  color3: '#E2CD99',
  color4: '#E8D7AD',
  color5: '#EEE1C2',
}

JSON

["#887B5C","#B5A47A","#E2CD99","#E8D7AD","#EEE1C2"]

Principles

Balance

Keep one dominant tone, one supporter and one accent.

Contrast

Test body text against both white and black before shipping.

Harmony

Rotate the hue wheel while holding lightness steady.

Color contrast checker

Test body text against both white and black before shipping.

Text color

Background

1.56 :1

FAIL

Quote

Give Pale Amber the single element that must be noticed first, and let the rest of the Green palette support it.

WCAG contrast

Preview

Aa / Bb

#E2CD99 · Pale Amber

WCAG contrast standards

WCAG 2.2 sets minimum contrast for text and interface parts. #E2CD99 measures 1.56:1 against white (FAIL) and 12.07:1 against black (AAA). Use the table below to choose the right threshold for the text size.

Level	Normal text	Large text (18pt+ / 14pt bold)	Icons & UI parts
AAA	7 : 1	4.5 : 1	—
AA	4.5 : 1	3 : 1	3 : 1
Fails	< 4.5 : 1	< 3 : 1	< 3 : 1

Large text means 18pt regular or 14pt bold. UI parts need 3:1 against adjacent colors. AA is the common compliance baseline; AAA is enhanced.

Technical formats

Notation across color spaces

HEX

#E2CD99

CSS Color 4

RGB

226,205,153

sRGB / D65

HSL

43,56,74

HSL

OKLCH

oklch(0.853 0.072 88.6)

perceptual

LAB

83,0,29

CIE Lab

LCH

83,29,91

CIE LCH

XYZ

59,62,39

CIE XYZ

LUV

83,16,39

CIE LUV

HWB

43,60,11

CSS HWB

CMYK

0,9,32,11

Practical formats

Ready-to-use values

CSS

color: #E2CD99;

custom properties

Tailwind

bg-[#E2CD99] text-[#FFF]

arbitrary value

Android

#FFE2CD99

ARGB

Flutter

Color(0xFFE2CD99)

dart:ui

Photoshop

R 226 G 205 B 153 · C 0 M 9 Y 32 K 11

RGB / CMYK

CMYK 0,9,32,11

FOGRA39

Color analysis

Measured color properties

Lightness

0.621

relative luminance · warm

Contrast

1.56 : 1

vs white · FAIL · warm

Contrast

12.07 : 1

vs black · AAA · warm

Hue

43°

saturation 56% · warm

LCH

83,29,91

lightness 74% · warm

Delta E

11.6

秋香 #C8AD78 · warm

Similar colors

Nearest colors from the full Irodori library, ranked by ΔE.

Pale Orange #FFDEADΔE 8.6 Light Orange #DEB887ΔE 9.5 Light Orange #D2B48CΔE 10.5 Pale Yellow #EEE8AAΔE 11.1 秋香 #C8AD78ΔE 11.6 Pale Orange #FFDAB9ΔE 13.0

Blindness simulator

How it reads with color vision deficiency

How it reads with color vision deficiency · ΔE 11.6