Creates CSS box-shadow declarations with real-time preview. Configure horizontal offset, vertical offset, blur radius, spread radius, colour (with opacity), and inset toggle for each shadow layer. Add multiple shadow layers for complex effects. Previews on a card with configurable background colour for context.
box-shadow: 0px 8px 24px 0px #00000040;
Configure your shadow properties visually and copy the box-shadow CSS value.
Generate linear, radial, and conic CSS gradients with live preview.
Generate CSS border-radius values visually.
Generate CSS text-shadow effects with live preview.
Convert image files to Base64-encoded data URLs.
Convert Base64-encoded data URLs back to viewable and downloadable images.
Simulate how images appear under different types of colour blindness.