Clementine

#e96e00

Bright citrus orange for optimistic alerts, not ember

Save
Share

About Clementine

Clementine splits the difference between what you'd actually eat and what you need people to notice. It's got more yellow, less red than or , which means it reads warmer and brighter, less like clay, more like actual fruit. It's saturated enough to feel intentional, but there's a lightness to it that keeps it from the heavy, grounded feel of .

Use it in food e-commerce, travel imagery, and product launches where you need the eye to move without the color feeling like an emergency. It works on cards, hero sections, seasonal campaigns. It's got more presence than À l' but stays approachable in a way doesn't, you can actually live with it on a page without it demanding the whole room. The yellow undertone makes it feel less urgent and more inviting, closer to a material you'd want to pick up.

Pair it with dark gray or off-white type, and it holds. Avoid putting it on warm backgrounds where it'll start to flatten, and keep it away from high-contrast alerts where you'd reach for something more aggressive anyway. It's the sweetspot when you want motion that still feels like an invitation.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

Code snippets

Copy this color into your project.

Contrast checker

WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.

On White #ffffff

Aa
3.14:1FailAA Large

On Gray 100 #f5f5f5

Aa
2.88:1Fail

On Gray 900 #18181b

Aa
5.65:1AAAAA Large

On Black #000000

Aa
6.70:1AAAAA Large

Variations

Shades

Darker variations, created by mixing toward black.

Tints

Lighter variations, created by mixing toward white.

Tones

Muted variations, created by reducing saturation.

Hues

Hue rotations around the color wheel.

Temperatures

Warm and cool shifts of this color.

Color harmonies

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

Create a gradient with Clementine

Open the generator with this color pre-loaded.

Start creating