Designer Toolkit
A visual design dashboard: generate color palettes, check contrast ratios, convert CSS units, build typography scales, and calculate responsive image sizes. Free, no signup.
How to use the Designer Toolkit
- 1
Generate accessible color palettes with the Color Palette Lab.
- 2
Check foreground/background contrast against WCAG standards.
- 3
Convert px, rem, em, and viewport units with the CSS Unit Converter.
- 4
Build a type scale for headings and body text.
- 5
Calculate responsive image dimensions for different screen sizes.
About the Designer Toolkit
A visual design dashboard: generate color palettes, check contrast ratios, convert CSS units, build typography scales, and calculate responsive image sizes. Free, no signup. Every tool runs entirely in your browser — no signup, no data stored, and no server-side processing. Use this board directly, or click “Open in Workbench” to customize the layout, reorder cards, and add your own tools.