Free Design Tools Online
Visual design utilities: colour picker and palette generator, gradient builder, contrast checker, colourblind simulator, font preview. Built around accessibility and quick iteration.
5 free tools — browser-based, no sign-up required.
Color Picker
Pick and convert colors
Color Palette Generator
Generate beautiful color palettes
Font Preview
Preview Google Fonts
Colorblind Simulator
Simulate color blindness on images
Contrast Checker
Check color contrast ratio
About FlexyPdf Design Tools
Design work involves making the same decisions repeatedly — picking a colour pair, checking that text is readable against a background, previewing a font in real copy, sketching a gradient. The design tools here are the digital equivalent of swatch books and contrast cards: small, fast, and focused on the moment of decision rather than a full design environment.
The colour picker reads RGB, HSL, HSV, HEX, OKLCH, and CSS named colour values, and converts between them in real time. The palette generator produces complementary, analogous, triadic, tetradic, and monochromatic palettes from a base colour and exports them as CSS variables, Tailwind config, or a downloadable image. The gradient generator supports linear, radial, and conic gradients with multiple colour stops and live CSS output you can paste straight into your stylesheet.
For accessibility, the contrast checker reports WCAG AA/AAA compliance for normal and large text against any colour pair, with clear pass/fail indicators. The colourblind simulator renders any uploaded image as it would appear to viewers with deuteranopia, protanopia, tritanopia, or monochromacy — a critical check before signing off on a colour-coded chart or icon set. The font preview lets you render arbitrary text in dozens of common web fonts at the actual sizes you intend to ship.
Who uses these tools
A few of the recurring use cases we hear about from FlexyPdf visitors.
Visual and UI designers
Iterating on a colour palette, building gradients for hero sections, previewing fonts in real product copy.
Front-end engineers
Converting design tokens between colour formats, generating CSS gradients to paste into stylesheets, verifying contrast compliance.
Accessibility specialists
Running WCAG contrast checks across a colour system, simulating colourblind perception of dashboards and charts.
Brand and marketing teams
Picking and previewing typography choices, generating consistent brand palettes from a single seed colour.
Frequently asked questions
How accurate is the colourblind simulator?
It uses the standard colour vision deficiency matrices (Brettel, Viénot, and Mollon) that are widely cited in the accessibility literature. The result is a reliable approximation but not a clinical diagnosis tool — actual perception varies between individuals.
Does the contrast checker handle text over images or gradients?
It checks colour pairs only — if your text sits on a gradient or image, you should test against both the lightest and darkest pixel under the text. The colour picker can help by sampling pixels from an uploaded image.
Can I export palettes in a format my design tool recognizes?
Yes — palettes export as CSS custom properties, Tailwind config snippets, SCSS variables, JSON, and a downloadable PNG swatch. Direct .ase (Adobe Swatch Exchange) export is not yet supported.