What are the hex codes in the Ruby Vermilion & Pear palette?

The Ruby Vermilion & Pear color palette consists of Vermilion #E14800, Space #2A3157, Smoke #F1FAEE, Pear #DCDD68.

How should I use the Ruby Vermilion & Pear palette on a website?

Use Smoke #F1FAEE as the background, Space #2A3157 for text, Vermilion #E14800 for buttons and links, and Pear #DCDD68 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Smoke at 11.73:1.

Which colors in Ruby Vermilion & Pear have enough contrast for text?

The highest-contrast pair is #2A3157 on #F1FAEE with a ratio of 11.73:1, which passes WCAG AA for normal text.

#E14800Vermilion

#2A3157Space

#F1FAEESmoke

#DCDD68Pear

Ruby Vermilion & Pear color palette

Modern White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Vermilion	`#E14800`	`rgb(225, 72, 0)`	`hsl(19, 100%, 44%)`	`oklch(61.3% 0.199 38)`
Space	`#2A3157`	`rgb(42, 49, 87)`	`hsl(231, 35%, 25%)`	`oklch(32.7% 0.068 274)`
Smoke	`#F1FAEE`	`rgb(241, 250, 238)`	`hsl(105, 55%, 96%)`	`oklch(97.5% 0.018 138)`
Pear	`#DCDD68`	`rgb(220, 221, 104)`	`hsl(61, 63%, 64%)`	`oklch(87.4% 0.140 109)`

Why it works and how to use it

Ruby Vermilion & Pear is a vivid complementary color palette tagged modern, white. Near-complementary hues (about 170° apart) make this a high-contrast, attention-grabbing combination. Saturation runs high, so use the brightest color sparingly and let the others carry the surface area. Warm and cool hues are mixed, which adds depth.

With 3 chromatic colors, Vermilion takes the lead while the rest support. Lightness runs from 25% to 96%. Well suited to websites, presentations and branding.

Background: Smoke (#F1FAEE) is the lightest color, so it belongs on large surfaces.
Text: Space (#2A3157) on #F1FAEE gives 11.73:1, passing WCAG AAA.
Primary: Vermilion (#E14800) is the most saturated mid-tone; use it for buttons and links (3.83:1 against the background, fine for UI elements).
Accent: Pear (#DCDD68) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Space on Smoke at 11.73:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Ruby Vermilion & Pear

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#E14800

#2A3157

#F1FAEE

#DCDD68

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#2A3157` on `#F1FAEE`	Aa	11.73:1	AAA
`#2A3157` on `#DCDD68`	Aa	8.71:1	AAA
`#E14800` on `#F1FAEE`	Aa	3.83:1	AA large only
`#E14800` on `#2A3157`	Aa	3.06:1	AA large only
`#E14800` on `#DCDD68`	Aa	2.84:1	Fail
`#F1FAEE` on `#DCDD68`	Aa	1.35:1	Fail

Similar palettes 24 more in this mood