Question 1

What is CSS box-shadow?

Accepted Answer

CSS box-shadow is a property that adds shadow effects around an element's frame. It can have multiple shadows separated by commas, and supports properties for horizontal/vertical offset, blur radius, spread radius, and color.

Question 2

How do I use this generator?

Accepted Answer

Adjust the sliders to control the shadow properties: horizontal and vertical offset position the shadow, blur makes it softer, spread expands or contracts it, and opacity controls transparency. Click 'Copy' to get the CSS code.

Question 3

What's the difference between drop shadow and inner shadow?

Accepted Answer

A drop shadow appears outside the element's border, creating depth and making the element appear to float. An inner shadow appears inside the element's border, creating an embossed or pressed effect.

CSS Box Shadow Generator - Shadow Generator

Shadow Controls

Preview

CSS Box Shadow Generator - Shadow Generator

Shadow Controls

Preview

More Free Tools

tools.uv-index-calculator.title

tools.tip-percentage-calculator.title

tools.screen-time-balance.title

tools.body-water-calculator.title

Age Calculator

Aspect Ratio Calculator - Video/Image Ratio Calculator