Web design tools
Free utilities that run in your browser, made to go with the placeholder image generator: tweak, copy the code and keep building.
Sizes and dimensions
- Social media image sizes Dimensions for Instagram, Facebook, X, LinkedIn, YouTube, TikTok and Open Graph.
- IAB banner sizes Standard ad formats with a preview and a placeholder URL.
- Aspect ratio calculator Work out the height or width for 16:9, 4:3, 1:1 or any ratio.
- srcset and picture generator Responsive image HTML with srcset, sizes and picture.
CSS generators
- Box-shadow generator CSS shadows with multiple layers, inset shadows and a live preview on an image.
- CSS gradient generator Linear, radial and conic gradients with multiple colour stops.
- Border-radius generator Round each corner separately and make organic shapes.
- CSS image filters Blur, grayscale, sepia, brightness, contrast and more, with a preview.
- Clip-path generator Clip images into circles, polygons and custom shapes.
Images
- Convert images to WebP and AVIF Convert and compress JPG and PNG in your browser, nothing uploaded.
- Image to Base64 Turn an image into a data URI for CSS or HTML.
- Favicon generator Favicon and app icons from text or an image.
- SVG placeholders and LQIP Inline SVG placeholders and blurred previews for lazy loading.