What problem does it solve? Serving optimized, responsive images on Netlify requires knowing the /.netlify/images endpoint, its query parameters, remote-image allowlisting rules, and how to wire user uploads through Functions and Blobs — details that are easy to get wrong (404s, broken blurhash placeholders, dev-server mismatches). ## Core Features & Use Cases - On-the-fly transformations: Resize, crop, reformat (AVIF/WebP), and set quality via /.netlify/images query parameters like w, h, fit, fm, and q. - Remote image allowlisting: Configure remote_images regex patterns in netlify.toml and percent-encode source URLs to avoid 404 rejections. - Clean URL rewrites: Map friendly paths like /img/thumb/:key to transformation presets via redirect rules. - User-uploaded image pipelines: Compose Netlify Functions (upload/serve handlers) with Netlify Blobs storage and the Image CDN for a complete upload-to-optimized-delivery flow. - Use Case: Build a photo gallery where users upload images through a Function, files are stored in Blobs, and thumbnails plus hero images are served through clean rewrite URLs with automatic AVIF/WebP negotiation. ## Quick Start Ask the assistant to generate the Netlify Image CDN markup and netlify.toml configuration for serving a responsive, optimized version of a specific image on your site.
