iFrame Generator

Enter any URL and get a clean iframe code for free — fixed size or responsive — to embed a page, form or app on your website. No sign-up needed.
Any page that allows embedding, e.g. https://example.com/booking/

Preview blank or “refused to connect”? The site doesn’t let other sites show it in a frame (its X-Frame-Options or Content-Security-Policy header), and only its owner can change that. Learn more

Embedding forms, reviews or feeds? See Elfsight widgets →
What the page inside learns about where the visitor came from (the referrerpolicy attribute).
Proportional: the height follows the width, like a video. Fixed: a set height in pixels.

Embed the page

<div style="position:relative;width:100%;aspect-ratio:16 / 9;">
  <iframe src="https://example.com/" title="example.com" loading="lazy" style="position:absolute;inset:0;width:100%;height:100%;border:0;"></iframe>
</div>
<p style="margin:4px auto 0;text-align:center;font:11px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:#a3a7b0;">Created with <a href="https://elfsight.com/tools/iframe-generator/" target="_blank" rel="noopener" style="color:inherit;text-decoration:none;">Elfsight</a></p>

  1. Click Copy code above to copy it.
  2. Open the page’s HTML file or template.
  3. Paste the code inside <body>, where the content should appear.
  4. Save and upload the page, then open it in a browser to check.

Embedding forms, reviews or feeds? Elfsight widgets do it without iframes and match your site’s design. See Elfsight widgets →

Before you go

Embedding forms, reviews or feeds? Elfsight widgets do it without iframes and match your site’s design.

See Elfsight widgets →
Or share this free tool:

iFrame Generator vs writing the iframe by hand

An iframe is one line of HTML, but the attributes that make it accessible, fast and safe are easy to forget or mistype. Here’s what changes when you build it with the generator.
Writing the iframe by hand
This generator
Attributes
You need to remember each attribute name and its exact values.
Pick attributes from a list, with a short explanation next to each one.
Accessible title
Often left out, so screen reader users don’t know what the frame contains.
Asks for a title so the frame is labeled for assistive technology.
Sandbox
You type the allow-* tokens yourself and look up what each one unlocks.
A checkbox for each token, with a plain explanation of what it allows.
Responsive size
You write the CSS for an aspect ratio or a fixed height.
Choose an aspect ratio or a fixed height; the code includes the sizing.
Can this page be embedded?
You find out after publishing, when the frame shows up empty.
Checks the page’s X-Frame-Options and frame-ancestors headers before you copy the code.
Video and form links
A YouTube watch page or a Google Form link pasted as-is may not load or may look wrong.
Recognizes YouTube, Vimeo and Google Form links and points you to the dedicated generator.

Attributes

Writing the iframe by hand

You need to remember each attribute name and its exact values.

This generator

Pick attributes from a list, with a short explanation next to each one.

Accessible title

Writing the iframe by hand

Often left out, so screen reader users don’t know what the frame contains.

This generator

Asks for a title so the frame is labeled for assistive technology.

Sandbox

Writing the iframe by hand

You type the allow-* tokens yourself and look up what each one unlocks.

This generator

A checkbox for each token, with a plain explanation of what it allows.

Responsive size

Writing the iframe by hand

You write the CSS for an aspect ratio or a fixed height.

This generator

Choose an aspect ratio or a fixed height; the code includes the sizing.

Can this page be embedded?

Writing the iframe by hand

You find out after publishing, when the frame shows up empty.

This generator

Checks the page’s X-Frame-Options and frame-ancestors headers before you copy the code.

Video and form links

Writing the iframe by hand

A YouTube watch page or a Google Form link pasted as-is may not load or may look wrong.

This generator

Recognizes YouTube, Vimeo and Google Form links and points you to the dedicated generator.

iframe attributes reference

