Design reference

Icons, type scales, device sizes and the numbers you keep looking up.

Device viewport sizes

The viewport of every device you are asked to support, in the CSS pixels a media query actually reads, with the Tailwind breakpoint each one lands in.

Icon search

Search Lucide and Hugeicons by name, preview every match at the size you will ship it at, and copy the import and the JSX tag each set expects.

px to rem converter

Convert between px and rem at any root size, both ways, with the sizes you actually use listed out underneath.

Type scale generator

Build a modular type scale from a base size and a ratio, see every step set in the real face, and copy it as Tailwind theme variables.

Markdown version