What does the HTML codetype attribute do?

codetype on object or applet specifies the MIME content type of the embedded code when classid is used, helping the browser know what kind of plugin implementation to load.

What is the difference between codetype and type on object?

codetype describes the MIME type of code referenced by classid. type describes the MIME type of data referenced by the data attribute.

Is codetype still used in modern HTML?

No for new projects. codetype is obsolete along with Java applets and most browser plugins. Use iframe, video, or Web APIs instead.

HTML codetype Attribute

Q: Is codetype used on the code element?

No. codetype is not a valid attribute on the inline code element. It applies to object and applet for legacy embedded plugins.

Beginner

⏱️ 5 min read

📚 Updated: Jun 2026

🎯 2 Examples

Legacy & Embed

HTML codetype attribute tutorial — MIME type for embedded object code

Overview

Introduction

The codetype attribute in HTML is used with the <object> and obsolete <applet> elements to specify the MIME content type of the embedded code when classid is used. It tells the browser what kind of plugin or implementation to expect—for example, a Java applet. This attribute is part of the legacy plugin-embedding model and is not used in modern HTML5 development.

What You’ll Learn

object

Embed tag.

MIME type

Code format.

classid

Paired with.

vs type

Data MIME.

setAttribute

JS update.

vs <code>

Not inline.

Fundamentals

Purpose of `codetype` Attribute

The primary purpose of the codetype attribute is to provide metadata about the content type of the code referenced by classid on an embedded element. By declaring a MIME type such as application/java, developers could help user agents determine how to load and run legacy plugin-based content.

💡

Not the <code> element

codetype is not an attribute of the inline <code> HTML element used to mark up source snippets. It belongs on <object> and <applet> for embedded plugin code.

Foundation

📝 Syntax

Add codetype to an <object> or <applet> element with a valid MIME type:

codetype.html

<object classid="clsid:XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" codetype="application/x-java-applet" width="300" height="200">
  <p>Fallback content</p>
</object>

Syntax Rules

Used on <object> and obsolete <applet>.
Value is a MIME type string describing the embedded code format.
Typically paired with classid (and optionally codebase).
Do not confuse with type, which describes the MIME type of data.
Always include fallback content inside the element.

Reference

💎 Values

The codetype attribute accepts a MIME type value that defines the content type of the embedded code. Common legacy values include:

application/java — Java applet code.
application/x-java-applet — Java applet (alternate MIME).
application/x-shockwave-flash — Flash plugin content (legacy).

Java Applet Example

applet-codetype.html

<applet code="MyApplet.class" codetype="application/java" width="300" height="200">
  Your browser does not support Java applets.
</applet>

Object with classid

object-codetype.html

<object classid="clsid:XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX" codetype="application/x-java-applet">
  <p>Plugin not available.</p>
</object>

Cheat Sheet

⚡ Quick Reference

Aspect	Details	Modern Alternative
Elements	`<object>`, `<applet>`	`<iframe>`, `<video>`
Value type	MIME type of embedded code	`type` on `<script>` for modules
Pairs with	`classid`, `codebase`	`src` + `type` on media
vs `type`	Code MIME (with classid)	`type` = data MIME (with data)
JS access	`setAttribute("codetype", mime)`	Load modules or media APIs
HTML5 status	Obsolete	Avoid in new projects

Scope

Applicable Elements

Element	Supported?	Notes
`<object>`	Yes (legacy)	MIME type of code when `classid` is used
`<applet>`	Yes (obsolete)	Java applets; removed from HTML5
`<code>`	No	Inline code markup; codetype is not valid here
`<script>`	No	Use `type="module"` or default JS
`<embed>`	No	Uses `type` attribute instead

Hands-On

Examples Gallery

Object codetype MIME example and dynamic JavaScript setAttribute.

👀 Live Preview

Legacy <object> markup with codetype (modern browsers show fallback content):

object with codetype — Plugin embeds do not run in modern browsers. Fallback text appears instead.

Implementation Example

Let’s look at an example of how the codetype attribute is used in an HTML document:

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example</title>
</head>
<body>
  <p>Embedded Java applet (legacy):</p>
  <applet code="MyApplet.class" codetype="application/java" width="300" height="200">
    Your browser does not support Java applets.
  </applet>
</body>
</html>

Try It Yourself

How It Works

In this example, the codetype attribute is set to application/java on an <applet> element, indicating that the embedded code is a Java applet. Modern browsers ignore the plugin and display the fallback text instead.

Dynamic Values with JavaScript

You can dynamically set the codetype attribute using JavaScript when the MIME type must change based on conditions or user interactions:

index.html

<object id="dynamicObject" classid="clsid:Example-ID" width="200" height="100">
  Plugin not available.
</object>

<script>
  document.getElementById("dynamicObject")
    .setAttribute("codetype", "application/x-java-applet");
</script>

Try It Yourself

How It Works

In this script, the codetype attribute is dynamically set to application/x-java-applet on the object element with id dynamicObject using setAttribute.

A11y

♿ Accessibility

