Syllabus

HTML Plug-ins (Object & Embed Tags)

Badar KhalilUpdated September 27, 2026 2 min read

HTML Plug-ins: The <object> and <embed> Tags

The HTML object and embed tags (our focus keyword) are the original, general-purpose way to insert external resources — historically browser plug-ins like Adobe Flash or Java Applets, and today mostly PDFs or other embeddable documents — into a webpage. While plug-in technologies like Flash are now deprecated and removed from every modern browser, <object> and <embed> are still very much alive for embedding files such as PDFs directly in the page.

The <object> Tag

<object> is a container element that can embed images, PDFs, or other web resources using the data attribute for the file URL and type for its MIME type. It also supports fallback content placed between the opening and closing tags, shown only if the browser cannot render the resource.

Code

<object data="brochure.pdf" type="application/pdf" width="600" height="400">
  <p>Your browser can't display PDFs. <a href="brochure.pdf">Download it instead</a>.</p>
</object>

The <embed> Tag

<embed> is a simpler, self-closing alternative that also embeds external content, using src instead of data. Unlike <object>, it does not support fallback content between tags because it has no closing tag.

Code

<embed src="brochure.pdf" type="application/pdf" width="600" height="400">

Object vs Embed vs Iframe

<object> — best when you need graceful fallback content for unsupported browsers.
<embed> — simpler syntax, no fallback support, commonly used for quick PDF or media embeds.
<iframe> — best for embedding an entire separate HTML document or third-party widget (like YouTube), rather than a single file resource.

Historical Context: Flash and Plug-ins

For over a decade, <object> and <embed> were primarily used to load Adobe Flash (.swf) animations and games via the Flash Player plug-in. Adobe officially ended support for Flash Player in 2020, and no modern browser executes Flash content anymore. Any legacy site still referencing Flash content should migrate that content to HTML5 <video>, <canvas>, or JavaScript-based alternatives.

Modern Use Case: Embedding PDFs

Today, the most common practical use of these tags is embedding PDF documents (brochures, resumes, reports) directly in a page, so users can preview them without downloading a separate file first.

Try it Yourself HTML

<!-- Embedding a PDF with <object>, with a graceful fallback link -->
<object data='company-brochure.pdf' type='application/pdf' width='100%' height='500px'>
  <p>It appears your browser doesn't support embedded PDFs.
  <a href='company-brochure.pdf'>Click here to download the PDF</a> instead.</p>
</object>

Output

Press Run to execute.

Try it Yourself HTML

<!-- The simpler <embed> alternative (no fallback content possible) -->
<embed src='company-brochure.pdf' type='application/pdf' width='100%' height='500px'>

Output

Press Run to execute.

Exercise: Choose Object or EmbedJAVASCRIPT

You need to embed a resume PDF on a portfolio page, and you want a download link to show automatically if the browser can't render PDFs inline. Which tag, <object> or <embed>, should you use, and why? Write your answer as a comment.

Try it Yourself JAVASCRIPT

// Your answer here:

Output

Press Run to execute.

Show expected output

object, because it supports fallback content between its opening and closing tags, while embed does not.

This is a self-check — compare your result with the expected output above.

Was this page helpful?