Design

Aspect ratios, DPI, scaling, layout math · 11 tools

Aspect Ratios 2

Aspect Ratio Calculator Scale width and height proportionally: enter original dimensions and a new width to get the matching height. Free and instant.

Aspect Ratio Reference Common aspect ratios with their decimal values, typical resolutions, and where each is used.

CSS 5

CSS Border Radius Generator Visual CSS border-radius builder — per-corner control, live preview, and the elliptical blob-shape syntax.

CSS Box Shadow Generator Build CSS box-shadows with live sliders and preview — offset, blur, spread, opacity, inset, copy-ready output.

CSS Flexbox Playground Interactive CSS flexbox playground: tweak every container property and copy the CSS that matches the preview.

CSS Grid Playground Interactive CSS grid builder: drag columns, rows, gap, and alignment and copy the CSS that matches the live preview.

Favicon Generator Generate a full favicon set from a letter or emoji — real .ico file, apple-touch-icon, 512px PNG, and the HTML snippet.

Color 4

Color Blindness Simulator Preview images and designs under deuteranopia, protanopia, tritanopia, and total color blindness — spot color-only cues.

Color Contrast Checker WCAG color contrast ratios with AA/AAA pass-fail for normal and large text, live sample, and a swap button.

Color Converter Convert colors between HEX, RGB, and HSL with a live swatch, picker, and tint-and-shade strip — instant and in-browser.

CSS Gradient Generator Visual CSS gradient builder: linear, radial, and conic with draggable stops, angle control, and copy-ready output.