CSS gradient generator
Choose colours, angle and gradient type to preview it instantly and copy the CSS.
About CSS gradient
Choose 2–4 colours, a gradient type (linear, radial or conic) and an angle to get a preview and CSS that works in every modern browser. Press “Random” for ideas, or download a 1920×1080 PNG for slide backgrounds or wallpapers.
Set each colour's position (%) to control how much space it takes.
FAQ
Can I use it on text?
Yes, with background-clip: text and color: transparent.
More tools here
JSON formatter Base64 encode / decode Image ↔ Base64 URL encode / decode HTML entities Hash generator UUID generator JWT decoder Regex tester Cron generator Unix timestamp converter Code formatter Markdown preview Text ↔ binary Color converter Contrast checker JSON to CSV CSV to JSON YAML ↔ JSON JSON to TypeScript AES encryption TOTP generator Password strength checker CSS box shadow CSS border radius Tailwind colors Color palette generator Aspect ratio calculator Chmod calculator