Box Shadow Generator
Adjust offset, blur, spread, color, and opacity with sliders and a color picker to design a CSS box-shadow, see it applied live to a preview box, and copy the generated box-shadow declaration straight into your stylesheet.
box-shadow: 4px 4px 12px 0px rgba(0, 0, 0, 0.35);How it works
Offset-X and offset-Y move the shadow horizontally and vertically, blur radius softens its edge, and spread radius grows or shrinks it before the blur is applied. Pick a color and opacity for the shadow, and toggle inset to draw the shadow inside the box's edge instead of outside it.
Tip
Subtle shadows usually look best: a small offset, a blur radius roughly two to three times the offset, and an opacity well under 50% read as a soft, natural lift rather than a heavy outline.
Can I stack multiple shadows?
Yes — CSS box-shadow accepts a comma-separated list of shadows, layered from top to bottom. This tool generates one shadow at a time; combine several generated declarations (comma-separated) to build layered, more realistic shadows.
More tools in this category
Regex Tester
Test regular expressions against sample text with live match highlighting.
Cron Expression Parser
Parse a 5-field cron expression into a plain-language schedule and see its next run times.
Text Encoding Converter
Convert text to UTF-8 hex, binary, code points, Base64, URL encoding and HTML entities at once.
Password Generator
Generate strong, random passwords instantly, right in your browser.
JSON Formatter & Validator
Format, validate, and minify JSON instantly in your browser.
UUID Generator
Generate random, RFC 4122 version 4 UUIDs instantly in your browser.
JWT Decoder
Decode and inspect JSON Web Tokens (JWTs) instantly in your browser.
Diff Checker
Compare two blocks of text and instantly see every line that was added or removed.
Slug Generator
Turn any text into a clean, URL-friendly slug in real time.
Number Base Converter
Convert numbers between binary, octal, decimal, and hexadecimal instantly.
Unix Timestamp Converter
Convert Unix timestamps to dates and dates to Unix timestamps, live.
Hash Generator
Generate SHA-1, SHA-256, and SHA-512 hash digests from any text, right in your browser.
Cron Expression Builder
Build a valid 5-field cron expression from a friendly form — no need to memorize the syntax.
Lorem Ipsum Generator
Generate placeholder Lorem Ipsum text by paragraphs, sentences, or words for mockups and layouts.
Markdown Previewer
Write Markdown on the left and see the rendered HTML update live on the right.
IP Subnet Calculator
Enter an IPv4 address in CIDR notation and get its network, mask, broadcast, and host range.
HTTP Status Code Lookup
Look up any HTTP status code and see its standard meaning in plain English.
SQL Formatter
Pretty-print minified or messy SQL into readable, indented statements.
Image to Base64 Converter
Convert an image into a Base64 data URI you can paste straight into HTML, CSS, or JSON — entirely in your browser.
Semver Comparator
Compare two semantic version strings and see which one takes precedence, following the official semver rules.