Responsive Image srcset Builder
A srcset list and image tag for your file and widths.
Runs in your browser. Nothing is uploaded — your input is processed on this device and discarded when you close the tab.
Responsive Image srcset Builder
How to use this tool
- Enter your values in the fields above.
- Press Generate to see the result.
- Use Load sample to try the worked example, Copy result to copy it, or Clear to start again.
Worked example
The file photo.jpg with widths 400, 800 and 1200 gives the srcset “photo-400.jpg 400w, photo-800.jpg 800w, photo-1200.jpg 1200w”.
What this tool does not do / Limits
The builder writes file names by inserting the width before the extension; it does not create resized images, check that files exist, or guarantee a browser picks a particular size.
Frequently asked questions
Do I need to make the resized files?
Yes. The tool only writes the list; you must create each sized file yourself.
Which file is used first?
The first width in your list is used as the fallback source in the tag.
Related tools
JSON Studio
Format, validate, minify, query and compare JSON in your browser, with precise line-and-column errors.
LiveRegex Tester
Test patterns against sample text with match highlighting, capture groups and a safe one-second timeout.
LiveSecurity Header and DNS Checker
Check HSTS, CSP and other security headers, TLS details, and DNS/email authentication records (SPF, DKIM, DMARC).
Live