Free Design & CSS Generator Tools
Pick colors and build palettes, generate CSS flexbox, gradient and box-shadow code visually, calculate aspect ratios for video and images, and resize or compress images in the browser. Copy the generated CSS straight into your stylesheet.
EyeDropper Color Picker & Palette Generator
Pick colors from your screen with native EyeDropper API and generate harmonious color palettes.
In-Browser Image Resizer & WEBP Compressor
Resize dimensions and compress JPG/PNG/WEBP files entirely in browser Canvas.
PNG Transparent Background Stripper
Remove solid white or solid color backgrounds from PNG/JPG graphics client-side.
Favicon & App Icon Pack Generator
Generate 16x16, 32x32, 48x48, 180x180, and 512x512 app favicons from any square image.
CSS Gradient Generator
Design multi-stop linear and radial CSS gradients with instant CSS code export.
CSS Box Shadow & Elevation Generator
Interactive box shadow generator with offset, blur, spread, color, and inset controls.
CSS clamp() Responsive Typography Calculator
Calculate fluid responsive typography `clamp(min, preferred, max)` viewport formulas.
CSS Flexbox Layout Generator
Interactive CSS flexbox container layout builder (flex-direction, justify-content, align-items).
SVG Code to Base64 Data URI Converter
Convert SVG markup code into HTML `<img src="data:image/svg+xml;base64,...">` Data URIs.