EspañolResponsive iframe (YouTube, Google Maps and more)
The iframe copied from YouTube or Google Maps comes with a fixed width and overflows the phone screen. Paste it here and copy the version that adapts.
How to useVideos and maps that fit on phones
Available in: 
Responsive iframe (YouTube, Google Maps and more): what it is for
Embed code from YouTube and Google Maps comes with a fixed width and height and overflows phone screens. Paste the iframe or just the address and get the version that takes 100% of the width and keeps its proportion with aspect-ratio.
The tool recognizes YouTube (including 9:16 Shorts), Google Maps, Vimeo, Spotify, Instagram, Canva and Google Forms, suggests the right proportion or height, adds loading=lazy, a title for screen readers and fullscreen, and shows a preview you can narrow to see how it looks on phones.
How to use
- Paste the iframe or the address.
- Check the proportion and the title.
- Copy the code to your site.
When to use it
- YouTube video on the home page.
- Google map on the contact page.
- Spotify player or embedded form.
Frequently asked questions
Why does the iframe overflow on phones?
The embed code comes with a fixed width and height, like 560 by 315. On a phone 360 px wide, the video ends up bigger than the screen. The code generated here uses 100% width and the aspect-ratio property, which keeps the proportion on any screen.
What does loading=lazy do?
The browser only loads the iframe when it's close to appearing on screen. Since videos and maps are heavy, this makes the page load much faster when they're further down.
What is the title on the iframe for?
Screen readers announce the title to say what's inside the iframe, like 'Video: how to get to the store'. Without it, people only hear 'frame' and don't know what it is.
Is it really free?
Yes, 100% free. No sign-up, no subscription and no usage limits. All Tools123 tools are free and run right in your browser.