ToolsSmall utilities.
Small utilities.
Clear visual answers.
Use them independently or as building blocks for a compact design system.
COLOR
Contrast Checker
Check WCAG contrast between any foreground and background pair.
Open tool TYPEType Scale
Generate a modular typography scale from a base size and ratio.
Open tool COLORGradient Builder
Build a two-color CSS gradient and copy the generated declaration.
Open tool LAYOUTSpacing Scale
Generate a practical spacing system from a base unit.
Open tool COLORPalette Steps
Generate lighter and darker steps from a hex color.
Open tool RESPONSIVEViewport Converter
Convert pixels to vw/vh percentages for a chosen viewport.
Open tool