Provide fallback content — Always include accessible text inside <object> or <applet> when plugins fail.
Avoid plugin-only features — Do not rely on applets or plugins for essential functionality.
Use native HTML — Video, audio, canvas, and standard text are more accessible than legacy embeds.
Clear messaging — Tell users when embedded content is unavailable and offer an alternative.
Keyboard access — Plugin content often lacked proper keyboard and screen reader support.

🧠 How codetype Works

Author sets codetype

Add a MIME type on <object> or <applet> alongside classid or code.

Markup

Browser reads MIME

The user agent uses the MIME type to identify the expected plugin or code format.

Parse

Plugin loads code

Legacy browsers attempted to load the implementation from classid / codebase.

Plugin

Embedded plugin (legacy)

Modern browsers skip plugins and show fallback content instead.

Compatibility

Browser Support

The codetype attribute is obsolete. It was used with Java applets and other browser plugins that have been removed from all major browsers.

⚠️ Legacy · Obsolete

Not for new projects

Use <iframe>, <video>, ES modules, or Web APIs instead of plugin embeds.

Legacy Plugin era only

Google Chrome Plugins removed

Obsolete

Mozilla Firefox Plugins removed

Obsolete

Apple Safari Plugins removed

Obsolete

Microsoft Edge Plugins removed

Obsolete

codetype plugins Obsolete

Bottom line: Learn codetype for legacy maintenance only. Do not use plugin embeds in new web applications.

Pro Tips

💡 Best Practices

✅ Do

Use accurate MIME types for codetype when reading legacy markup
Pair codetype with classid on <object> as intended
Include fallback content inside embedded elements
Distinguish codetype from type and from the <code> element
Document legacy plugin dependencies when maintaining old intranet apps

❌ Don’t

Put codetype on the inline <code> element
Use plugin embeds or codetype in new public websites
Confuse codetype with type on the same object
Assume MIME types alone make plugins secure or supported
Skip fallback content when the embed fails

Accurate metadata: Use the codetype attribute to declare the correct MIME type for embedded code referenced by classid.
Appropriate values: Choose MIME types that match the actual plugin or code format in legacy documents.
Consistency: Be consistent when specifying codetype alongside related attributes like classid and codebase.

Wrap Up

Conclusion

The codetype attribute was a useful tool for specifying the content type of embedded code on <object> and <applet> elements in legacy HTML documents.

By understanding how this attribute works—and how it differs from the inline <code> element—developers can read and maintain older plugin-based pages. For new projects, use secure, widely supported HTML5 technologies instead.

View Examples Gallery Try applet example

Summary

Key Takeaways

Knowledge Unlocked

Five truths every developer should know about `codetype`

Bookmark these when reading legacy HTML.

Core concepts

🔌 01

MIME type

Code format.

Purpose

📦 02

object

Embed tag.

Element

📝 03

classid

Paired with.

⚙️ 04

vs type

Data MIME.

Compare

⚠️ 05

Not <code>

Inline tag.

Warning

❓ Frequently Asked Questions

What does codetype do?

It specifies the MIME content type of embedded code on <object> or <applet> when classid is used.

Is codetype used on the code element?

No. The inline <code> element does not support a codetype attribute. That was a common misconception in older tutorials.

What is the difference between codetype and type?

codetype is the MIME type of code (with classid). type is the MIME type of data (with data).

Which elements use codetype?

<object> and obsolete <applet>. It is not a global attribute.

Should I use codetype today?

No for new projects. Browser plugins and applets are obsolete. Use iframe, video, ES modules, or Web APIs instead.

How do I set codetype with JavaScript?

Use element.setAttribute("codetype", "application/java") on the object or applet element.

Understand legacy embedded code types

Explore the obsolete codetype attribute on <object> and <applet>, and learn why it is not used on the inline <code> element.

Try applet example →

About the author

Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

Experience 12 years building web and cloud systems
Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

5 people found this page helpful

HTML codebase Attribute HTML color Attribute

HTML codetype Attribute

Introduction

What You’ll Learn

object

MIME type

classid

vs type

setAttribute

vs <code>

Purpose of codetype Attribute

📝 Syntax

Syntax Rules

💎 Values

Java Applet Example

Object with classid

⚡ Quick Reference

Applicable Elements

Examples Gallery

👀 Live Preview

Implementation Example

How It Works

Dynamic Values with JavaScript

How It Works

♿ Accessibility

🧠 How codetype Works

Author sets codetype

Browser reads MIME

Plugin loads code

Embedded plugin (legacy)

Browser Support

Not for new projects

💡 Best Practices

✅ Do

❌ Don’t

Conclusion

Key Takeaways

Five truths every developer should know about codetype

MIME type

object

classid

vs type

Not <code>

❓ Frequently Asked Questions

🧩 Related HTML Topics

HTML codebase Attribute

HTML color Attribute

HTML classid Attribute

Try Applet Example

Understand legacy embedded code types

About the author

Purpose of `codetype` Attribute

Five truths every developer should know about `codetype`