css CSS Generator

Generate CSS with a preview.

Gradients, box shadows, and border radius. Free, no signup.

Color 1

Color 2

Type

Direction (linear only)

Blur

Spread

Color

Inset

Top Left

Top Right

Bottom Right

Bottom Left

Frequently Asked Questions

Can I use these on any element?expand_more

Yes, copy the generated CSS declaration into any element's style, or into a CSS class rule.

What is the difference between blur and spread in box-shadow?expand_more

Blur softens the shadow's edge. Spread expands or shrinks the shadow's size before blurring is applied.