Design Tools
Colour, contrast, CSS and layout tools for designers and front-end developers.
10 tools in this category
Color Picker
Pick colors from an image or your screen and convert HEX, RGB and HSL.
Use ToolColor Palette Generator
Generate an 11-step color scale from one HEX color.
Use ToolColor Contrast Checker
Check text and background colors against the WCAG AA and AAA contrast requirements.
Use ToolPX to REM Converter
Convert pixels to rem and rem to pixels using any root font size.
Use ToolAspect Ratio Calculator
Find the aspect ratio of any size and resize the width or height without stretching.
Use ToolCSS Gradient Generator
Build linear, radial and conic CSS gradients with a live preview, then copy the code.
Use ToolCSS Box Shadow Generator
Design layered CSS box shadows, including inset shadows, with a live preview.
Use ToolCSS Clip Path Generator
Draw polygon, circle and ellipse clip-path shapes with draggable points, or start from a preset.
Use ToolCSS Background Pattern Generator
Make stripe, dot, grid and checkerboard background patterns in pure CSS.
Use ToolCSS Loader Generator
Create CSS-only loading spinners with your own size, colour and speed.
Use Tool