<embed>: The Embed External Content element #

::: section-content The <embed> HTML element embeds external content at the specified point in the document. This content is provided by an external application or other source of interactive content such as a browser plug-in. :::

Try it #

::: section-content ::: iframe ::: {.output-header .border-rounded-top}

HTML Demo: <embed> #

Reset :::

::: {#warning-no-script .warning-container} ::: warning The interactive example cannot be shown because JavaScript is disabled. ::: :::

::: {#warning-mathml-not-supported .warning-container .hidden} ::: warning The interactive example cannot be shown because MathML is not supported by your browser. ::: :::

::: {#editor-container .editor-container .tabbed-standard .hidden .border-rounded-bottom editor-type=“tabbed”} ::: {#tab-container .section .tabs} ::: {#tablist .tab-list role=“tablist”} HTML

CSS

JavaScript :::

::: {#html-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“html” aria-hidden=“true”} ::: {#html-editor}::: :::

::: {#css-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“css” aria-hidden=“true”} ::: {#css-editor} ::: :::

::: {#js-panel .section .hidden tabindex=“0” role=“tabpanel” aria-labelledby=“js” aria-hidden=“true”} ::: {#js-editor} ::: ::: :::

::: {#output .output-container}

Output #

::: :::

::: {.section .console-container .hidden aria-hidden=“true”}

Console Output #

![] clear console

::: {#console .console} ::: :::

::: {#html-output .output .editor-tabbed} %html-content% ::: :::

::: {#sect1 .notecard .note} Note: This topic documents only the element that is defined as part of the HTML Living Standard{target="_blank"}. It does not address earlier, non-standardized implementation of the element. :::

Keep in mind that most modern browsers have deprecated and removed support for browser plug-ins, so relying upon <embed> is generally not wise if you want your site to be operable on the average user's browser. :::

Attributes #

::: section-content This element's attributes include the global attributes.

height: The displayed height of the resource, in CSS pixels{target="_blank"}. This must be an absolute value; percentages are not allowed.
src: The URL of the resource being embedded.
type: The MIME type to use to select the plug-in to instantiate.
width: The displayed width of the resource, in CSS pixels{target="_blank"}. This must be an absolute value; percentages are not allowed. :::

Usage notes #

::: section-content You can use the object-position property to adjust the positioning of the embedded object within the element's frame, and the object-fit property to control how the object's size is adjusted to fit within the frame. :::

Examples #

::: section-content ::: code-example [html]{.language-name}

<embed
  type="video/quicktime"
  src="movie.mov"
  width="640"
  height="480"
  title="Title of my video" />

::: :::

Accessibility concerns #

::: section-content Use the title attribute on an embed element to label its content so that people navigating with assistive technology such as a screen reader can understand what it contains. The title's value should concisely describe the embedded content. Without a title, they may not be able to determine what its embedded content is. This context shift can be confusing and time-consuming, especially if the embed element contains interactive content like video or audio. :::

Technical summary #

::: section-content

Content categories	Flow content, phrasing content, embedded content, interactive content, palpable content.
Permitted content	None; it is a void element.
Tag omission	Must have a start tag, and must not have an end tag.
Permitted parents	Any element that accepts embedded content.
Implicit ARIA role	No corresponding role
Permitted ARIA roles	`application`, `document`, `img`, `none`, `presentation`
DOM interface	`HTMLEmbedElement`

:::

Specifications #

::: _table #

Specification #

HTML Standard
[# the-embed-element]{.small}

:::

Browser compatibility #

::: _table Desktop Mobile

         Chrome    Edge   Firefox   Internet Explorer   Opera   Safari   WebView Android   Chrome Android   Firefox for Android   Opera Android   Safari on IOS   Samsung Internet

embed 1 12 1 Yes ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 align 1 79 1 No ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 height 1 12 1 ≤6 ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 name 1 12 1 ≤6 ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 src 1 12 1 ≤6 ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 type 1 79 1 No ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 width 1 12 1 ≤6 ≤12.1 ≤4 4.4 18 4 ≤12.1 ≤3.2 1.0 :::