Pale Canary
#f1efa6
Lighter, cleaner canary yellow-green for airy highlights
About Pale Canary
Pale Canary reads like a sheet of light laid over pale green leaves, but it stays decisively yellow. Compared to Drover, it's a touch cleaner and less powdery, so it doesn't feel like sun-warmed hay. Versus Cream and Butter, it's brighter and more "screen-white" in its presence, not textile-mellow. And next to First Day of Summer, the undertone is less green-leaning, so it lands closer to crisp lemon than spring-filtered foliage.
I use this as a controlled highlight color for onboarding and dashboards where you want cheer without the softer, dairy warmth of the other creams. It works well in ag-tech and logistics UIs for step indicators, lightweight info panels, and chart headers, especially alongside sage, olive-gray, and ink slate so the yellow doesn't take over. It's the kind of base that still feels intentional when the rest of the layout is mostly white and near-whites.
One quirk: if you pair it with overly saturated greens, it can look a bit "spotlit," so lean on muted botanicals or warm neutrals to keep the page grounded.
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
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
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
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.