🍱 Lunchbox Hands

Gradient Generator

Visual gradient builder with CSS output

Build CSS gradients visually with a live preview. Choose between linear and radial gradients, adjust the angle, and add as many color stops as you need. The generated CSS is displayed below the preview and can be copied with one click.

Angle: 90°

0%

100%

background: linear-gradient(90deg, #6366f1 0%, #ec4899 100%);

Related Tools

Color Converter Convert between hex, RGB, HSL, and OKLCH Color Palette Generator Generate harmonious color palettes from a base color Contrast Checker Check WCAG AA/AAA contrast ratios Theme Editor Generate custom shadcn/ui themes with OKLCH color variables

Get weekly dev tools and tips