Gradient Blur (Apple · Vercel Style)

How to use

1. Pick 3 colors + background (or preset).
2. Set size + blur intensity.
3. Set orb size (smaller = stronger accent).
4. Copy CSS or download PNG.

Key features

• 3 color orbs + dark background
• Blur 20–300 px (Apple-style key)
• 5 presets
• Pure CSS (radial-gradient + filter:blur)
• High-res PNG export

Use cases

• Landing-page hero — Vercel / Stripe / Linear style
• Product cards — new-product emphasis
• Dark-mode sites — accent backgrounds
• Slide decks — cover backgrounds
• Mobile app splash

The gradient-blur trend

Started by Vercel, Apple, OpenAI landings in 2023. Dark background + blurred color orbs creates a futuristic, refined mood. Differs from mesh gradient: orbs stay distinct, background stays dark — better content legibility. Mesh blends all colors; this is point colors.

FAQ