THE TOOL COLLECTION

CSS and Design Tools

Build CSS effects, inspect colors and prepare design code locally, with live previews and no uploads.

10 available tools Processed on your device

Find the right tool

Free. No sign-up required.

All nine design tools together: live CSS effects, colors, contrast and code, using the original standalone controls.

Design gradients with live preview, editable color stops, opacity and ready-to-copy CSS.

Build layered CSS box shadows with a live preview, inset controls, blur, spread, opacity and accessible layer ordering.

Design circular or elliptical CSS corners with individual radii, linked controls, percent/pixel units and live overlap scaling feedback.

Beautify CSS with indentation controls or minify with CSSO. Local worker processing and CSS export.

Create color harmonies from a seed, tune saturation and lightness, lock individual colors and export a reusable CSS variable palette.

Check WCAG 2.x contrast ratios for text and color pairs, with alpha compositing, an explicit canvas and unrounded pass/fail thresholds.

Convert HEX, RGB and HSL with alpha, a color picker and a transparency preview.

Pick original-resolution pixel colors and extract an approximate dominant palette.

Minify HTML, CSS or JavaScript in a local worker, with conservative options, byte totals and downloads.