Feature status

A feature status provides developers with information about the implementation stage of the feature among browser vendors and is one of the following:

If none of the above statuses apply, then the feature is considered a stable and standard feature. We don't explicitly add this status to content pages. For more information on these terms, see the "Experimental, deprecated, and obsolete" page.

To see detailed instructions on how to choose a status for a feature, refer to the choosing status properties section in the @mdn/browser-compat-data (BCD) repository.

How to add or update feature statuses

The feature statuses of all the features documented on MDN are defined in its accompanying @mdn/browser-compat-data (BCD) repository entry and are automatically updated in the mdn/content repository whenever a new version of BCD is released.

Warning: Do not manually update feature statuses in the mdn/content repository. To update a feature's status, you need to submit a pull request in the BCD repository. After your changes are approved and merged in BCD, an automated pull request updates the statuses in the mdn/content repository.

The automation uses browser-compat key in the front-matter. The key stores BCD query required to locate the feature in the compatibility data. If the browser-compat key has multiple values then the automation uses only the first value to render status macros.

How are feature statuses specified in content?

The following sections document mechanisms using which feature statuses are rendered in MDN documents. As mentioned, you should consider these mechanisms read-only as their inclusion in the content is automated.

Feature status icons in sidebars

To show status icons for a feature listed in sidebars, the front-matter status property is used:

yml
---
title: Feature name
status:
  - experimental
  - non-standard
  - deprecated
browser-compat: api.feature
---

When sidebars are rendered, the code looks for the statuses in each page's front-matter. As mentioned before, these statuses are updated automatically; you do not need to change them manually.

Feature status page banners

The following macros are used to render the status banners in page headers:

{{SeeCompatTable}}

For experimental status. It generates an Experimental status banner:

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

{{Non-standard_Header}}

For non-standard status. It generates a Non-Standard status banner:

Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

{{Deprecated_Header}}

For deprecated status. It generates a Deprecated status banner:

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

Feature status icons in definition lists

The following macros are used to render inline status icons next to definition list items:

See also