Most bad gradients fail for the same three reasons: the two colors are too similar, the lightness curve collapses through a muddy middle, or the contrast doesn't survive having text on top. The fix isn't taste — it's a handful of rules you can apply in five minutes.
Rule 1 — Pick colors with real hue distance
If your two colors are 15° apart on the color wheel, you don't have a gradient — you have a smear. The most beautiful gradients usually move at least 60° in hue (warm to cool, cool to warm) or commit to a single hue and move dramatically in lightness instead.
Rule 2 — Watch the middle
RGB blending famously produces a dead gray in the middle of a saturated red→green gradient. OKLCH-based blending (what Fove uses under the hood for ramp generation) preserves perceived chroma through the transition, which is why our palette ramps look richer than the equivalent HSL ramps.
Rule 3 — Make contrast non-negotiable
A gradient that doesn't hold AA contrast against your type is a decoration, not a backdrop. Anchor one end with something dark enough (or light enough) that the gradient still works as a surface, not just an image. Fove scores every gradient against WCAG in real time so you don't have to eyeball it.
Three pairings that always work
- Deep navy + warm ember — confidence with energy. Pitch decks and finance brands.
- Sage green + cream — quiet, editorial, gender-neutral. Wellness and slow-living.
- Indigo + magenta — modern tech without going neon. AI and creator tools.
Where to go from here
If you want to skip the picking part entirely, the Fove color pages are a shortcut: every common gradient color has its own page with three or four tuned pairings, ready to open in the editor and export.