CSS & Design
CSS Box Shadow Generator
Build CSS box-shadow effects visually — control horizontal/vertical offset, blur, spread, color and opacity with live sliders. Supports multiple shadow layers, inset shadows, and one-click copy of the CSS property.
Runs in your browser
Nothing uploaded
Free, no signup
Ctrl + Enter to run · Recent brings back your last inputs · Everything stays in this browser
FAQ
CSS Box Shadow Generator: questions
Can I stack multiple shadows?
Yes — add as many shadow layers as you need. CSS supports comma-separated shadow lists.
What is an inset shadow?
An inset shadow renders inside the element border rather than outside, creating a pressed or sunken appearance.
CSS Minifier & Beautifier
Compress or format CSS
SVG Optimizer
Minify and clean SVG markup
Website Accessibility Audit
Crawl a page for WCAG risks
CSS Grid Generator
Visual grid layout builder
CSS Flexbox Generator
Build flexbox layouts visually with live preview
SVG to CSS Data URI Encoder
SVG as background-image
Made something with AI? Share it as a private link.
Drop in the HTML from Claude, ChatGPT or any editor and get a link your client can open anywhere — with a password, view tracking, comments and approval.