What each attribute does and when to use it. Security tip: give third-party content the fewest permissions it needs.
Option
What it does
Values
Notes
src
The address of the page to show inside the frame.
A full URL
Use an https:// address. On an HTTPS site, browsers block frames that load over plain http://.
title
Labels the frame for screen readers.
Short text, e.g. “Store location map”
Describe the content briefly. Without it, people using assistive technology have to enter the frame to find out what’s inside.
width / height
Sets the frame size in pixels.
Numbers; without them the frame is 300 × 150
For a frame that scales with the page, use CSS (width: 100% and aspect-ratio) instead of fixed numbers.
loading
Controls when the browser loads the frame.
eager (default), lazy
lazy waits until the frame is close to the visible area, which speeds up the initial page load. Good for frames lower on the page.
allow
Grants the framed page access to browser features (permissions policy).
A list separated by semicolons, e.g. fullscreen; autoplay
Only list the features the content needs. Camera, microphone and geolocation deserve extra care.
allowfullscreen
Lets the frame switch to fullscreen.
Present or absent
A legacy attribute. The modern equivalent is allow="fullscreen"; many embed codes include both.
referrerpolicy
Controls how much of your page’s address is sent to the framed site.
no-referrer, origin, strict-origin-when-cross-origin (default) and others
The default sends only your domain to other sites. Avoid unsafe-url: it sends the full address, even to insecure sites.
sandbox
Applies strict restrictions to the framed page. Each allow-* token lifts one restriction.
Empty (all restrictions) or tokens such as allow-scripts, allow-forms, allow-popups
Use it for content you don’t fully trust. Don’t combine allow-scripts and allow-same-origin for a page from your own site: together they let the page remove the sandbox.

src

What it does

The address of the page to show inside the frame.

Values

A full URL

Notes

Use an https:// address. On an HTTPS site, browsers block frames that load over plain http://.

title

What it does

Labels the frame for screen readers.

Values

Short text, e.g. “Store location map”

Notes

Describe the content briefly. Without it, people using assistive technology have to enter the frame to find out what’s inside.

width / height

What it does

Sets the frame size in pixels.

Values

Numbers; without them the frame is 300 × 150

Notes

For a frame that scales with the page, use CSS (width: 100% and aspect-ratio) instead of fixed numbers.

loading

What it does

Controls when the browser loads the frame.

Values

eager (default), lazy

Notes

lazy waits until the frame is close to the visible area, which speeds up the initial page load. Good for frames lower on the page.

allow

What it does

Grants the framed page access to browser features (permissions policy).

Values

A list separated by semicolons, e.g. fullscreen; autoplay

Notes

Only list the features the content needs. Camera, microphone and geolocation deserve extra care.

allowfullscreen

What it does

Lets the frame switch to fullscreen.

Values

Present or absent

Notes

A legacy attribute. The modern equivalent is allow="fullscreen"; many embed codes include both.

referrerpolicy

What it does

Controls how much of your page’s address is sent to the framed site.

Values

no-referrer, origin, strict-origin-when-cross-origin (default) and others

Notes

The default sends only your domain to other sites. Avoid unsafe-url: it sends the full address, even to insecure sites.

sandbox

What it does

Applies strict restrictions to the framed page. Each allow-* token lifts one restriction.

Values

Empty (all restrictions) or tokens such as allow-scripts, allow-forms, allow-popups

Notes

Use it for content you don’t fully trust. Don’t combine allow-scripts and allow-same-origin for a page from your own site: together they let the page remove the sandbox.

MDN Web Docs: the iframe element ↗

Why a site doesn’t open in an iframe

The frame is empty or shows “refused to connect”.

The site sends an X-Frame-Options header. DENY blocks all framing; SAMEORIGIN allows it only on the site’s own pages. The site has forbidden embedding, and this can’t be bypassed from your side. Link to the page instead, or ask the site owner whether they offer an embed.

The site’s security policy blocks the frame.

The site sends Content-Security-Policy with frame-ancestors, which lists the sites allowed to embed it ('none' means nobody). When it’s present, browsers follow it instead of X-Frame-Options. Only the site owner can add your domain to the list.

The frame loads on its own but not on your HTTPS site.

The src starts with http://. Browsers block insecure frames on secure pages and don’t upgrade them automatically. Change the address to https://; if the site has no HTTPS version, it can’t be embedded on a secure page.

A YouTube link shows an error instead of the video.

Regular YouTube watch pages forbid framing. Use the video’s embed address (youtube.com/embed/…) or the dedicated YouTube generator.

The page loads, but buttons, forms or links inside it do nothing.

The sandbox attribute is blocking them. Add only the tokens you need: allow-scripts for interactive content, allow-forms to submit forms, allow-popups for links that open a new tab.

Video won’t go fullscreen, or the camera or microphone doesn’t work.

These features must be granted in the allow attribute, e.g. allow="fullscreen; camera; microphone".

Your site builder removes the code after saving.

Some editors strip iframes from regular text blocks. Paste the code into a custom HTML or embed block.

How to create an iframe

  1. Enter the page address

    Paste the URL of the page you want to show.

  2. Set size and behavior

    Choose the size, keep it responsive and allow scrolling or fullscreen if needed.

  3. Check the preview

    Some sites don’t allow being shown in a frame — the preview shows it right away.

  4. Copy the code

    Paste the code into an HTML block on your site.

Frequently asked questions

More Embed Code Generators