Free Design Tools
Free design tools for picking colours, generating palettes and gradients, checking WCAG contrast, building CSS shadows and border-radius, and calculating aspect ratios.
How to choose the right tool
Design tools are for quick visual decisions: colour, contrast, CSS effects, dimensions, and responsive ratios.
Colour tools commonly support HEX, RGB, HSL, and HSV. CSS tools output copy-ready CSS values.
Choose by need
- Use colour tools for picking, converting, extracting, and building palettes.
- Use CSS generators for gradients, shadows, and border radius values.
- Use ratio and screen tools when sizing images, videos, previews, or layouts.
Common tasks
- Check text contrast before shipping a UI.
- Generate a CSS gradient or shadow.
- Calculate a missing width from an aspect ratio.
Choose a tool and get an instant result
BlinkCalc tools are designed to be fast, practical, privacy-conscious, and easy to understand. Many tools process inputs directly in your browser; tools that need a remote request explain that processing on their page.
Aspect Ratio Calculator
Calculate and lock aspect ratios for images, videos, and screens.
Box Shadow Generator
Create and preview CSS box-shadow values visually.
Color Code Converter
Convert colors between HEX, RGB, HSL, and HSV formats instantly.
Color Contrast Checker
Check WCAG color contrast ratios for accessible web design.
Color Palette Generator
Generate random color palettes of 3–10 colors.
Color Picker
Pick any colour and convert it between HEX, RGB, and HSL formats.
CSS Border Radius Generator
Visually build CSS border-radius values and copy the CSS code.
CSS Gradient Generator
Build beautiful linear and radial CSS gradients visually.
Pixel Converter
Convert between px, rem, em, pt, and vw/vh CSS units.
Random Color Generator
Generate random HEX, RGB, and HSL color values.
Screen Resolution Checker
Instantly see your screen resolution, viewport size, device pixel ratio, and orientation.
Screen Size Calculator
Calculate diagonal screen size and PPI from width and height in pixels.
Related categories
Math
Use free online math calculators for percentages, fractions, statistics, geometry, equations, number tools, grades, and date calculations.
Finance
Plan loans, savings, investments, salaries, taxes, retirement, budgets, interest, and mortgage payments with free finance calculators.
Health
Calculate BMI, calories, macros, heart rate zones, pregnancy dates, hydration, fitness metrics, body composition, and wellness estimates.
Converters
Convert length, weight, temperature, area, volume, speed, time, energy, data storage, and other common measurement units online.
Date & Time
Free date and time tools to convert Unix timestamps, calculate the difference between dates, count down to a deadline, switch time zones, and convert military time.
Everyday
Practical everyday calculators for paint coverage, concrete and gravel volumes, electricity costs, wind chill, heat index, fuel cost, ABV, and more.
Frequently asked questions
Can I use these CSS gradients and shadows commercially?
Yes. The CSS generated by our gradient, shadow, and border-radius tools is plain CSS. Copy and paste into any project, personal or commercial.
Are the contrast ratios WCAG-accurate?
Yes. The contrast checker follows the WCAG 2.1 formula and reports AA and AAA pass/fail for normal and large text.
Do you support HSL and HSV colour formats?
Yes. The colour picker and converter handle HEX, RGB, HSL, and HSV, and the palette tools export in any of those formats.