All Categories10 categories · 131 tools
PDF Tools
Compress, merge, split, convert, crop, watermark, and edit PDF files online for free.
22
Image Tools
Compress, resize, convert, and edit images without uploading to a server.
22
Text Tools
Count words, convert case, sort text, generate content, and more.
15
Developer Tools
Format JSON, encode Base64, generate UUIDs, test regex, and more.
15
Web Design Tools
Generate CSS gradients, box shadows, color palettes, and more.
10
Calculators
BMI, age, percentage, EMI, unit converters, and more free calculators.
15
Security Tools
Generate passwords, hashes, QR codes, and check password strength.
7
Misc Tools
Random numbers, dice roller, coin flip, barcode generator, and more.
9
Social Media Tools
Character counters, image resizers, hashtag tools, and more for social media.
4
AI Writing Tools
AI-powered writing assistants for essays, blogs, social posts, and more.
12

Box Shadow Generator Online Free

Generate CSS box shadows with live preview.

#000000
box-shadow: 0px 4px 10px 0px #00000040;
Files never uploadedInstant results100% freeWorks on mobile

How to Use

  1. 1Adjust the sliders for horizontal offset, vertical offset, blur, and spread.
  2. 2Pick a shadow color and set the opacity.
  3. 3Toggle inset for inner shadows and copy the generated CSS.

Frequently Asked Questions

What is a box shadow?

A box shadow adds a shadow effect around an element. It takes horizontal and vertical offsets, blur radius, spread radius, and color.

What is an inset shadow?

An inset shadow appears inside the element's border rather than outside. It creates a recessed or inner glow effect.

Can I add multiple shadows?

Yes. Copy the generated CSS and add multiple box-shadow values separated by commas.

Related Tools

User Reviews & Feedback

Real-time comments from our global community of users.

5.0out of 5
0 reviews submitted

Share your experience

No signup needed. Your feedback runs client-side and updates instantly.