🔳 CSS Box Shadow & Border-Radius Visual Editor
Visually design modern multi-layer CSS box shadows and individual corner border-radius curves with real-time preview and instant code copy. 100% free.
⚙️ Shadow & Radius Controls
#000000
👁️ Live Interactive Preview
Preview Box
box-shadow: 0px 10px 25px -5px rgba(0, 0, 0, 0.15);\nborder-radius: 16px;
❓ Frequently Asked Questions
How do spread radius and blur radius differ in CSS box-shadow?
Blur radius determines how soft or fuzzy the edge of the shadow appears, while spread radius expands or shrinks the physical dimensions of the shadow shape before blurring.
Can I set different values for each individual corner's radius?
Yes, you can unlink the corner dimensions to specify unique values for top-left, top-right, bottom-right, and bottom-left individually.
Is the generated CSS code fully browser compatible?
Yes, standard box-shadow and border-radius declarations are universally supported across all modern browsers without required vendor prefixes.