Light Color

#EFDCDA

Approximate Color Name: Champagne

Closest CSS Color Name: AntiqueWhite (#FAEBD7)

Color Space Coordinates

Copyable codes for development, CSS styling, and print

HEX#EFDCDA
RGBrgb(239, 220, 218)
HSLhsl(6, 40%, 90%)
HSV / HSBhsv(6, 8.8%, 93.7%)
CMYK (Print)cmyk(0%, 8%, 9%, 6%)
OKLCH (CSS4)oklch(0.909 0.021 25.3)
OKLaboklab(0.909 0.019 0.009)
Tailwind CSSbg-[#EFDCDA]

WCAG 2.1 Contrast & Accessibility Audit

Evaluates readability standards for normal body text (4.5:1 AA / 7.0:1 AAA) and large headings (3.0:1 AA / 4.5:1 AAA)

Against Pure White (#FFFFFF)1.32:1
White Text on #EFDCDA
AA Normal Text
AAA Normal Text
Against Pure Black (#000000)15.92:1
Black Text on #EFDCDA
AA Normal Text
AAA Normal Text

Tonal Variations (Shades, Tints & Tones)

Calibrated step variations created by adding black (shades), white (tints), and gray (tones)

Harmonies for #EFDCDA (Champagne)

Classical color wheel pairings calculated from 360-degree rotational angles

Complementary (180°)

Opposite

Triadic (120° / 240°)

Equidistant

Analogous (±30°)

Adjacent

Split-Complementary (150° / 210°)

Soft Contrast

Practical UI/UX Design Usage for #EFDCDA

Primary Buttons & Focus Rings

With an RGB luminance of 239, 220, 218, this shade works best with dark text (#0F172A) for call-to-action buttons and form focus states.

Background Containers

To use #EFDCDA as a card background or subtle surface tint, apply an opacity of 5% to 15% (bg-[#EFDCDA]/10 in Tailwind) to maintain high typography readability.

Data Visualization & Badges

Pair with its complementary accent #DBEEF0 or triadic partner #DBF0DD to distinguish distinct categories in charts and tables.

Explore More Popular Colors

View All Colors Directory →
Light
#FF5733
Persimmon Red255,87,51
Explore Color Details
Dark
#3B82F6
Bright Blue59,130,246
Explore Color Details
Light
#10B981
Emerald Green16,185,129
Explore Color Details
Light
#F59E0B
Amber Glow245,158,11
Explore Color Details
Dark
#8B5CF6
Vivid Purple139,92,246
Explore Color Details
Light
#EC4899
Pink Rose236,72,153
Explore Color Details

Tools & Utilities for #EFDCDA

Explore gradients, test contrast ratios, and generate monochromatic shades with #EFDCDA

All Tools →

Related Educational Guides

Learn how color models, web contrast standards, and conversion mathematics work

All Guides →