Set CSS box-shadow, border-radius, and easing curves visually, then clean up messy code and convert between JSON, YAML, and XML. The free browser toolkit for front-end and config chores.
Two chores eat into every developer's day: dialling in the right CSS values by trial and error, and cleaning up code that arrived as a single minified line. Visual generators kill the first — drag a slider, copy the exact CSS. Formatters and converters kill the second — paste messy input, get readable, correctly-structured output. Here's the free browser toolkit for both.
Stop guessing pixel and colour values — set them visually and copy the generated rule:
box-shadow.Paste minified or badly-indented code and get it back clean and readable — or squeeze it small for production:
| Tool | Use it to |
|---|---|
| Code Beautifier | Re-indent and format HTML, CSS, JS & more |
| Code Minifier | Strip whitespace to shrink files for production |
| SQL Formatter | Turn a wall-of-text query into readable SQL |
| YAML Formatter | Fix indentation and validate YAML structure |
Config and API data rarely arrive in the format you need. Convert between the big three structured formats without hand-editing:
Generators let you set CSS visually instead of guessing; formatters make inherited code readable; converters move data between JSON, YAML, and XML. Together they cut the fiddly parts of front-end and config work — all free, instant, and private in your browser.