Design playground
From an idea to a usable asset. Ten free browser tools with local processing.
Choose your next task
No account requiredBrand palette & contrast
Create lighter and darker brand-colour candidates and inspect solid-colour contrast ratios.
02 / DESIGN ↗CSS gradient
Generate a CSS gradient and inspect it in a live card before copying the declaration.
03 / DESIGN ↗CSS card shadow
Tune a card shadow using offsets, blur, spread and a colour.
04 / DESIGN ↗Logical corner radius
Generate logical border-corner declarations for interfaces that may use either text direction.
05 / DESIGN ↗Favicon PNG pack
Create PNG favicon sizes and a starter web manifest from one source image.
06 / DESIGN ↗Safe SVG source sanitizer
Keep only allowlisted SVG shapes and attributes in a new sanitized source file.
07 / DESIGN ↗Responsive layout starter
Start a responsive card layout from your headline and chosen column count.
08 / DESIGN ↗Image to ASCII
Sample image brightness into a fixed-width text illustration.
09 / DESIGN ↗System font pairing
Compare a system heading font and body font with your own Latin or Arabic copy.
10 / DESIGN ↗App icon PNG pack
Export a set of square PNG app-icon sizes from one source image.
Your files, your device.
Files are processed in your browser. No processing server, account or paid API is required. Device text-to-speech voices may use operating-system network services.