Web & Design

7 tools

Free web & design tools — check WCAG color contrast, preview SVG, convert CSS units, and generate gradients, shadows and color palettes, all instant and client-side.

CSS Units Converter Convert a CSS value between px, rem, em, pt and % using your root font size.

SVG Viewer Paste SVG markup to see it rendered live, with its dimensions.

Color Contrast Checker Pick a text and background color to check the WCAG contrast ratio and AA/AAA pass.

Color Palette Generator Pick a base color to generate shades, tints and a matching palette.

CSS Gradient Generator Build a linear or radial CSS gradient and copy the code.

Box Shadow Generator Design a CSS box-shadow with a live preview and copy the code.

Border Radius Generator Round corners independently and copy the CSS border-radius.

About our Web & Design

Handy utilities for front-end and design work: check whether a color pair passes WCAG accessibility contrast, preview and inspect SVG markup, convert between CSS units, and build CSS gradients, box-shadows, rounded corners and color palettes with live previews.

All tools run in your browser with a live preview — nothing is uploaded.