CSS Generator
Build gradients, shadows (box/text-shadow), rounded corners (border-radius) and flex/grid layouts while watching them, then copy the CSS. Nothing is sent to a server.
Color stops (2–8)
Shadow layers (up to 6)
Your input stays in this browser and is never sent to a server. The CSS is assembled only from allowed values (colors, integers, fixed keywords), so a stray `;` or `}` cannot slip in. Older browsers may not support conic-gradient or some uses of gap.
Frequently asked questions
How do I use the CSS?
Paste the copied lines inside a rule in your stylesheet, e.g. .card { copied lines }. Gradients start with a fallback color line for old browsers.
flex or grid?
Use flex to line items up and align them in one direction (row or column), and grid for a layout of rows and columns. Change values in the preview to see the difference.
Are my values saved?
No. Everything is processed in the browser and nothing is sent to a server.