UI/UX Design Tools & Calculators
Free, practical tools for interface work — check color contrast, convert px and rem, build type and spacing scales, generate color ramps, and work out aspect ratios, all in your browser.
Color Contrast Checker
Check the WCAG 2.1 contrast ratio between a text and background color, with pass/fail for AA and AAA at normal and large text sizes.
PX to REM Converter
Convert pixels to rem or rem to pixels for any root font size, with a reference table of the sizes you reach for most.
Type Scale Generator
Build a modular type scale from a base size and a ratio — minor third, major third, perfect fourth, golden — in px and rem.
Color Shades Generator
Turn one base hex into a full ramp of tints and shades from 10% to 90%, ready to paste into your palette or design tokens.
Spacing Scale Generator
Generate a consistent spacing scale from a base unit — linear or geometric — with every step in px and rem for margins, padding, and gaps.
Aspect Ratio Calculator
Solve a missing width or height for any ratio, or reduce a pixel size to its simplest ratio with the greatest common divisor.