Smiley Face

#ffc962

Brighter lemon-chartreuse warmth for playful highlights and badges

Save
Share

About Smiley Face

Smiley Face reads like a friendly smear of soft golden paint on a lunch placemat, but cleaner and more awake than the honeyed yellows around it. Compared with , it holds onto more brightness instead of feeling rounded and smooth. It's also less mellow than , with less of that softened, theater-lobby warmth. And relative to , it doesn't lean as toasted, staying more cheerful and lighter in tone.

On screens, I use Smiley Face when I want a sunny backdrop that still feels crisp: onboarding for consumer apps, banner accents in retail campaigns, and UI for food service flows that need quick trust. It works especially well behind product photography in e-commerce and in hero areas for wellness or kids brands where you want optimism without drifting toward syrupy gold. I like it with deep green type, charcoal UI chrome, and clean neutrals so the warmth stays controlled.

One quirk: next to strong oranges, it can start to look slightly more peachy than you expect, so test against your exact cream and divider grays before you lock the palette.

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
1.52:1Fail

On Gray 100 #f5f5f5

Aa
1.40:1Fail

On Gray 900 #18181b

Aa
11.63:1AAA

On Black #000000

Aa
13.78:1AAA

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

#ffc863
#ffcb5d
#ffcf65

Create a gradient with Smiley Face

Open the generator with this color pre-loaded.

Start creating