.element {
box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1);
}Yes, this tool is completely free with no sign-up required. Create as many box shadow styles as you need.
No, all shadow generation happens in your browser. Your designs never leave your device.
Start by adjusting the horizontal and vertical offset to position your shadow. Increase blur radius for a softer effect and use spread radius to expand or contract the shadow size. Choose a shadow color and adjust opacity (10-25% works well for most designs). For professional depth, click "Add Layer" to create multiple shadows with different blur values. Finally, switch between CSS and Tailwind output to copy the code.
Yes, use the "inset" option to create inner shadows that appear inside the element rather than outside. Great for pressed button effects.