The following features are newly available:
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
Iterator.concat() JavaScript method returns an iterator that yields values from a sequence of iterators, exhausting each iterator before moving on to the next.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
text-indent: each-line CSS declaration indents text after forced breaks as well as to the first line of a block.
text-indent: hanging CSS declaration indents all lines except the first.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are now widely available:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
The following features are now available in Chrome:
precommitHandler callback option to NavigateEvent's intercept() method returns a promise that defers navigation until the promise resolves. You can use this to change the navigation's URL, state, and history before navigation occurs.
CustomElementRegistry() constructor creates a new custom element registry that's separate from the global window.customElements registry. Creating more than one registry is useful for multiple custom elements that have the same tag name to coexist.
The following features are now available in Chrome Android:
precommitHandler callback option to NavigateEvent's intercept() method returns a promise that defers navigation until the promise resolves. You can use this to change the navigation's URL, state, and history before navigation occurs.
CustomElementRegistry() constructor creates a new custom element registry that's separate from the global window.customElements registry. Creating more than one registry is useful for multiple custom elements that have the same tag name to coexist.
The following features are now available in Edge:
precommitHandler callback option to NavigateEvent's intercept() method returns a promise that defers navigation until the promise resolves. You can use this to change the navigation's URL, state, and history before navigation occurs.
CustomElementRegistry() constructor creates a new custom element registry that's separate from the global window.customElements registry. Creating more than one registry is useful for multiple custom elements that have the same tag name to coexist.
The following features are now available in Firefox:
captureStream() method for <audio> and <video> elements returns a MediaStream for the media element's content. You can use this to record media or send it elsewhere, such as a canvas or WebRTC connection.
CloseWatcher API listens and responds to close requests on in-page components, such as modals, popovers, and sidebars.
popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
The following features are now available in Firefox for Android:
captureStream() method for <audio> and <video> elements returns a MediaStream for the media element's content. You can use this to record media or send it elsewhere, such as a canvas or WebRTC connection.
CloseWatcher API listens and responds to close requests on in-page components, such as modals, popovers, and sidebars.
popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
The following features are newly available:
getOrInsert() and getOrInsertComputed() methods of Map objects get a value, setting and getting a default value if needed.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now widely available:
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
The following features are now available in Chrome:
confidence property of a navigation timing entry describes whether the navigation metric is likely to be representative the page's performance (high confidence) or affected by transient conditions, such as browser startup (low confidence).
Origin object represents an origin, as in a scheme, hostname, and port. You can use it to make same-site and same-origin comparisons.
text-justify CSS property sets the justification method of text when text-align: justify is set.
The following features are now available in Chrome Android:
confidence property of a navigation timing entry describes whether the navigation metric is likely to be representative the page's performance (high confidence) or affected by transient conditions, such as browser startup (low confidence).
Origin object represents an origin, as in a scheme, hostname, and port. You can use it to make same-site and same-origin comparisons.
text-justify CSS property sets the justification method of text when text-align: justify is set.
The following features are now available in Edge:
confidence property of a navigation timing entry describes whether the navigation metric is likely to be representative the page's performance (high confidence) or affected by transient conditions, such as browser startup (low confidence).
Origin object represents an origin, as in a scheme, hostname, and port. You can use it to make same-site and same-origin comparisons.
text-justify CSS property sets the justification method of text when text-align: justify is set.
The following features are now available in Firefox:
hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
precommitHandler callback option to NavigateEvent's intercept() method returns a promise that defers navigation until the promise resolves. You can use this to change the navigation's URL, state, and history before navigation occurs.
overflow-clip-margin CSS property sets how far overflow content may appear outside the bounds of an element before it's clipped by effects such as overflow: clip.
Document.parseHTML() static method and the setHTML() method of Element and ShadowRoot objects parse and insert HTML into the DOM in a way that can prevent cross-site scripting attacks. The Sanitizer API can customize the sanitization process.
The following features are now available in Firefox for Android:
hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
precommitHandler callback option to NavigateEvent's intercept() method returns a promise that defers navigation until the promise resolves. You can use this to change the navigation's URL, state, and history before navigation occurs.
overflow-clip-margin CSS property sets how far overflow content may appear outside the bounds of an element before it's clipped by effects such as overflow: clip.
Document.parseHTML() static method and the setHTML() method of Element and ShadowRoot objects parse and insert HTML into the DOM in a way that can prevent cross-site scripting attacks. The Sanitizer API can customize the sanitization process.
The following features are newly available:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
The following features are now widely available:
animation-composition CSS property chooses how to combine animations that affect the same property.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
The following features are now available in Chrome:
caret-shape CSS property sets the shape of the insertion caret, the symbol that shows where the next character is to be inserted or deleted.
clipboardchange event for navigator.clipboard fires when the user modifies the clipboard's contents.
<geolocation> HTML element represents a button that, upon activation, prompts the user to choose whether to grant the page access to geolocation data.
Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The following features are now available in Chrome Android:
caret-shape CSS property sets the shape of the insertion caret, the symbol that shows where the next character is to be inserted or deleted.
clipboardchange event for navigator.clipboard fires when the user modifies the clipboard's contents.
<geolocation> HTML element represents a button that, upon activation, prompts the user to choose whether to grant the page access to geolocation data.
Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The following features are now available in Edge:
caret-shape CSS property sets the shape of the insertion caret, the symbol that shows where the next character is to be inserted or deleted.
clipboardchange event for navigator.clipboard fires when the user modifies the clipboard's contents.
<geolocation> HTML element represents a button that, upon activation, prompts the user to choose whether to grant the page access to geolocation data.
Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The following features are now available in Firefox:
import … with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts.
Iterator.concat() JavaScript method returns an iterator that yields values from a sequence of iterators, exhausting each iterator before moving on to the next.
The following features are now available in Firefox for Android:
import … with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts.
Iterator.concat() JavaScript method returns an iterator that yields values from a sequence of iterators, exhausting each iterator before moving on to the next.
The following features are newly available:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
@scope CSS at-rule sets the scope for a group of rules.
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollend event fires when an element or document has finished scrolling.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
The following features are now widely available:
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
window.print() method opens the browser's print dialog.
The following features are now available in Chrome:
@container anchored(fallback: …) at-rule apply styles to an element based on the element's anchor position.
font-language-override CSS property sets which language-specific glyphs are displayed.
The following features are now available in Chrome Android:
@container anchored(fallback: …) at-rule apply styles to an element based on the element's anchor position.
font-language-override CSS property sets which language-specific glyphs are displayed.
The following features are now available in Edge:
@container anchored(fallback: …) at-rule apply styles to an element based on the element's anchor position.
font-language-override CSS property sets which language-specific glyphs are displayed.
The following features are now available in Firefox:
contrast-color() CSS function picks a color that has guaranteed contrast against a specified foreground or background color.
The following features are now available in Firefox for Android:
contrast-color() CSS function picks a color that has guaranteed contrast against a specified foreground or background color.
The following features are now available in Safari:
field-sizing CSS property allows form controls such as <textarea> to be sized based on their content.
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
getOrInsert() and getOrInsertComputed() methods of Map objects get a value, setting and getting a default value if needed.
Math.sumPrecise() static method returns the sum of an iterable of numbers. It avoids the precision loss of intermediate partial sums, as found using reduce() or a loop to add together an array of values.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
random() CSS function chooses a random numeric value within a specified range. This allows for dynamic, randomized styling using CSS.
sibling-count() and sibling-index() CSS functions return integers that are useful to style elements based on their positions among siblings or on the number of siblings, for example as part of a calc() expression.
url() CSS function accepts a cross-origin() modifier to control cross-origin resource sharing (CORS) when requesting the URL. For example, url("https://example.com" cross-origin(anonymous))) does not send credentials to the URL.
url() CSS function accepts a referrer-policy() modifier to choose which referrer to send when requesting the URL. For example, `url("https://example.com" referrer-policy(no-referrer)) does not send a referrer to the URL.
The following features are now available in Safari on iOS:
field-sizing CSS property allows form controls such as <textarea> to be sized based on their content.
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
getOrInsert() and getOrInsertComputed() methods of Map objects get a value, setting and getting a default value if needed.
Math.sumPrecise() static method returns the sum of an iterable of numbers. It avoids the precision loss of intermediate partial sums, as found using reduce() or a loop to add together an array of values.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
random() CSS function chooses a random numeric value within a specified range. This allows for dynamic, randomized styling using CSS.
sibling-count() and sibling-index() CSS functions return integers that are useful to style elements based on their positions among siblings or on the number of siblings, for example as part of a calc() expression.
url() CSS function accepts a cross-origin() modifier to control cross-origin resource sharing (CORS) when requesting the URL. For example, url("https://example.com" cross-origin(anonymous))) does not send credentials to the URL.
url() CSS function accepts a referrer-policy() modifier to choose which referrer to send when requesting the URL. For example, `url("https://example.com" referrer-policy(no-referrer)) does not send a referrer to the URL.
The following features are newly available:
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
The following features are now widely available:
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
oklab() and oklch() functions.
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are now available in Firefox:
source property of a ToggleEvent object is the element which triggered the toggle event to fire for a popover, <dialog>, or <details> element, if applicable.
The following features are now available in Firefox for Android:
source property of a ToggleEvent object is the element which triggered the toggle event to fire for a popover, <dialog>, or <details> element, if applicable.
The following features are newly available:
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now widely available:
createConicGradient() methods draw a conic gradient to a 2D canvas.
roundRect() methods draw a rounded rectangle to a 2D canvas.
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
The following features are now available in Chrome:
interestfor HTML attribute, trigger events and actions on a target element when a user shows interest in the element, through behaviors such as hover, focus, or long-press. Pseudo-elements apply styles to sources and targets of interest.
"local-network-access" user permission (and certain actions that imply this permission, such as a fetch() request with { targetAddressSpace: "local" }) allows a site to send requests to servers on a user's local network.
:target-current CSS pseudo-class selects the active scroll marker (as in ::scroll-marker), while the :target-after and :target-before pseudo-classes select the inactive markers preceding and following the active scroll marker.
@container style() CSS at-rule and if(style()) CSS function queries accept a range syntax, such as >, <, >=, <=, to query for inexact values.
The following features are now available in Chrome Android:
interestfor HTML attribute, trigger events and actions on a target element when a user shows interest in the element, through behaviors such as hover, focus, or long-press. Pseudo-elements apply styles to sources and targets of interest.
"local-network-access" user permission (and certain actions that imply this permission, such as a fetch() request with { targetAddressSpace: "local" }) allows a site to send requests to servers on a user's local network.
:target-current CSS pseudo-class selects the active scroll marker (as in ::scroll-marker), while the :target-after and :target-before pseudo-classes select the inactive markers preceding and following the active scroll marker.
@container style() CSS at-rule and if(style()) CSS function queries accept a range syntax, such as >, <, >=, <=, to query for inexact values.
The following features are now available in Edge:
navigator.credentials credential management API.
getAllRecords() method of IDBObjectStore and IDBIndex return records and their primary keys from an IndexedDB store or index. The records can be read in batches and in reverse order. The getAllRecords() methods speed up read operations on large datasets.
interestfor HTML attribute, trigger events and actions on a target element when a user shows interest in the element, through behaviors such as hover, focus, or long-press. Pseudo-elements apply styles to sources and targets of interest.
"local-network-access" user permission (and certain actions that imply this permission, such as a fetch() request with { targetAddressSpace: "local" }) allows a site to send requests to servers on a user's local network.
:target-current CSS pseudo-class selects the active scroll marker (as in ::scroll-marker), while the :target-after and :target-before pseudo-classes select the inactive markers preceding and following the active scroll marker.
<script> element's integrity attribute.
@container style() CSS at-rule and if(style()) CSS function queries accept a range syntax, such as >, <, >=, <=, to query for inexact values.
The following features are now available in Firefox:
getOrInsert() and getOrInsertComputed() methods of Map objects get a value, setting and getting a default value if needed.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
moveBefore() DOM method relocates a node while preserving its state. For example, you can move the active element without losing focus, move an animated element without resetting the animation, or move an iframe without reloading its content.
screen.orientation.lock() method prevents changes to the screen orientation, typically in fullscreen applications such as games. For example, while locked, rotating a phone to the side won't change the screen orientation from landscape to portrait.
The following features are now available in Firefox for Android:
getOrInsert() and getOrInsertComputed() methods of Map objects get a value, setting and getting a default value if needed.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
moveBefore() DOM method relocates a node while preserving its state. For example, you can move the active element without losing focus, move an animated element without resetting the animation, or move an iframe without reloading its content.
screen.orientation.lock() method prevents changes to the screen orientation, typically in fullscreen applications such as games. For example, while locked, rotating a phone to the side won't change the screen orientation from landscape to portrait.
The following features are newly available:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
Uint8Array object methods fromBase64(), toBase64(), and setFromBase64() convert to and from base64 strings. The fromHex(), toHex(), and setFromHex() methods convert to and from hex strings.
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now widely available:
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font.
font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.
font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
attachInternals() method of HTMLElement and the ElementInternals API.
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
translate HTML attribute marks whether an element's text should be translated.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
The following features are now available in Chrome:
navigator.credentials credential management API.
getAllRecords() method of IDBObjectStore and IDBIndex return records and their primary keys from an IndexedDB store or index. The records can be read in batches and in reverse order. The getAllRecords() methods speed up read operations on large datasets.
CSS.highlights.highlightsFromPoint() method returns an array of Highlight objects at a specified point.
container option of the scrollIntoView() method sets which ancestor scroll container to scroll. The "nearest" value scrolls only the nearest ancestor, instead of the default "all".
scroll-target-group CSS property sets the container where anchor links act as scroll markers. Using selectors such as :target-current, you can style elements when a target has scrolled into view. It's an alternative to the ::scroll-marker-group pseudo-element, which generates scroll markers.
<script> element's integrity attribute.
source property of a ToggleEvent object is the element which triggered the toggle event to fire for a popover, <dialog>, or <details> element, if applicable.
The following features are now available in Chrome Android:
navigator.credentials credential management API.
getAllRecords() method of IDBObjectStore and IDBIndex return records and their primary keys from an IndexedDB store or index. The records can be read in batches and in reverse order. The getAllRecords() methods speed up read operations on large datasets.
CSS.highlights.highlightsFromPoint() method returns an array of Highlight objects at a specified point.
container option of the scrollIntoView() method sets which ancestor scroll container to scroll. The "nearest" value scrolls only the nearest ancestor, instead of the default "all".
scroll-target-group CSS property sets the container where anchor links act as scroll markers. Using selectors such as :target-current, you can style elements when a target has scrolled into view. It's an alternative to the ::scroll-marker-group pseudo-element, which generates scroll markers.
<script> element's integrity attribute.
source property of a ToggleEvent object is the element which triggered the toggle event to fire for a popover, <dialog>, or <details> element, if applicable.
The following features are now available in Edge:
CSS.highlights.highlightsFromPoint() method returns an array of Highlight objects at a specified point.
container option of the scrollIntoView() method sets which ancestor scroll container to scroll. The "nearest" value scrolls only the nearest ancestor, instead of the default "all".
scroll-target-group CSS property sets the container where anchor links act as scroll markers. Using selectors such as :target-current, you can style elements when a target has scrolled into view. It's an alternative to the ::scroll-marker-group pseudo-element, which generates scroll markers.
source property of a ToggleEvent object is the element which triggered the toggle event to fire for a popover, <dialog>, or <details> element, if applicable.
The following features are now available in Safari:
contrast-color() CSS function picks a color that has guaranteed contrast against a specified foreground or background color.
navigator.credentials credential management API.
progress() CSS function returns a ratio for the relative position of one value between two other values, clamped between 0 and 1. You can use it to interpolate a value for other calculations.
CustomElementRegistry() constructor creates a new custom element registry that's separate from the global window.customElements registry. Creating more than one registry is useful for multiple custom elements that have the same tag name to coexist.
animation-timeline, scroll-timeline, and view-timeline CSS properties advance animations based on the user's scroll position.
text-wrap: pretty CSS declaration prioritizes better layout over speed when text is broken into multiple lines.
signalUnknownCredential(), signalAllAcceptedCredentials(), and signalCurrentUserDetails() methods of PublicKeyCredential inform authenticators of the state of public key credentials, so that incorrect or revoked credentials may be updated, removed, or hidden.
navigator.gpu API performs operations such as rendering and computation on dedicated graphics hardware (also known as a Graphics Processing Unit).
The following features are now available in Safari on iOS:
contrast-color() CSS function picks a color that has guaranteed contrast against a specified foreground or background color.
navigator.credentials credential management API.
progress() CSS function returns a ratio for the relative position of one value between two other values, clamped between 0 and 1. You can use it to interpolate a value for other calculations.
CustomElementRegistry() constructor creates a new custom element registry that's separate from the global window.customElements registry. Creating more than one registry is useful for multiple custom elements that have the same tag name to coexist.
animation-timeline, scroll-timeline, and view-timeline CSS properties advance animations based on the user's scroll position.
text-wrap: pretty CSS declaration prioritizes better layout over speed when text is broken into multiple lines.
signalUnknownCredential(), signalAllAcceptedCredentials(), and signalCurrentUserDetails() methods of PublicKeyCredential inform authenticators of the state of public key credentials, so that incorrect or revoked credentials may be updated, removed, or hidden.
navigator.gpu API performs operations such as rendering and computation on dedicated graphics hardware (also known as a Graphics Processing Unit).
The following features are newly available:
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
The following features are now widely available:
color-gamut media query sets styles based on the colors a device can display.
@container at-rule apply styles to an element based on the dimensions of its container.
The following features are now available in Chrome:
corner-shape CSS property sets the shape of an element's corners when using border-radius, allowing for shapes other than rounded corners. For example, corner-shape: squircle is a shape in between a square and rounded corner.
@function CSS at-rule defines a custom function that takes CSS values or custom properties as arguments, and returns a CSS value. It can be based on conditional logic such as by using the @media at-rule.
payment extension of a web authentication credential allows a relying party (such as a bank) to create a credential that can be queried by any merchant origin as part of an online checkout that uses the Payment Request API's secure-payment-confirmation payment method. Also known as SPC.
SpeechRecognition API converts audio into text using the device's speech recognition service.
The following features are now available in Chrome Android:
corner-shape CSS property sets the shape of an element's corners when using border-radius, allowing for shapes other than rounded corners. For example, corner-shape: squircle is a shape in between a square and rounded corner.
@function CSS at-rule defines a custom function that takes CSS values or custom properties as arguments, and returns a CSS value. It can be based on conditional logic such as by using the @media at-rule.
payment extension of a web authentication credential allows a relying party (such as a bank) to create a credential that can be queried by any merchant origin as part of an online checkout that uses the Payment Request API's secure-payment-confirmation payment method. Also known as SPC.
SpeechRecognition API converts audio into text using the device's speech recognition service.
The following features are now available in Edge:
corner-shape CSS property sets the shape of an element's corners when using border-radius, allowing for shapes other than rounded corners. For example, corner-shape: squircle is a shape in between a square and rounded corner.
@function CSS at-rule defines a custom function that takes CSS values or custom properties as arguments, and returns a CSS value. It can be based on conditional logic such as by using the @media at-rule.
payment extension of a web authentication credential allows a relying party (such as a bank) to create a credential that can be queried by any merchant origin as part of an online checkout that uses the Payment Request API's secure-payment-confirmation payment method. Also known as SPC.
SpeechRecognition API converts audio into text using the device's speech recognition service.
The following features are now available in Firefox:
scheduler API provides a way to prioritize all tasks belonging to an application.
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now available in Firefox for Android:
scheduler API provides a way to prioritize all tasks belonging to an application.
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now widely available:
The following features are now available in Firefox:
closedby HTML attribute for <dialog> sets which user actions close a dialog. For example, closedby="any" allows the dialog to be closed by clicking outside of it.
using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
font-variant-emoji CSS property sets the default presentation for emoji characters.
The following features are now available in Firefox for Android:
closedby HTML attribute for <dialog> sets which user actions close a dialog. For example, closedby="any" allows the dialog to be closed by clicking outside of it.
using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
font-variant-emoji CSS property sets the default presentation for emoji characters.
The following features are newly available:
abs() and sign() CSS functions compute the absolute value or the sign of the input.
The following features are now widely available:
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Chrome:
LanguageDetector API identifies the likely natural language that some text is written in. You can use this API to supplement machine translation when the source source language is not known.
progress() CSS function returns a ratio for the relative position of one value between two other values, clamped between 0 and 1. You can use it to interpolate a value for other calculations.
sibling-count() and sibling-index() CSS functions return integers that are useful to style elements based on their positions among siblings or on the number of siblings, for example as part of a calc() expression.
stretch CSS keyword expands a box as needed to fit its contents until the maximum size is reached, without preserving the content's preferred aspect ratio.
Summarizer API uses an on-device language model to summarize text.
Translator API translates some text from one natural language to another, using machine translation.
viewport.segments API, allow you to adapt your layout to devices where the display is split, such as on foldable devices.
The following features are now available in Chrome Android:
progress() CSS function returns a ratio for the relative position of one value between two other values, clamped between 0 and 1. You can use it to interpolate a value for other calculations.
sibling-count() and sibling-index() CSS functions return integers that are useful to style elements based on their positions among siblings or on the number of siblings, for example as part of a calc() expression.
stretch CSS keyword expands a box as needed to fit its contents until the maximum size is reached, without preserving the content's preferred aspect ratio.
viewport.segments API, allow you to adapt your layout to devices where the display is split, such as on foldable devices.
The following features are now available in Edge:
progress() CSS function returns a ratio for the relative position of one value between two other values, clamped between 0 and 1. You can use it to interpolate a value for other calculations.
sibling-count() and sibling-index() CSS functions return integers that are useful to style elements based on their positions among siblings or on the number of siblings, for example as part of a calc() expression.
stretch CSS keyword expands a box as needed to fit its contents until the maximum size is reached, without preserving the content's preferred aspect ratio.
viewport.segments API, allow you to adapt your layout to devices where the display is split, such as on foldable devices.
The following features are newly available:
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
The following features are now widely available:
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
The following features are now available in Chrome:
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
if() CSS function is an inline conditional value that returns a value based on a set of conditions.
reading-flow CSS property sets the order in which flex or grid elements are rendered to speech or reached via focus navigation. The reading-order property overrides this order.
exnref.
The following features are now available in Chrome Android:
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
if() CSS function is an inline conditional value that returns a value based on a set of conditions.
reading-flow CSS property sets the order in which flex or grid elements are rendered to speech or reached via focus navigation. The reading-order property overrides this order.
exnref.
The following features are now available in Edge:
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
dynamic-range-limit CSS property controls the peak luminance of high dynamic range content. You can use this to coordinate the apparent brightness of HDR and SDR content.
if() CSS function is an inline conditional value that returns a value based on a set of conditions.
reading-flow CSS property sets the order in which flex or grid elements are rendered to speech or reached via focus navigation. The reading-order property overrides this order.
The following features are now available in Firefox:
Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The following features are now available in Firefox for Android:
Temporal API allows you to work with dates, times, time zones, and durations. It is more powerful than the Date API.
The following features are newly available:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
The following features are now widely available:
grid-template-columns and grid-template-rows CSS properties.
ic CSS length unit corresponds to the width of CJK ideographic characters.
The following features are now available in Chrome:
::column CSS pseudo-element represents the individual columns of a multi-column layout container. Columns can only be styled with scroll snap CSS properties and can also have a ::scroll-marker pseudo-element, which scrolls to the column when activated.
<select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.
dynamic-range-limit CSS property controls the peak luminance of high dynamic range content. You can use this to coordinate the apparent brightness of HDR and SDR content.
fetchLater() method requests a deferred fetch sent at an unknown time. The browser chooses a reliable time to send the request, ideally when the document is unloaded, and ignores the response. This API is useful for sending beacons to a server without expecting a particular response.
interactivity: inert CSS declaration makes an element and its descendants inert, like when using the inert HTML attribute. Inert elements can't be focused or clicked, their text can't be selected or found using the browser's find-in-page feature.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
when() method on a event target returns an Observable object, which provides a declarative API for subscribing to and operating on events. It's an alternative to addEventListener() callbacks.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
::scroll-marker CSS pseudo-element selects a scroll marker in a ::scroll-marker-group pseudo-element, generated before or after the scroll container. You can use them to navigate and style tables of contents, tab panels, and carousels.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
The following features are now available in Chrome Android:
::column CSS pseudo-element represents the individual columns of a multi-column layout container. Columns can only be styled with scroll snap CSS properties and can also have a ::scroll-marker pseudo-element, which scrolls to the column when activated.
<select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.
dynamic-range-limit CSS property controls the peak luminance of high dynamic range content. You can use this to coordinate the apparent brightness of HDR and SDR content.
fetchLater() method requests a deferred fetch sent at an unknown time. The browser chooses a reliable time to send the request, ideally when the document is unloaded, and ignores the response. This API is useful for sending beacons to a server without expecting a particular response.
interactivity: inert CSS declaration makes an element and its descendants inert, like when using the inert HTML attribute. Inert elements can't be focused or clicked, their text can't be selected or found using the browser's find-in-page feature.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
when() method on a event target returns an Observable object, which provides a declarative API for subscribing to and operating on events. It's an alternative to addEventListener() callbacks.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
::scroll-marker CSS pseudo-element selects a scroll marker in a ::scroll-marker-group pseudo-element, generated before or after the scroll container. You can use them to navigate and style tables of contents, tab panels, and carousels.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
The following features are now available in Edge:
::column CSS pseudo-element represents the individual columns of a multi-column layout container. Columns can only be styled with scroll snap CSS properties and can also have a ::scroll-marker pseudo-element, which scrolls to the column when activated.
<select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.
fetchLater() method requests a deferred fetch sent at an unknown time. The browser chooses a reliable time to send the request, ideally when the document is unloaded, and ignores the response. This API is useful for sending beacons to a server without expecting a particular response.
interactivity: inert CSS declaration makes an element and its descendants inert, like when using the inert HTML attribute. Inert elements can't be focused or clicked, their text can't be selected or found using the browser's find-in-page feature.
command and commandfor attributes for the <button> HTML element dispatch an action to an element when the button is invoked (by click or keystroke), as a declarative alternative to addEventListener() calls or onclick attribute handlers.
when() method on a event target returns an Observable object, which provides a declarative API for subscribing to and operating on events. It's an alternative to addEventListener() callbacks.
::scroll-marker CSS pseudo-element selects a scroll marker in a ::scroll-marker-group pseudo-element, generated before or after the scroll container. You can use them to navigate and style tables of contents, tab panels, and carousels.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
The following features are now available in Firefox:
Clear-Site-Data header deletes browsing data (such as cookies, storage, or cache) associated with the requesting website.
hyphenate-limit-chars CSS property sets the number of characters in a word before it is hyphenated and the minimum number of characters on either side of the hyphen.
Error.isError() static method checks whether a value is an Error object.
Math.sumPrecise() static method returns the sum of an iterable of numbers. It avoids the precision loss of intermediate partial sums, as found using reduce() or a loop to add together an array of values.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
The following features are now available in Firefox for Android:
Clear-Site-Data header deletes browsing data (such as cookies, storage, or cache) associated with the requesting website.
hyphenate-limit-chars CSS property sets the number of characters in a word before it is hyphenated and the minimum number of characters on either side of the hyphen.
Error.isError() static method checks whether a value is an Error object.
Math.sumPrecise() static method returns the sum of an iterable of numbers. It avoids the precision loss of intermediate partial sums, as found using reduce() or a loop to add together an array of values.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
The following features are newly available:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
The following features are now widely available:
contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
offset CSS property animates an element along a defined motion path.
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
The following features are now available in Chrome:
closedby HTML attribute for <dialog> sets which user actions close a dialog. For example, closedby="any" allows the dialog to be closed by clicking outside of it.
using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
Error.isError() static method checks whether a value is an Error object.
name="application-title" attribute for the <meta> HTML element sets an installed web application's title bar text.
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
withLock option to set(), append(), delete(), clear(), and batchUpdate() methods of the sharedStorage API prevents duplicate reporting from cross-site race conditions.
The following features are now available in Chrome Android:
closedby HTML attribute for <dialog> sets which user actions close a dialog. For example, closedby="any" allows the dialog to be closed by clicking outside of it.
using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
Error.isError() static method checks whether a value is an Error object.
name="application-title" attribute for the <meta> HTML element sets an installed web application's title bar text.
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
withLock option to set(), append(), delete(), clear(), and batchUpdate() methods of the sharedStorage API prevents duplicate reporting from cross-site race conditions.
The following features are now available in Edge:
closedby HTML attribute for <dialog> sets which user actions close a dialog. For example, closedby="any" allows the dialog to be closed by clicking outside of it.
window.getDigitalGoodsService API connects to stores or billing services for in-app products and subscriptions.
using and await using declarations and the dispose and asyncDispose symbols manage the lifecycle of resources such as file handles and streams. The DisposableStack and AsyncDisposableStack objects can group, dispose, and coordinate dependencies between multiple disposable resources.
Error.isError() static method checks whether a value is an Error object.
name="application-title" attribute for the <meta> HTML element sets an installed web application's title bar text.
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
withLock option to set(), append(), delete(), clear(), and batchUpdate() methods of the sharedStorage API prevents duplicate reporting from cross-site race conditions.
The following features are now available in Firefox:
autocorrect global HTML attribute controls whether to automatically correct spelling or punctuation errors for user input.
:has-slotted CSS pseudo-class matches <slot> elements where the fallback content is not shown. The pseudo-class matches any slotted content, including white space, text nodes, or elements.
:open CSS pseudo-class matches elements that have open states, like <details>, <dialog>, or <select>, based on their state.
The following features are now available in Firefox for Android:
autocorrect global HTML attribute controls whether to automatically correct spelling or punctuation errors for user input.
:has-slotted CSS pseudo-class matches <slot> elements where the fallback content is not shown. The pseudo-class matches any slotted content, including white space, text nodes, or elements.
:open CSS pseudo-class matches elements that have open states, like <details>, <dialog>, or <select>, based on their state.
The following features are now available in Safari:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
font-width CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
alpha and colorspace attributes for <input type=color>:
The ability to control the opacity of a color picked using <input type="color"> and determine the colorspace of the selected color.
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
exnref.
The following features are now available in Safari on iOS:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
alpha and colorspace attributes for <input type=color>:
The ability to control the opacity of a color picked using <input type="color"> and determine the colorspace of the selected color.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
requestClose() method of a <dialog> HTML element closes the dialog, firing a cancel event first, which listeners can use to prevent the dialog from closing. This differs from the close() method, which only fires the non-cancelable close event.
shape() CSS function creates shapes with a series of commands like line, move, and curve. It can be used with clip-path and shape-outside.
exnref.
The following features are now widely available:
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
The following features are now available in Chrome:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
@container scroll-state(...) at-rule apply styles to an element based on the sticky positioning, snapped, and scrollable state of the container.
moveBefore() DOM method relocates a node while preserving its state. For example, you can move the active element without losing focus, move an animated element without resetting the animation, or move an iframe without reloading its content.
:open CSS pseudo-class matches elements that have open states, like <details>, <dialog>, or <select>, based on their state.
popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
scroll-initial-target: nearest CSS declaration sets the initial scroll position of its scroll container to the top of the element, much like scrolling to a URL fragment.
text-box CSS property sets the spacing above and below text based on a font's typographic features. For example, text-box: trim-both ex alphabetic trims the top to the top of the letter x and the bottom to the bottom of most letters, without descenders.
The following features are now available in Chrome Android:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
@container scroll-state(...) at-rule apply styles to an element based on the sticky positioning, snapped, and scrollable state of the container.
moveBefore() DOM method relocates a node while preserving its state. For example, you can move the active element without losing focus, move an animated element without resetting the animation, or move an iframe without reloading its content.
:open CSS pseudo-class matches elements that have open states, like <details>, <dialog>, or <select>, based on their state.
popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
scroll-initial-target: nearest CSS declaration sets the initial scroll position of its scroll container to the top of the element, much like scrolling to a URL fragment.
text-box CSS property sets the spacing above and below text based on a font's typographic features. For example, text-box: trim-both ex alphabetic trims the top to the top of the letter x and the bottom to the bottom of most letters, without descenders.
The following features are now available in Edge:
Atomics.pause() static method gives a hint to the CPU that the code calling the method is in a short-duration wait for shared memory, known as spinning or a spinlock.
@container scroll-state(...) at-rule apply styles to an element based on the sticky positioning, snapped, and scrollable state of the container.
moveBefore() DOM method relocates a node while preserving its state. For example, you can move the active element without losing focus, move an animated element without resetting the animation, or move an iframe without reloading its content.
:open CSS pseudo-class matches elements that have open states, like <details>, <dialog>, or <select>, based on their state.
popover="hint" global HTML attribute creates a popover that is subordinate to popovers with a popover="auto" attribute. You can use this to create tooltips that don't dismiss auto popovers.
scroll-initial-target: nearest CSS declaration sets the initial scroll position of its scroll container to the top of the element, much like scrolling to a URL fragment.
text-box CSS property sets the spacing above and below text based on a font's typographic features. For example, text-box: trim-both ex alphabetic trims the top to the top of the letter x and the bottom to the bottom of most letters, without descenders.
The following features are now available in Firefox:
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
The following features are now available in Firefox for Android:
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
The following features are newly available:
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
The following features are now widely available:
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
The following features are now available in Chrome:
device-posture CSS media feature reflect the physical posture of a device, such as whether a foldable device is folded or unfolded.
restrictTo() method on screen capture media tracks limits capture to a specific element, excluding content which might occlude the element itself, such as video conferencing controls.
signalUnknownCredential(), signalAllAcceptedCredentials(), and signalCurrentUserDetails() methods of PublicKeyCredential inform authenticators of the state of public key credentials, so that incorrect or revoked credentials may be updated, removed, or hidden.
The following features are now available in Chrome Android:
device-posture CSS media feature reflect the physical posture of a device, such as whether a foldable device is folded or unfolded.
showOpenFilePicker(), showDirectoryPicker(), and showSaveFilePicker() methods request access to files and directories on the user's device and returns a handle for reading and writing to them.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
signalUnknownCredential(), signalAllAcceptedCredentials(), and signalCurrentUserDetails() methods of PublicKeyCredential inform authenticators of the state of public key credentials, so that incorrect or revoked credentials may be updated, removed, or hidden.
The following features are now available in Edge:
device-posture CSS media feature reflect the physical posture of a device, such as whether a foldable device is folded or unfolded.
restrictTo() method on screen capture media tracks limits capture to a specific element, excluding content which might occlude the element itself, such as video conferencing controls.
signalUnknownCredential(), signalAllAcceptedCredentials(), and signalCurrentUserDetails() methods of PublicKeyCredential inform authenticators of the state of public key credentials, so that incorrect or revoked credentials may be updated, removed, or hidden.
The following features are now available in Firefox:
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
String API and adapt it to be efficiently callable without JavaScript glue code.
The following features are now available in Firefox for Android:
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
String API and adapt it to be efficiently callable without JavaScript glue code.
The following features are newly available:
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
scrollbar-width CSS property sets the width of the scrollbar.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
The following features are now widely available:
The following features are now available in Safari:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
background-clip: border-area CSS declaration draws the background underneath only the border of an element.
blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
@view-transition CSS rule sets whether a document opts-in to transitions between documents in a multi-page application. Both the old and new document must opt-in for a transition to be triggered.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
ruby-overhang CSS property sets whether ruby annotations may overlap adjacent text.
text-box CSS property sets the spacing above and below text based on a font's typographic features. For example, text-box: trim-both ex alphabetic trims the top to the top of the letter x and the bottom to the bottom of most letters, without descenders.
Uint8Array object methods fromBase64(), toBase64(), and setFromBase64() convert to and from base64 strings. The fromHex(), toHex(), and setFromHex() methods convert to and from hex strings.
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now available in Safari on iOS:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
background-clip: border-area CSS declaration draws the background underneath only the border of an element.
blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
@view-transition CSS rule sets whether a document opts-in to transitions between documents in a multi-page application. Both the old and new document must opt-in for a transition to be triggered.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
RegExp.escape() static method takes a string and replaces any characters that are potentially special characters of a regular expression with equivalent escape sequences. For example, RegExp.escape("[abc]") returns "\\[abc\\]".
ruby-overhang CSS property sets whether ruby annotations may overlap adjacent text.
text-box CSS property sets the spacing above and below text based on a font's typographic features. For example, text-box: trim-both ex alphabetic trims the top to the top of the letter x and the bottom to the bottom of most letters, without descenders.
Uint8Array object methods fromBase64(), toBase64(), and setFromBase64() convert to and from base64 strings. The fromHex(), toHex(), and setFromHex() methods convert to and from hex strings.
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now widely available:
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
The following features are now available in Chrome:
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
font-variant-emoji CSS property sets the default presentation for emoji characters.
XRHand object, from the hand attribute of an XRInputSource object, represents a WebXR session's fully-articulated hand tracking model.
The following features are now available in Chrome Android:
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
font-variant-emoji CSS property sets the default presentation for emoji characters.
XRHand object, from the hand attribute of an XRInputSource object, represents a WebXR session's fully-articulated hand tracking model.
The following features are now available in Edge:
::details-content pseudo-element selects the expandable content of a <details> element, excluding the <summary>.
font-variant-emoji CSS property sets the default presentation for emoji characters.
The following features are now available in Firefox:
Uint8Array object methods fromBase64(), toBase64(), and setFromBase64() convert to and from base64 strings. The fromHex(), toHex(), and setFromHex() methods convert to and from hex strings.
The following features are now available in Firefox for Android:
Uint8Array object methods fromBase64(), toBase64(), and setFromBase64() convert to and from base64 strings. The fromHex(), toHex(), and setFromHex() methods convert to and from hex strings.
The following features are newly available:
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are now widely available:
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
The following features are now available in Chrome:
box-decoration-break CSS property sets whether box decorations, such as borders or backgrounds, of an element divided across a page, column, or region wraps each fragment or splits across the break.
Intl.Locale API provide supplemental information about a Unicode locale, such as the locale's calendar (for example, the first day in a week or the weekend start day), writing direction, 12- or 24-hour cycles, and numbering system.
justify-self CSS property aligns an item along a container's inline axis in block layouts, like it does in grid layouts. Likewise, the justify-items property sets a default justify-self value for all items in a container in a block layout.
String API and adapt it to be efficiently callable without JavaScript glue code.
The following features are now available in Chrome Android:
box-decoration-break CSS property sets whether box decorations, such as borders or backgrounds, of an element divided across a page, column, or region wraps each fragment or splits across the break.
Intl.Locale API provide supplemental information about a Unicode locale, such as the locale's calendar (for example, the first day in a week or the weekend start day), writing direction, 12- or 24-hour cycles, and numbering system.
justify-self CSS property aligns an item along a container's inline axis in block layouts, like it does in grid layouts. Likewise, the justify-items property sets a default justify-self value for all items in a container in a block layout.
String API and adapt it to be efficiently callable without JavaScript glue code.
The following features are now available in Edge:
box-decoration-break CSS property sets whether box decorations, such as borders or backgrounds, of an element divided across a page, column, or region wraps each fragment or splits across the break.
Intl.Locale API provide supplemental information about a Unicode locale, such as the locale's calendar (for example, the first day in a week or the weekend start day), writing direction, 12- or 24-hour cycles, and numbering system.
justify-self CSS property aligns an item along a container's inline axis in block layouts, like it does in grid layouts. Likewise, the justify-items property sets a default justify-self value for all items in a container in a block layout.
String API and adapt it to be efficiently callable without JavaScript glue code.
The following features are now available in Firefox:
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
exnref.
The following features are now available in Firefox for Android:
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
exnref.
The following features are newly available:
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
The following features are now widely available:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
@layer CSS at-rule avoids specificity conflicts by providing priority levels for different groups of CSS rules, such as low-priority styles like resets, and high-priority styles like UI components.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
<dialog> HTML element represents a modal or non-modal dialog box, such as a confirmation prompt or a subwindow used to enter data.
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are now available in Chrome:
calc-size() CSS function computes mathematical expressions that include height and width keyword values, for example calc-size(fit-content, size / 2). Not to be confused with the calc() CSS function, which cannot use keyword values.
interpolate-size CSS property sets whether animations and transitions interpolate between a numeric value and a keyword value, such as from a fixed length to auto or fit-content.
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
scheduler API provides a way to prioritize all tasks belonging to an application.
scrollsnapchanging and scrollsnapchange events fire when a scroll gesture changes the selected scroll snap target.
CreateVirtualPressureSource WebDriver command creates artificial sources of compute pressure for testing without the need real device sources of compute pressure.
The following features are now available in Chrome Android:
calc-size() CSS function computes mathematical expressions that include height and width keyword values, for example calc-size(fit-content, size / 2). Not to be confused with the calc() CSS function, which cannot use keyword values.
interpolate-size CSS property sets whether animations and transitions interpolate between a numeric value and a keyword value, such as from a fixed length to auto or fit-content.
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
scheduler API provides a way to prioritize all tasks belonging to an application.
scrollsnapchanging and scrollsnapchange events fire when a scroll gesture changes the selected scroll snap target.
CreateVirtualPressureSource WebDriver command creates artificial sources of compute pressure for testing without the need real device sources of compute pressure.
The following features are now available in Edge:
calc-size() CSS function computes mathematical expressions that include height and width keyword values, for example calc-size(fit-content, size / 2). Not to be confused with the calc() CSS function, which cannot use keyword values.
interpolate-size CSS property sets whether animations and transitions interpolate between a numeric value and a keyword value, such as from a fixed length to auto or fit-content.
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
scheduler API provides a way to prioritize all tasks belonging to an application.
scrollsnapchanging and scrollsnapchange events fire when a scroll gesture changes the selected scroll snap target.
CreateVirtualPressureSource WebDriver command creates artificial sources of compute pressure for testing without the need real device sources of compute pressure.
The following features are now available in Firefox:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
The following features are now available in Firefox for Android:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
The following features are now available in Safari:
@container at-rule apply styles to an element based on the values of custom properties of its container.
display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.
MediaStreamTrackProcessor and MediaStreamTrackGenerator APIs modify the contents of a media track for merging streams, applying real-time effects like funny hats, and content overlays.
writingsuggestions HTML attribute turns on or off a browser's writing suggestions. Writing suggestions vary by browser. For example, if turned on then a browser might show inline text completions accepted by pressing Tab.
The following features are now available in Safari on iOS:
@container at-rule apply styles to an element based on the values of custom properties of its container.
display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.
MediaStreamTrackProcessor and MediaStreamTrackGenerator APIs modify the contents of a media track for merging streams, applying real-time effects like funny hats, and content overlays.
writingsuggestions HTML attribute turns on or off a browser's writing suggestions. Writing suggestions vary by browser. For example, if turned on then a browser might show inline text completions accepted by pressing Tab.
The following features are newly available:
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
The following features are now widely available:
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
The following features are now available in Chrome:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
The following features are now available in Chrome Android:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
The following features are now available in Edge:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
Promise.try() static method returns a promise that takes a callback of any kind (returns or throws, synchronously or asynchronously) and wraps its result in a Promise.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
The following features are now available in Firefox:
The following features are now available in Firefox for Android:
The following features are newly available:
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
The following features are now widely available:
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
The following features are now available in Firefox:
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
The following features are now available in Firefox for Android:
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
The following features are newly available:
navigator.clipboard API asynchronously reads and writes to the system clipboard.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
The following features are now widely available:
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
The following features are now available in Chrome:
CloseWatcher API listens and responds to close requests on in-page components, such as modals, popovers, and sidebars.
@view-transition CSS rule sets whether a document opts-in to transitions between documents in a multi-page application. Both the old and new document must opt-in for a transition to be triggered.
<fencedframe> element embeds another HTML page into the current page in a more secure and privacy-preserving way than <iframe> elements.
sharedStorage API stores data to a shared space where the data can then be processed without the ability to track users across the different sites they visit. A common use case is measuring the reach of third-party ads without using user-tracking cookies.
sizes="auto" attribute for the <img> HTML element sets the layout size for the image based on the computed layout size when choosing a source from the srcset. This attribute only applies to images with the loading="lazy" attribute.
The following features are now available in Chrome Android:
CloseWatcher API listens and responds to close requests on in-page components, such as modals, popovers, and sidebars.
@view-transition CSS rule sets whether a document opts-in to transitions between documents in a multi-page application. Both the old and new document must opt-in for a transition to be triggered.
<fencedframe> element embeds another HTML page into the current page in a more secure and privacy-preserving way than <iframe> elements.
sharedStorage API stores data to a shared space where the data can then be processed without the ability to track users across the different sites they visit. A common use case is measuring the reach of third-party ads without using user-tracking cookies.
sizes="auto" attribute for the <img> HTML element sets the layout size for the image based on the computed layout size when choosing a source from the srcset. This attribute only applies to images with the loading="lazy" attribute.
The following features are now available in Edge:
CloseWatcher API listens and responds to close requests on in-page components, such as modals, popovers, and sidebars.
@view-transition CSS rule sets whether a document opts-in to transitions between documents in a multi-page application. Both the old and new document must opt-in for a transition to be triggered.
<fencedframe> element embeds another HTML page into the current page in a more secure and privacy-preserving way than <iframe> elements.
sharedStorage API stores data to a shared space where the data can then be processed without the ability to track users across the different sites they visit. A common use case is measuring the reach of third-party ads without using user-tracking cookies.
sizes="auto" attribute for the <img> HTML element sets the layout size for the image based on the computed layout size when choosing a source from the srcset. This attribute only applies to images with the loading="lazy" attribute.
The following features are now available in Firefox:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
The following features are now available in Firefox for Android:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
The following features are newly available:
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
round(), mod(), and rem() CSS functions compute rounded values and the remainder after division.
:state() CSS pseudo-class matches custom elements based on their custom state, set through the ElementInternals.states API.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now widely available:
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
externref type can be both a value type and a table element type, while funcref can be a value type.
The following features are now available in Chrome:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
notRestoredReasons property of a PerformanceNavigationTiming object explains why the current document was blocked from using the back/forward cache (also known as the bfcache) on navigation.
PressureObserver API monitors CPU load, allowing you to adjust workloads in response to available computing resources. Also known as the Compute Pressure API.
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
requestStorageAccess() API to let content in cross-site iframes request access to first-party data beyond cookies.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now available in Chrome Android:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
notRestoredReasons property of a PerformanceNavigationTiming object explains why the current document was blocked from using the back/forward cache (also known as the bfcache) on navigation.
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now available in Edge:
:active-view-transition CSS pseudo-class matches the root element when a view transition is active. The :active-view-transition-type() CSS pseudo-class matches only when the active view transition was started with the specified type.
notRestoredReasons property of a PerformanceNavigationTiming object explains why the current document was blocked from using the back/forward cache (also known as the bfcache) on navigation.
PressureObserver API monitors CPU load, allowing you to adjust workloads in response to available computing resources. Also known as the Compute Pressure API.
getHTML() method of Element and ShadowRoot objects serializes an element's DOM to an HTML string.
from keyword for color functions (color(), hsl(), oklch(), etc.) creates a new color based on a given color by modifying the values of the input color. Also known as relative color syntax (RCS).
view-transition-class CSS property sets a name that can be used to apply styles to multiple named view transition pseudo-elements.
The following features are now available in Firefox:
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now available in Firefox for Android:
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now available in Safari:
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.
The following features are now available in Safari on iOS:
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.
The following features are newly available:
AbortSignal.timeout() static method returns an abort signal that automatically aborts after a specified duration.
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
writing-mode CSS property orients form elements (such as radio buttons, progress bars, or select menus) vertically when the writing mode is vertical-lr or vertical-rl. The direction CSS property sets whether inputs flow from top to bottom or bottom to top.
The following features are now widely available:
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
copy and init, mirror the efficiency of native memcpy and memmove operations.
The following features are now available in Chrome:
for await … of loops to iterate through a stream's incoming data.
image/svg+xml data type (also known as the MIME type) for ClipboardItem objects represents SVG data written to or read from the clipboard.
context-fill and context-stroke CSS values are used with fill and stroke in SVG <marker> or <use> elements to match a color from where they appear.
rel="expect" attribute for the <link> HTML element is a hint to the browser to block rendering until the element that the href value references is connected to the document and fully parsed.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
writingsuggestions HTML attribute turns on or off a browser's writing suggestions. Writing suggestions vary by browser. For example, if turned on then a browser might show inline text completions accepted by pressing Tab.
The following features are now available in Chrome Android:
for await … of loops to iterate through a stream's incoming data.
image/svg+xml data type (also known as the MIME type) for ClipboardItem objects represents SVG data written to or read from the clipboard.
context-fill and context-stroke CSS values are used with fill and stroke in SVG <marker> or <use> elements to match a color from where they appear.
rel="expect" attribute for the <link> HTML element is a hint to the browser to block rendering until the element that the href value references is connected to the document and fully parsed.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
writingsuggestions HTML attribute turns on or off a browser's writing suggestions. Writing suggestions vary by browser. For example, if turned on then a browser might show inline text completions accepted by pressing Tab.
The following features are now available in Edge:
for await … of loops to iterate through a stream's incoming data.
image/svg+xml data type (also known as the MIME type) for ClipboardItem objects represents SVG data written to or read from the clipboard.
context-fill and context-stroke CSS values are used with fill and stroke in SVG <marker> or <use> elements to match a color from where they appear.
rel="expect" attribute for the <link> HTML element is a hint to the browser to block rendering until the element that the href value references is connected to the document and fully parsed.
Document.parseHTMLUnsafe() static method parses HTML into a DOM tree, while the setHTMLUnsafe() method of Element and ShadowRoot parses and inserts HTML into an existing tree. No sanitization applies to these methods, so never call them with user-provided HTML strings.
writingsuggestions HTML attribute turns on or off a browser's writing suggestions. Writing suggestions vary by browser. For example, if turned on then a browser might show inline text completions accepted by pressing Tab.
The following features are now available in Firefox:
contextlost event for <canvas> fires when the canvas backing storage is lost, while the contextrestored event fires when it is recreated.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
The following features are now available in Firefox for Android:
contextlost event for <canvas> fires when the canvas backing storage is lost, while the contextrestored event fires when it is recreated.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
The following features are newly available:
AbortSignal.any() static method combines an iterable of abort signals into a single signal, with the abort reason taken from the first signal to abort.
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
paint-order CSS property sets the z-order of strokes, fills, and (in SVG content) markers. For example, paint-order: markers stroke fill; draws the markers, then stroke on top of markers, then fill on top of both markers and stroke.
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
white-space-collapse CSS property sets whether new line characters are shown as line breaks, and whether multiple consecutive spaces are all displayed or combined.
The following features are now widely available:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
font-family: system-ui CSS declaration uses the operating system default font for text.
block-end refers to the bottom. Also known as flow relative.
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
The following features are now available in Chrome:
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
import … with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts.
field-sizing CSS property allows form controls such as <textarea> to be sized based on their content.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
long-animation-frame performance event type and the PerformanceLongAnimationFrameTiming API provide information about rendering updates that take longer than 50 milliseconds. Also known as LoAFs.
text-spacing-trim CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now available in Chrome Android:
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
import … with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts.
field-sizing CSS property allows form controls such as <textarea> to be sized based on their content.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
long-animation-frame performance event type and the PerformanceLongAnimationFrameTiming API provide information about rendering updates that take longer than 50 milliseconds. Also known as LoAFs.
text-spacing-trim CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now available in Edge:
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
import … with { type: "css" } statements load CSS modules as constructable stylesheets. Also known as CSS module scripts.
field-sizing CSS property allows form controls such as <textarea> to be sized based on their content.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
long-animation-frame performance event type and the PerformanceLongAnimationFrameTiming API provide information about rendering updates that take longer than 50 milliseconds. Also known as LoAFs.
text-spacing-trim CSS property controls spacing around CJK characters, avoiding excessive whitespace when using full-width punctuation characters.
zstd is a fast lossless compression algorithm. When used as a content encoding, it is often faster and offers better compression than brotli.
The following features are now available in Firefox:
text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.
The following features are now available in Firefox for Android:
text-wrap CSS property sets how lines break in text that overflows the container. It is a shorthand for text-wrap-style and text-wrap-mode.
The following features are now available in Safari:
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
shortcuts web app manifest member registers common actions of an installed web app with the device. The device can present these actions to the user in contextually appropriate locations, such as jump lists on Windows or the app launcher on Android.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
::spelling-error and ::grammar-error CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively.
:state() CSS pseudo-class matches custom elements based on their custom state, set through the ElementInternals.states API.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
writing-mode CSS property orients form elements (such as radio buttons, progress bars, or select menus) vertically when the writing mode is vertical-lr or vertical-rl. The direction CSS property sets whether inputs flow from top to bottom or bottom to top.
The following features are now available in Safari on iOS:
align-content property vertically aligns content in block layouts, like it does in flex or grid layouts.
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
::spelling-error and ::grammar-error CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively.
:state() CSS pseudo-class matches custom elements based on their custom state, set through the ElementInternals.states API.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
writing-mode CSS property orients form elements (such as radio buttons, progress bars, or select menus) vertically when the writing mode is vertical-lr or vertical-rl. The direction CSS property sets whether inputs flow from top to bottom or bottom to top.
The following features are newly available:
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
The following features are now widely available:
tab-size CSS property sets the width of the tab character.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Chrome:
formats.unsanitized parameter of the navigator.clipboard.read() method reads unsanitized text/html data from the system clipboard.
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
navigator.storageBuckets API allows you to organize locally stored data into groups called storage buckets. Each bucket can have different settings, allowing the browser to manage and delete buckets independently rather than applying the same treatment to all.
The following features are now available in Chrome Android:
formats.unsanitized parameter of the navigator.clipboard.read() method reads unsanitized text/html data from the system clipboard.
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
navigator.storageBuckets API allows you to organize locally stored data into groups called storage buckets. Each bucket can have different settings, allowing the browser to manage and delete buckets independently rather than applying the same treatment to all.
The following features are now available in Edge:
formats.unsanitized parameter of the navigator.clipboard.read() method reads unsanitized text/html data from the system clipboard.
Iterator object is an abstract base for objects that implement the iterator protocol. It provides methods common to built-in iterators, such as filter(), find(), map(), and reduce(). You can also use the static method Iterator.from() to convert an existing iterable into an Iterator.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
navigator.storageBuckets API allows you to organize locally stored data into groups called storage buckets. Each bucket can have different settings, allowing the browser to manage and delete buckets independently rather than applying the same treatment to all.
The following features are newly available:
Array.fromAsync() static method copies items from an async iterable object to make a new array.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
The following features are now available in Chrome:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
EditContext API allows you to build rich text editors that support advanced text input, such as Input Method Editor (IME) composition, an emoji picker, or other platform-specific editing UI.
font-palette values.
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollbar-width CSS property sets the width of the scrollbar.
showPicker() method for <select> elements shows the dropdown menu or other user interface for picking one of the options.
::spelling-error and ::grammar-error CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
The following features are now available in Chrome Android:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
EditContext API allows you to build rich text editors that support advanced text input, such as Input Method Editor (IME) composition, an emoji picker, or other platform-specific editing UI.
font-palette values.
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollbar-width CSS property sets the width of the scrollbar.
showPicker() method for <select> elements shows the dropdown menu or other user interface for picking one of the options.
::spelling-error and ::grammar-error CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
navigator.gpu API performs operations such as rendering and computation on dedicated graphics hardware (also known as a Graphics Processing Unit).
The following features are now available in Edge:
ClipboardItem.supports() static method checks if the browser supports writing data types such as "image/svg+xml" or other custom formats to the system clipboard.
EditContext API allows you to build rich text editors that support advanced text input, such as Input Method Editor (IME) composition, an emoji picker, or other platform-specific editing UI.
font-palette values.
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollbar-width CSS property sets the width of the scrollbar.
showPicker() method for <select> elements shows the dropdown menu or other user interface for picking one of the options.
::spelling-error and ::grammar-error CSS pseudo-elements match text that is highlighted as misspelled and grammatically incorrect, respectively.
text-decoration-line: spelling-error and text-decoration-line: grammar-error CSS declarations apply the browser's marking for spelling and grammatical mistakes. This is typically a wavy underline in red or green.
The following features are now available in Firefox:
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
page-orientation CSS property sets the rotation of a page after pagination. This allows pages with the same size declaration to display with different orientations.
showPicker() method for <select> elements shows the dropdown menu or other user interface for picking one of the options.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
The following features are now available in Firefox for Android:
Sec-GPC request header indicates that the user does not consent to a website or service selling or sharing their personal information with third parties.
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
page-orientation CSS property sets the rotation of a page after pagination. This allows pages with the same size declaration to display with different orientations.
showPicker() method for <select> elements shows the dropdown menu or other user interface for picking one of the options.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
The following features are newly available:
reset() method clears a canvas to its initial state.
cap CSS length unit corresponds to the height of Latin capital letters.
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
:dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).
pow(), sqrt(), hypot(), log(), and exp() CSS functions compute various exponential functions.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
mask CSS property (and several longhand properties) partially or completely hides an element according to the shape and depth of an image.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
scripting CSS media query sets styles based on whether scripting such as JavaScript is available. Values are enabled if scripting is available, initial-only if scripting is only available on page load (for example, printed content), or none.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
URL.canParse() static method checks whether a URL can be parsed into a valid URL object. It's an alternative to calling new URL() in a try … catch statement.
The following features are now available in Chrome:
background-clip: text CSS declaration draws the background underneath only the text in the element.
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
CreateVirtualSensor WebDriver command creates a virtual sensor for testing applications that use sensor APIs, without the need for real device sensors.
The following features are now available in Chrome Android:
background-clip: text CSS declaration draws the background underneath only the text in the element.
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
document.requestStorageAccessFor().
CreateVirtualSensor WebDriver command creates a virtual sensor for testing applications that use sensor APIs, without the need for real device sensors.
The following features are now available in Edge:
background-clip: text CSS declaration draws the background underneath only the text in the element.
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
CreateVirtualSensor WebDriver command creates a virtual sensor for testing applications that use sensor APIs, without the need for real device sensors.
The following features are now available in Firefox:
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
text-indent: each-line CSS declaration indents text after forced breaks as well as to the first line of a block.
text-indent: hanging CSS declaration indents all lines except the first.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
The following features are now available in Firefox for Android:
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
text-indent: each-line CSS declaration indents text after forced breaks as well as to the first line of a block.
text-indent: hanging CSS declaration indents all lines except the first.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
The following features are now available in Safari:
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
mask-border CSS property sets how the edges of an element are masked. It is a shorthand for mask-border-outset, mask-border-repeat, mask-border-slice, mask-border-source, and mask-border-width.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
round(), mod(), and rem() CSS functions compute rounded values and the remainder after division.
The following features are now available in Safari on iOS:
<details> elements which use the same name attribute are mutually exclusive. When one member of the group is opened, all other members are closed.
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
import … with { type: "json" } statements load JSON data. Also known as JSON module scripts.
mask-border CSS property sets how the edges of an element are masked. It is a shorthand for mask-border-outset, mask-border-repeat, mask-border-slice, mask-border-source, and mask-border-width.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
round(), mod(), and rem() CSS functions compute rounded values and the remainder after division.
The following features are newly available:
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
rlh CSS length unit is a font-relative length relative to the line height of root element.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
The following features are now available in Edge:
prefers-reduced-transparency CSS media query sets styles based on whether the user prefers to reduce the amount of transparent effects on their device, for example to improve contrast and legibility.
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
document.requestStorageAccessFor().
word-break: auto-phrase CSS declaration specifies that wrapping should occur at natural phrase boundaries, especially in CJK languages.
The following features are now available in Firefox:
Sec-GPC request header indicates that the user does not consent to a website or service selling or sharing their personal information with third parties.
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
writing-mode CSS property orients form elements (such as radio buttons, progress bars, or select menus) vertically when the writing mode is vertical-lr or vertical-rl. The direction CSS property sets whether inputs flow from top to bottom or bottom to top.
The following features are now available in Firefox for Android:
light-dark() CSS function accepts two colors and uses one depending on the current color scheme.
writing-mode CSS property orients form elements (such as radio buttons, progress bars, or select menus) vertically when the writing mode is vertical-lr or vertical-rl. The direction CSS property sets whether inputs flow from top to bottom or bottom to top.
The following features are newly available:
Element and ElementInternals objects.
<search> HTML element is a container that represents the parts of the web page with search functionality.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
The following features are now widely available:
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
gap CSS property in a flexbox layout sets the size of the space between items.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
The following features are now available in Chrome:
cap CSS length unit corresponds to the height of Latin capital letters.
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
prefers-reduced-transparency CSS media query sets styles based on whether the user prefers to reduce the amount of transparent effects on their device, for example to improve contrast and legibility.
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
document.requestStorageAccessFor().
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
word-break: auto-phrase CSS declaration specifies that wrapping should occur at natural phrase boundaries, especially in CJK languages.
The following features are now available in Chrome Android:
cap CSS length unit corresponds to the height of Latin capital letters.
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
prefers-reduced-transparency CSS media query sets styles based on whether the user prefers to reduce the amount of transparent effects on their device, for example to improve contrast and legibility.
Promise.withResolvers() static method is an alternative to the Promise() constructor that returns both the promise and resolution functions. You can use this to access resolve and reject outside the scope of the executor function.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
rect() CSS function creates a rectangle shape with insets from the edges of an element. The xywh() CSS function creates a rectangle shifted by an x and y distance. They can be used with clip-path and shape-outside.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
word-break: auto-phrase CSS declaration specifies that wrapping should occur at natural phrase boundaries, especially in CJK languages.
The following features are now available in Edge:
cap CSS length unit corresponds to the height of Latin capital letters.
rcap CSS length unit is a font-relative length equal to the value of the cap unit on the root element. Cap-height is approximately equal to the height of a capital Latin letter.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
The following features are now available in Firefox:
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
The following features are now available in Firefox for Android:
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
The following features are now available in Safari on iOS:
ManagedMediaSource API is a MediaSource where the browser manages the memory of source buffers and may evict data if needed.
The following features are newly available:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
The following features are now available in Chrome:
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.
overlay CSS property, used as an allow-discrete CSS transition, prevents a top layer element, such as a popover or a <dialog>, from being removed from the top layer before it has finished animating. You can't set the value of the overlay property; only use it as transition property.
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
text-wrap: pretty CSS declaration prioritizes better layout over speed when text is broken into multiple lines.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
The following features are now available in Chrome Android:
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.
overlay CSS property, used as an allow-discrete CSS transition, prevents a top layer element, such as a popover or a <dialog>, from being removed from the top layer before it has finished animating. You can't set the value of the overlay property; only use it as transition property.
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
text-wrap: pretty CSS declaration prioritizes better layout over speed when text is broken into multiple lines.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
The following features are now available in Edge:
Object.groupBy() and Map.groupBy() static methods group values of arrays and iterables based on a function that returns a key for each value.
display: none and any other display value or animate between content-visibility: hidden and any other content-visibility value. This also applies to transitions.
overlay CSS property, used as an allow-discrete CSS transition, prevents a top layer element, such as a popover or a <dialog>, from being removed from the top layer before it has finished animating. You can't set the value of the overlay property; only use it as transition property.
@starting-style CSS at-rule sets the starting values for properties that are transitioning when the target element's style is first updated.
text-wrap: pretty CSS declaration prioritizes better layout over speed when text is broken into multiple lines.
transition-behavior: allow-discrete CSS declaration allows transitions for properties whose animation behavior is discrete. Such properties can't be interpolated and swap from their start value to the end value at 50%.
The following features are now available in Firefox:
abs() and sign() CSS functions compute the absolute value or the sign of the input.
pow(), sqrt(), hypot(), log(), and exp() CSS functions compute various exponential functions.
font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.
font-synthesis-position CSS property sets whether or not the browser should synthesize subscript and superscript typefaces when they're missing from the font.
round(), mod(), and rem() CSS functions compute rounded values and the remainder after division.
<search> HTML element is a container that represents the parts of the web page with search functionality.
The following features are now available in Firefox for Android:
abs() and sign() CSS functions compute the absolute value or the sign of the input.
pow(), sqrt(), hypot(), log(), and exp() CSS functions compute various exponential functions.
font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.
font-synthesis-position CSS property sets whether or not the browser should synthesize subscript and superscript typefaces when they're missing from the font.
round(), mod(), and rem() CSS functions compute rounded values and the remainder after division.
<search> HTML element is a container that represents the parts of the web page with search functionality.
The following features are now available in Safari:
navigator.setAppBadge() method allows installed web applications to display an application badge, typically a dot or number shown alongside the application's icon on the device's home screen or application dock.
Clear-Site-Data header deletes browsing data (such as cookies, storage, or cache) associated with the requesting website.
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.
Intl.Locale API provide supplemental information about a Unicode locale, such as the locale's calendar (for example, the first day in a week or the weekend start day), writing direction, 12- or 24-hour cycles, and numbering system.
ManagedMediaSource API is a MediaSource where the browser manages the memory of source buffers and may evict data if needed.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
scripting CSS media query sets styles based on whether scripting such as JavaScript is available. Values are enabled if scripting is available, initial-only if scripting is only available on page load (for example, printed content), or none.
<search> HTML element is a container that represents the parts of the web page with search functionality.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
URL.canParse() static method checks whether a URL can be parsed into a valid URL object. It's an alternative to calling new URL() in a try … catch statement.
The following features are now available in Safari on iOS:
Clear-Site-Data header deletes browsing data (such as cookies, storage, or cache) associated with the requesting website.
window.getSelection().getComposedRanges() method returns ranges that represent the current user selection, even if the selection spans across shadow tree boundaries.
font-size-adjust CSS property preserves apparent text size, regardless of the font used, by scaling fonts to the same size with respect to a specific metric, such as x-height. This can help make fallback fonts look the same size.
Intl.Locale API provide supplemental information about a Unicode locale, such as the locale's calendar (for example, the first day in a week or the weekend start day), writing direction, 12- or 24-hour cycles, and numbering system.
scripting CSS media query sets styles based on whether scripting such as JavaScript is available. Values are enabled if scripting is available, initial-only if scripting is only available on page load (for example, printed content), or none.
<search> HTML element is a container that represents the parts of the web page with search functionality.
difference(), intersection(), isDisjointFrom(), isSubsetOf(), isSupersetOf(), symmetricDifference(), and union() methods of the JavaScript Set object performs operations between two sets.
URL.canParse() static method checks whether a URL can be parsed into a valid URL object. It's an alternative to calling new URL() in a try … catch statement.
The following features are newly available:
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
The following features are now available in Chrome:
AbortSignal.any() static method combines an iterable of abort signals into a single signal, with the abort reason taken from the first signal to abort.
IdentityCredential API delegates authentication to a third-party identity provider, instead of using third-party cookies. Also known as FedCM.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
The following features are now available in Chrome Android:
AbortSignal.any() static method combines an iterable of abort signals into a single signal, with the abort reason taken from the first signal to abort.
IdentityCredential API delegates authentication to a third-party identity provider, instead of using third-party cookies. Also known as FedCM.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
The following features are now available in Edge:
AbortSignal.any() static method combines an iterable of abort signals into a single signal, with the abort reason taken from the first signal to abort.
IdentityCredential API delegates authentication to a third-party identity provider, instead of using third-party cookies. Also known as FedCM.
popover HTML attribute creates an overlay to display content on top of other page content. Popovers can be shown declaratively using HTML, or using the showPopover() method.
The following features are now available in Firefox:
ReadableStream.from() static method converts an iterable or async iterable object, such as an array or async generator function, into a readable stream.
The following features are now available in Firefox for Android:
display-mode CSS media query sets styles based on whether the web page is in an ordinary browser tab mode or another mode, such as fullscreen, standalone, or minimal-ui.
ReadableStream.from() static method converts an iterable or async iterable object, such as an array or async generator function, into a readable stream.
The following features are newly available:
animation-composition CSS property chooses how to combine animations that affect the same property.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
The following features are now widely available:
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are now available in Chrome:
visibility-state performance entry and the VisibilityStateEntry API measure the timing of page visibility state changes, such as when a tab is no longer visible or the user has switched to another app.
animation-timeline, scroll-timeline, and view-timeline CSS properties advance animations based on the user's scroll position.
The following features are now available in Chrome Android:
visibility-state performance entry and the VisibilityStateEntry API measure the timing of page visibility state changes, such as when a tab is no longer visible or the user has switched to another app.
animation-timeline, scroll-timeline, and view-timeline CSS properties advance animations based on the user's scroll position.
The following features are now available in Edge:
visibility-state performance entry and the VisibilityStateEntry API measure the timing of page visibility state changes, such as when a tab is no longer visible or the user has switched to another app.
animation-timeline, scroll-timeline, and view-timeline CSS properties advance animations based on the user's scroll position.
The following features are now available in Firefox:
Array.fromAsync() static method copies items from an async iterable object to make a new array.
baseline-source CSS property controls how inline-level boxes with multiple lines of text are aligned with the surrounding text. By default, which typographic baseline is used depends on the display property value.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
URL.canParse() static method checks whether a URL can be parsed into a valid URL object. It's an alternative to calling new URL() in a try … catch statement.
The following features are now available in Firefox for Android:
Array.fromAsync() static method copies items from an async iterable object to make a new array.
baseline-source CSS property controls how inline-level boxes with multiple lines of text are aligned with the surrounding text. By default, which typographic baseline is used depends on the display property value.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
URL.canParse() static method checks whether a URL can be parsed into a valid URL object. It's an alternative to calling new URL() in a try … catch statement.
The following features are newly available:
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
window.print() method opens the browser's print dialog.
The following features are now available in Edge:
IdleDetector API is used to notify a webpage of the user's idle, active, and locked state.
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
scrollend event fires when an element or document has finished scrolling.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
white-space-collapse CSS property sets whether new line characters are shown as line breaks, and whether multiple consecutive spaces are all displayed or combined.
The following features are now available in Firefox:
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are now available in Firefox for Android:
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are newly available:
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
oklab() and oklch() functions.
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are now widely available:
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
The following features are now available in Chrome:
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
scrollend event fires when an element or document has finished scrolling.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
white-space-collapse CSS property sets whether new line characters are shown as line breaks, and whether multiple consecutive spaces are all displayed or combined.
The following features are now available in Chrome Android:
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
JSON.stringify() handles rawJSON values and JSON.parse()'s reviver callback takes a source context parameter.
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
scrollend event fires when an element or document has finished scrolling.
text-wrap: balance CSS declaration balances the length of each line when text is broken into multiple lines. Also known as headline balancing.
transfer() and transferToFixedLength() methods of ArrayBuffer move a buffer from one context to another (for example, to a worker).
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
white-space-collapse CSS property sets whether new line characters are shown as line breaks, and whether multiple consecutive spaces are all displayed or combined.
The following features are now available in Edge:
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
The following features are now available in Firefox:
reset() method clears a canvas to its initial state.
scripting CSS media query sets styles based on whether scripting such as JavaScript is available. Values are enabled if scripting is available, initial-only if scripting is only available on page load (for example, printed content), or none.
The following features are now available in Firefox for Android:
reset() method clears a canvas to its initial state.
scripting CSS media query sets styles based on whether scripting such as JavaScript is available. Values are enabled if scripting is available, initial-only if scripting is only available on page load (for example, printed content), or none.
The following features are now available in Safari:
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
The following features are now available in Safari on iOS:
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
The following features are newly available:
createConicGradient() methods draw a conic gradient to a 2D canvas.
roundRect() methods draw a rounded rectangle to a 2D canvas.
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
The following features are now widely available:
The following features are now available in Chrome:
animation-composition CSS property chooses how to combine animations that affect the same property.
The following features are now available in Chrome Android:
animation-composition CSS property chooses how to combine animations that affect the same property.
The following features are now available in Edge:
animation-composition CSS property chooses how to combine animations that affect the same property.
The following features are now available in Firefox:
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
The following features are now available in Firefox for Android:
linear() easing function for animations and transitions interpolates linearly between the control points, and can be used to approximate complex easing functions, such as a bounce effect.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
i32.add, i32.sub, i32.mul, i64.add, i64.sub, and i64.mul operations extend constant expressions to include arithmetic.
The following features are newly available:
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font.
font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.
font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
attachInternals() method of HTMLElement and the ElementInternals API.
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
translate HTML attribute marks whether an element's text should be translated.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
The following features are now widely available:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Chrome:
baseline-source CSS property controls how inline-level boxes with multiple lines of text are aligned with the surrounding text. By default, which typographic baseline is used depends on the display property value.
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
@container at-rule apply styles to an element based on the values of custom properties of its container.
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
oklab() and oklch() functions.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
rlh CSS length unit is a font-relative length relative to the line height of root element.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
window.getScreenDetails() method gets information about the screens on a device, which you can use to place new windows on a specific screen with window.open().
The following features are now available in Chrome Android:
baseline-source CSS property controls how inline-level boxes with multiple lines of text are aligned with the surrounding text. By default, which typographic baseline is used depends on the display property value.
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
@container at-rule apply styles to an element based on the values of custom properties of its container.
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
oklab() and oklch() functions.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
rlh CSS length unit is a font-relative length relative to the line height of root element.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
The following features are now available in Edge:
baseline-source CSS property controls how inline-level boxes with multiple lines of text are aligned with the surrounding text. By default, which typographic baseline is used depends on the display property value.
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
@container at-rule apply styles to an element based on the values of custom properties of its container.
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
oklab() and oklch() functions.
rch CSS length unit is a font-relative length equal to the value of the ch unit on the root element. ch length is based on the width of the zero (0) character.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
rex CSS length unit is a font-relative length that is equal to the x-height of the root element.
ric CSS length unit, or root international character, is a font-relative length equal to the width of CJK character relative to the root element.
rlh CSS length unit is a font-relative length relative to the line height of root element.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
window.getScreenDetails() method gets information about the screens on a device, which you can use to place new windows on a specific screen with window.open().
The following features are now available in Firefox:
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
context-fill and context-stroke CSS values are used with fill and stroke in SVG <marker> or <use> elements to match a color from where they appear.
The following features are now available in Firefox for Android:
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
context-fill and context-stroke CSS values are used with fill and stroke in SVG <marker> or <use> elements to match a color from where they appear.
The following features are now available in Safari:
Element and ElementInternals objects.
Array.fromAsync() static method copies items from an async iterable object to make a new array.
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
navigator.audioSession API controls how audio playback interacts with other applications. For example, playing music can pause audio from other applications, while ambient audio can play at the same time.
createConicGradient() methods draw a conic gradient to a 2D canvas.
roundRect() methods draw a rounded rectangle to a 2D canvas.
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
CSSStyleValue and its subclasses represent CSS values as distinct types instead of only strings. Also known as typed OM.
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
:dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).
gamepad.vibrationActuator property represents a gamepad's haptics hardware, which allows you to control the vibration motors in a gamepad.
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
margin-trim CSS property removes the margins of child elements when they meet the edges of the container.
CSS.px() or CSS.kHz(), return a CSSUnitValue representing a CSS number value (as in 12px or 440kHz).
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
rlh CSS length unit is a font-relative length relative to the line height of root element.
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
iterationComposite property of a KeyframeEffect object sets whether an animation's iterations are calculated independently ("replace") or are accumulated with the value of the previous iteration ("accumulate").
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are now available in Safari on iOS:
Element and ElementInternals objects.
Array.fromAsync() static method copies items from an async iterable object to make a new array.
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
navigator.audioSession API controls how audio playback interacts with other applications. For example, playing music can pause audio from other applications, while ambient audio can play at the same time.
navigator.setAppBadge() method allows installed web applications to display an application badge, typically a dot or number shown alongside the application's icon on the device's home screen or application dock.
createConicGradient() methods draw a conic gradient to a 2D canvas.
roundRect() methods draw a rounded rectangle to a 2D canvas.
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
CSSStyleValue and its subclasses represent CSS values as distinct types instead of only strings. Also known as typed OM.
shadowrootmode attribute on <template> creates a shadow root without the use of JavaScript. It is a declarative alternative to the attachShadow() method.
:dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).
Intl.DurationFormat API creates a locale-aware formatter that turns an object representing a duration (such as days, hours, and minutes) into a string.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
margin-trim CSS property removes the margins of child elements when they meet the edges of the container.
CSS.px() or CSS.kHz(), return a CSSUnitValue representing a CSS number value (as in 12px or 440kHz).
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
resize() method of an ArrayBuffer and the grow() method of a SharedArrayBuffer, constructed with the maxByteLength option, changes the size of the buffer in place.
rlh CSS length unit is a font-relative length relative to the line height of root element.
isWellFormed() method of strings returns a boolean indicating if the string contains any Unicode lone surrogates. The toWellFormed() method returns a new string where all lone surrogates are replaced by the Unicode replacement character.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
iterationComposite property of a KeyframeEffect object sets whether an animation's iterations are calculated independently ("replace") or are accumulated with the value of the previous iteration ("accumulate").
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are newly available:
color-gamut media query sets styles based on the colors a device can display.
@container at-rule apply styles to an element based on the dimensions of its container.
The following features are now widely available:
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
The following features are now available in Chrome:
launch_handler web app manifest member, with the client_mode property, configure how web app launches behave when an instance of the app is already open. For example, you can choose to focus the existing app instance instead of launching a new one.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
:autofill pseudo-class matches <input> elements that have been filled in automatically by the browser.
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
credentialless attribute for the <iframe> HTML element loads third-party content in an ephemeral context and does not send any credentials such as cookies. When using cross-origin isolation, this allows you to embed content that does not send Cross-Origin-Embedder-Policy headers.
initial-letter CSS property sets the number of lines the first letter of an element occupies. You can use the property to make a raised capital or drop cap.
The following features are now available in Chrome Android:
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
:autofill pseudo-class matches <input> elements that have been filled in automatically by the browser.
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
credentialless attribute for the <iframe> HTML element loads third-party content in an ephemeral context and does not send any credentials such as cookies. When using cross-origin isolation, this allows you to embed content that does not send Cross-Origin-Embedder-Policy headers.
initial-letter CSS property sets the number of lines the first letter of an element occupies. You can use the property to make a raised capital or drop cap.
The following features are now available in Edge:
launch_handler web app manifest member, with the client_mode property, configure how web app launches behave when an instance of the app is already open. For example, you can choose to focus the existing app instance instead of launching a new one.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
:autofill pseudo-class matches <input> elements that have been filled in automatically by the browser.
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
credentialless attribute for the <iframe> HTML element loads third-party content in an ephemeral context and does not send any credentials such as cookies. When using cross-origin isolation, this allows you to embed content that does not send Cross-Origin-Embedder-Policy headers.
initial-letter CSS property sets the number of lines the first letter of an element occupies. You can use the property to make a raised capital or drop cap.
The following features are now available in Firefox:
for await … of loops to iterate through a stream's incoming data.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
The following features are now available in Firefox for Android:
for await … of loops to iterate through a stream's incoming data.
The following features are newly available:
The following features are now widely available:
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
The following features are now available in Chrome:
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
hyphenate-limit-chars CSS property sets the number of characters in a word before it is hyphenated and the minimum number of characters on either side of the hyphen.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
The following features are now available in Chrome Android:
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
hyphenate-limit-chars CSS property sets the number of characters in a word before it is hyphenated and the minimum number of characters on either side of the hyphen.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases.
The following features are now available in Edge:
font-family: math CSS declaration uses the browser default font face for displaying mathematical expressions.
hyphenate-limit-chars CSS property sets the number of characters in a word before it is hyphenated and the minimum number of characters on either side of the hyphen.
lh CSS length unit corresponds to the requested line height, the computed value of the line-height property. Some lines may be higher than this based on their content.
The following features are now available in Firefox:
scrollend event fires when an element or document has finished scrolling.
The following features are now available in Firefox for Android:
scrollend event fires when an element or document has finished scrolling.
The following features are newly available:
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Edge:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases.
Permissions-Policy response header and the allow attribute for <iframe> elements sets whether a policy-controlled feature, such as an API, may be used in a document.
The following features are now available in Firefox:
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
The following features are now available in Firefox for Android:
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
The following features are now available in Safari:
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
The following features are now available in Safari on iOS:
color-mix() function mixes two colors in a given color space and by a given amount. Commonly, lighter or darker variations of a color are created by mixing with white or black.
linear-gradient(to right in oklch longer hue, red, red); calculates in the oklch color space, with the hue going all the way around the hue circle from red back to red.
The following features are newly available:
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
The following features are now available in Chrome:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases.
Permissions-Policy response header and the allow attribute for <iframe> elements sets whether a policy-controlled feature, such as an API, may be used in a document.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
The following features are now available in Chrome Android:
content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
Permissions-Policy response header and the allow attribute for <iframe> elements sets whether a policy-controlled feature, such as an API, may be used in a document.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
The following features are now available in Firefox:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
The following features are now available in Firefox for Android:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
The following features are newly available:
grid-template-columns and grid-template-rows CSS properties.
ic CSS length unit corresponds to the width of CJK ideographic characters.
The following features are now widely available:
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
The following features are now available in Chrome:
XRView.camera property provides direct access to pose-synchronized camera images within a WebXR session.
The following features are now available in Chrome Android:
XRView.camera property provides direct access to pose-synchronized camera images within a WebXR session.
The following features are now available in Edge:
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
XRView.camera property provides direct access to pose-synchronized camera images within a WebXR session.
The following features are now available in Firefox:
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
The following features are now available in Firefox for Android:
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
The following features are now available in Safari:
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
The following features are now available in Safari on iOS:
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
The following features are newly available:
contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
offset CSS property animates an element along a defined motion path.
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
The following features are now widely available:
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
fill-opacity, and stroke-opacity SVG attributes and CSS properties control the transparency of a stroke or fill of an SVG element.
overflow CSS property sets the behavior for when content doesn't fit in an element.
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
The following features are now available in Chrome:
blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
@container at-rule apply styles to an element based on the dimensions of its container.
fetch() request uploads a stream of data to the server when a request's body property is a ReadableStream object.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
ic CSS length unit corresponds to the width of CJK ideographic characters.
text-decoration CSS property in a ::selection rule sets the underline and other text decoration styles on the text a user has highlighted.
display_override: ["window-controls-overlay"] web application manifest member shows content in the title bar area of a progressive web app that is installed on a desktop device.
The following features are now available in Chrome Android:
blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
@container at-rule apply styles to an element based on the dimensions of its container.
fetch() request uploads a stream of data to the server when a request's body property is a ReadableStream object.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
ic CSS length unit corresponds to the width of CJK ideographic characters.
text-decoration CSS property in a ::selection rule sets the underline and other text decoration styles on the text a user has highlighted.
The following features are now available in Edge:
blocking="render" attribute for <link>, <script>, and <style> elements blocks rendering until the external script or stylesheet has been loaded. For <link rel="expect">, rendering is blocked until a specific element is in the DOM.
checkVisibility() method checks if an element is potentially visible, with optional parameters for the kinds of visibility to check. For example, it checks whether the element has the style display: none, but can also check for visibility: hidden.
@container at-rule apply styles to an element based on the dimensions of its container.
fetch() request uploads a stream of data to the server when a request's body property is a ReadableStream object.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
text-decoration CSS property in a ::selection rule sets the underline and other text decoration styles on the text a user has highlighted.
display_override: ["window-controls-overlay"] web application manifest member shows content in the title bar area of a progressive web app that is installed on a desktop device.
The following features are now available in Firefox:
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
The following features are now available in Firefox for Android:
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
The following features are now available in Safari:
AbortSignal.timeout() static method returns an abort signal that automatically aborts after a specified duration.
animation-composition CSS property chooses how to combine animations that affect the same property.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
@container at-rule apply styles to an element based on the dimensions of its container.
EXT_texture_compression_bptc extension for WebGL 1.0 and 2.0 contexts adds the BPTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
EXT_texture_norm16 extension to WebGL 2.0 contexts adds 16 bit signed normalized and unsigned normalized fixed-point texture, renderbuffer, and texture buffer formats.
grid-template-columns and grid-template-rows CSS properties.
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Safari on iOS:
AbortSignal.timeout() static method returns an abort signal that automatically aborts after a specified duration.
animation-composition CSS property chooses how to combine animations that affect the same property.
toReversed(), toSorted(), toSpliced(), and with() methods of arrays and typed arrays return changed copies of arrays. They stand in contrast to methods such as sort() or reverse() that change arrays in place.
e, pi, infinity, and NaN keywords represent well-defined constants accepted in CSS math functions such as calc().
@container at-rule apply styles to an element based on the dimensions of its container.
EXT_texture_norm16 extension to WebGL 2.0 contexts adds 16 bit signed normalized and unsigned normalized fixed-point texture, renderbuffer, and texture buffer formats.
grid-template-columns and grid-template-rows CSS properties.
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are newly available:
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
The following features are now widely available:
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
The following features are now available in Chrome:
web prefix for ClipboardItem data types (also known as MIME types) allows reading and writing unsanitized custom data from the device clipboard.
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
object-view-box CSS property crops and zooms to an inset area of an image.
navigator.mediaDevices.getDisplayMedia() to capture a browser tab as a video stream, the region capture API allows you to crop the video to the bounding box of a given element. In contrast to the element capture API, any content that overlays that element is also captured.
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are now available in Chrome Android:
web prefix for ClipboardItem data types (also known as MIME types) allows reading and writing unsanitized custom data from the device clipboard.
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
object-view-box CSS property crops and zooms to an inset area of an image.
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are now available in Edge:
web prefix for ClipboardItem data types (also known as MIME types) allows reading and writing unsanitized custom data from the device clipboard.
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
object-view-box CSS property crops and zooms to an inset area of an image.
navigator.mediaDevices.getDisplayMedia() to capture a browser tab as a video stream, the region capture API allows you to crop the video to the bounding box of a given element. In contrast to the element capture API, any content that overlays that element is also captured.
drawingBufferColorSpace and unpackColorSpace properties of WebGLRenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
drawingBufferColorSpace and unpackColorSpace properties of WebGL2RenderingContext sets the color representation for the buffer and imported textures, such as "srgb" or "display-p3".
The following features are newly available:
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
The following features are now widely available:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
<example-element>) that have behaviors you define.
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
caret-color CSS property sets the color of the text insertion pointer in a text input.
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
clip-path property can be animated using CSS transitions and animations.
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
globalThis property accesses the global this value (and hence the global object itself) across environments.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
input event fires when a form control changes or an element with the contenteditable attribute changes.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
catch clause when you don't need information about the exception in a try ... catch statement.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Firefox:
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
DOMException, Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError, and URIError objects are serializable. You can call structuredClone() on an error object or pass it to a worker using postMessage().
The following features are now available in Firefox for Android:
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
DOMException, Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError, and URIError objects are serializable. You can call structuredClone() on an error object or pass it to a worker using postMessage().
The following features are now available in Safari:
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
The following features are now available in Safari on iOS:
:modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().
The following features are newly available:
The following features are now available in Chrome:
Element and ElementInternals objects.
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
window.queryLocalFonts() method returns an array of locally-installed fonts, each represented by a FontData object.
The following features are now available in Chrome Android:
Element and ElementInternals objects.
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
The following features are now available in Edge:
Element and ElementInternals objects.
fetch() priority option and the fetchpriority HTML attribute give hints to the browser about which requests to do before other requests of the same type.
window.queryLocalFonts() method returns an array of locally-installed fonts, each represented by a FontData object.
The following features are now available in Firefox:
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
The following features are now available in Firefox for Android:
<, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
update CSS media query sets styles based on whether and how fast the user's device can modify display after it has been rendered. For example, you can avoid animations on devices that aren't fast enough to display them smoothly.
The following features are newly available:
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
The following features are now available in Chrome:
file_handlers web app manifest member registers an installed web app as a handler for files with specific file extensions or MIME types.
getDisplayMedia() to the capturing web application.
columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
The following features are now available in Chrome Android:
columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
The following features are now available in Edge:
file_handlers web app manifest member registers an installed web app as a handler for files with specific file extensions or MIME types.
getDisplayMedia() to the capturing web application.
columns or column-count CSS properties), the break-after, break-before, break-inside properties control where columns start or end.
hidden="until-found" attribute hides an element until it is found using the browser's find-in-page search or it is directly navigated to by following a URL fragment.
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
navigation API initiates, intercepts, or modifies browser navigation actions. Not to be confused with the navigator API.
The following features are now available in Firefox:
AbortSignal.timeout() static method returns an abort signal that automatically aborts after a specified duration.
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
video-dynamic-range CSS media query sets styles based on whether a device can display video with at least standard range colors or at least high range colors. Non-visual devices will match neither.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
The following features are now available in Firefox for Android:
AbortSignal.timeout() static method returns an abort signal that automatically aborts after a specified duration.
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
contain: inline-size CSS declaration prevents the element's inline dimension from being set by the element's contents. This permits the browser to avoid slower layout calculations.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
video-dynamic-range CSS media query sets styles based on whether a device can display video with at least standard range colors or at least high range colors. Non-visual devices will match neither.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
The following features are now available in Safari:
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
The following features are now available in Safari on iOS:
inert HTML attribute marks an element and its descendants as non-interactive. Inert elements don't get focus or fire click events.
The following features are newly available:
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
The following features are now available in Chrome:
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
The following features are now available in Chrome Android:
window.getDigitalGoodsService API connects to stores or billing services for in-app products and subscriptions.
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
The following features are now available in Edge:
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Firefox:
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
The following features are now available in Firefox for Android:
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
The following features are newly available:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
@layer CSS at-rule avoids specificity conflicts by providing priority levels for different groups of CSS rules, such as low-priority styles like resets, and high-priority styles like UI components.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
<dialog> HTML element represents a modal or non-modal dialog box, such as a confirmation prompt or a subwindow used to enter data.
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are now widely available:
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
The following features are now available in Chrome:
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
contextlost event for <canvas> fires when the canvas backing storage is lost, while the contextrestored event fires when it is recreated.
createConicGradient() methods draw a conic gradient to a 2D canvas.
reset() method clears a canvas to its initial state.
roundRect() methods draw a rounded rectangle to a 2D canvas.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Chrome Android:
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
contextlost event for <canvas> fires when the canvas backing storage is lost, while the contextrestored event fires when it is recreated.
createConicGradient() methods draw a conic gradient to a 2D canvas.
reset() method clears a canvas to its initial state.
roundRect() methods draw a rounded rectangle to a 2D canvas.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
NDEFReader API reads and writes messages to near-field communication (NFC) tags.
OES_draw_buffers_indexed extension for WebGL 2.0 contexts allows you to control blending on a per-color basis when writing to multiple color buffers simultaneously.
The following features are now available in Edge:
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
contextlost event for <canvas> fires when the canvas backing storage is lost, while the contextrestored event fires when it is recreated.
createConicGradient() methods draw a conic gradient to a 2D canvas.
reset() method clears a canvas to its initial state.
roundRect() methods draw a rounded rectangle to a 2D canvas.
showPicker() method for <input> elements shows the user interface for picking a value. For example, for <input type="date"> it shows the interface for picking a date.
The following features are now available in Firefox:
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
attachInternals() method of HTMLElement and the ElementInternals API.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
The following features are now available in Firefox for Android:
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
attachInternals() method of HTMLElement and the ElementInternals API.
hyphenate-character CSS property sets the character or string to use at the end of a line before a line break.
The following features are now available in Safari:
abs() and sign() CSS functions compute the absolute value or the sign of the input.
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
color-adjust shorthand CSS property allows multiple performance related color adjustments to be set at once. Setting the print-color-adjust CSS property directly is preferred, as it is the only such adjustment so far defined.
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
pow(), sqrt(), hypot(), log(), and exp() CSS functions compute various exponential functions.
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
ic CSS length unit corresponds to the width of CJK ideographic characters.
mask CSS property (and several longhand properties) partially or completely hides an element according to the shape and depth of an image.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
:playing, :paused, :seeking, :buffering, :stalled, :muted, and :volume-locked CSS pseudo-classes match <audio> and <video> elements based on their state.
oklab() and oklch() functions.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
attributionsourceid and attributiondestination attributes for <a> elements measure clicks across websites without associating a click to a specific session. Not to be confused with attribution reporting. Also known as PCM.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
text-decoration-skip-ink: all CSS declaration forces interruptions in underlines and overlines where the line would cross a glyph. This contrasts with auto, which does not skip for CJK glyphs.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are now available in Safari on iOS:
abs() and sign() CSS functions compute the absolute value or the sign of the input.
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
color-adjust shorthand CSS property allows multiple performance related color adjustments to be set at once. Setting the print-color-adjust CSS property directly is preferred, as it is the only such adjustment so far defined.
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
pow(), sqrt(), hypot(), log(), and exp() CSS functions compute various exponential functions.
font-palette CSS property selects a color palette from the font, optionally overriding individual colors in the @font-palette-values at-rule.
:has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.
ic CSS length unit corresponds to the width of CJK ideographic characters.
mask CSS property (and several longhand properties) partially or completely hides an element according to the shape and depth of an image.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
:playing, :paused, :seeking, :buffering, :stalled, :muted, and :volume-locked CSS pseudo-classes match <audio> and <video> elements based on their state.
oklab() and oklch() functions.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
attributionsourceid and attributiondestination attributes for <a> elements measure clicks across websites without associating a click to a specific session. Not to be confused with attribution reporting. Also known as PCM.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
text-decoration-skip-ink: all CSS declaration forces interruptions in underlines and overlines where the line would cross a glyph. This contrasts with auto, which does not skip for CJK glyphs.
sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions.
sv*, lv*, and dv* CSS viewport units are relative to the smallest, largest, and current (dynamic) viewport size. They are used to size elements in relation to the viewport's dimensions.
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are newly available:
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
The following features are now available in Chrome:
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
The following features are now available in Chrome Android:
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
The following features are now available in Edge:
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
The following features are now available in Firefox:
cap CSS length unit corresponds to the height of Latin capital letters.
@layer CSS at-rule avoids specificity conflicts by providing priority levels for different groups of CSS rules, such as low-priority styles like resets, and high-priority styles like UI components.
ic CSS length unit corresponds to the width of CJK ideographic characters.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
The following features are now available in Firefox for Android:
cap CSS length unit corresponds to the height of Latin capital letters.
@layer CSS at-rule avoids specificity conflicts by providing priority levels for different groups of CSS rules, such as low-priority styles like resets, and high-priority styles like UI components.
ic CSS length unit corresponds to the width of CJK ideographic characters.
print-color-adjust CSS property sets whether styles of printed pages should be adjusted to use less ink, in cases such as light text on a dark background.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
The following features are newly available:
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
The following features are now available in Chrome:
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
navigator.deviceMemory property is the approximate amount of device memory, in gigabytes.
font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font.
font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.
font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are now available in Chrome Android:
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
navigator.deviceMemory property is the approximate amount of device memory, in gigabytes.
font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font.
font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.
font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are now available in Edge:
findLast() and findLastIndex() methods of arrays and typed arrays search an array in reverse order for the first item that satisfies a test function.
navigator.deviceMemory property is the approximate amount of device memory, in gigabytes.
font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font.
font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font.
font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font.
WebTransport API transmits data between a client and a server, by using the HTTP/3 protocol.
The following features are now available in Firefox:
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
reversed() CSS function for counter-reset creates a counter that counts down.
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are now available in Firefox for Android:
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
reversed() CSS function for counter-reset creates a counter that counts down.
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are newly available:
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
The following features are now available in Firefox:
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
The following features are now available in Firefox for Android:
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
The following features are now available in Safari:
colorSpace parameter of a 2D canvas's getContext() method chooses the color representation, such as "srgb" or "display-p3".
The following features are now available in Safari on iOS:
colorSpace parameter of a 2D canvas's getContext() method chooses the color representation, such as "srgb" or "display-p3".
The following features are newly available:
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
externref type can be both a value type and a table element type, while funcref can be a value type.
The following features are now available in Chrome:
protocol_handlers web app manifest member registers an installed web app as a handler for a specific protocol. When a user follows a link with the specified protocol, the installed app opens the link.
shortcuts web app manifest member registers common actions of an installed web app with the device. The device can present these actions to the user in contextually appropriate locations, such as jump lists on Windows or the app launcher on Android.
EyeDropper API opens an eyedropper tool, a color picker that allows users to select a color from their screen.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
The following features are now available in Chrome Android:
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
The following features are now available in Edge:
protocol_handlers web app manifest member registers an installed web app as a handler for a specific protocol. When a user follows a link with the specified protocol, the installed app opens the link.
shortcuts web app manifest member registers common actions of an installed web app with the device. The device can present these actions to the user in contextually appropriate locations, such as jump lists on Windows or the app launcher on Android.
EyeDropper API opens an eyedropper tool, a color picker that allows users to select a color from their screen.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
Reporting-Endpoints HTTP header and ReportingObserver() API send reports of Content Security Policy (CSP) violations, Permissions-Policy violations, deprecated feature usage, browser interventions, and crashes to a nominated URL or callback function.
The following features are now available in Firefox:
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
The following features are now available in Firefox for Android:
structuredClone() global method creates a deep copy of an object. Values that cannot be cloned can instead be transferred, making the original value no longer usable.
The following features are newly available:
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
copy and init, mirror the efficiency of native memcpy and memmove operations.
The following features are now available in Chrome:
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now available in Chrome Android:
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now available in Edge:
URLPattern API creates patterns that can be matched against URLs or URL components.
The following features are now available in Firefox:
image-rendering: smooth CSS declaration scales images while retaining a gradual color blending that is useful for photos.
The following features are now available in Firefox for Android:
image-rendering: smooth CSS declaration scales images while retaining a gradual color blending that is useful for photos.
The following features are now available in Safari:
externref type can be both a value type and a table element type, while funcref can be a value type.
The following features are now available in Safari on iOS:
externref type can be both a value type and a table element type, while funcref can be a value type.
The following features are newly available:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
font-family: system-ui CSS declaration uses the operating system default font for text.
block-end refers to the bottom. Also known as flow relative.
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
The following features are now widely available:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
The following features are now available in Chrome:
IdleDetector API is used to notify a webpage of the user's idle, active, and locked state.
navigator.ink API uses the system compositor to draw to a <canvas> element ahead of pointer events, reducing the delay between moving a stylus or cursor and a pen stroke appearing on screen.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
Profiler API records data about the execution of a page, which you can send to a server for later analysis. Also known as self-profiling.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
navigator.virtualKeyboard API inspects and controls on-screen virtual keyboards. You can use it to programmatically hide or show a virtual keyboard or respond to the keyboard disappearing or appearing.
The following features are now available in Chrome Android:
IdleDetector API is used to notify a webpage of the user's idle, active, and locked state.
navigator.ink API uses the system compositor to draw to a <canvas> element ahead of pointer events, reducing the delay between moving a stylus or cursor and a pen stroke appearing on screen.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
Profiler API records data about the execution of a page, which you can send to a server for later analysis. Also known as self-profiling.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
navigator.virtualKeyboard API inspects and controls on-screen virtual keyboards. You can use it to programmatically hide or show a virtual keyboard or respond to the keyboard disappearing or appearing.
The following features are now available in Edge:
accent-color CSS property sets a color for checkboxes, radio buttons, and other form controls.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
EXT_texture_compression_bptc extension for WebGL 1.0 and 2.0 contexts adds the BPTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
EXT_texture_compression_rgtc extension for WebGL 1.0 and 2.0 contexts adds RGTC compressed texture formats. RGTC is a block-based texture compression format suited for unsigned and signed red and red-green textures. Also known as Red-Green Texture Compression.
navigator.ink API uses the system compositor to draw to a <canvas> element ahead of pointer events, reducing the delay between moving a stylus or cursor and a pen stroke appearing on screen.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
navigator.pdfViewerEnabled property is a boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF.
Profiler API records data about the execution of a page, which you can send to a server for later analysis. Also known as self-profiling.
scrollbar-gutter CSS property reserves space for the scrollbar, preventing unwanted layout changes as the scrollbar appears and disappears.
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
navigator.virtualKeyboard API inspects and controls on-screen virtual keyboards. You can use it to programmatically hide or show a virtual keyboard or respond to the keyboard disappearing or appearing.
OTPCredential API represents a one-time-password (OTP).
The following features are now available in Firefox:
accent-color CSS property sets a color for checkboxes, radio buttons, and other form controls.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
The following features are now available in Firefox for Android:
accent-color CSS property sets a color for checkboxes, radio buttons, and other form controls.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
The following features are now available in Safari:
:autofill pseudo-class matches <input> elements that have been filled in automatically by the browser.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency.
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
name="theme-color" attribute for the <meta> HTML element suggests a color that the browser can use to customize the display of the page or the browser user interface.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
text-indent: each-line CSS declaration indents text after forced breaks as well as to the first line of a block.
text-indent: hanging CSS declaration indents all lines except the first.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
WEBGL_multi_draw extension for WebGL 1.0 and 2.0 contexts renders more than one primitive with a single function call.
The following features are now available in Safari on iOS:
:autofill pseudo-class matches <input> elements that have been filled in automatically by the browser.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency.
color() function picks a color from a given color space. Wide gamut color spaces like display-p3 allow showing more vibrant and saturated colors than the standard srgb color space.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
hwb() CSS function picks colors using hue, whiteness, and blackness channels.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
color(), lab(), and lch() functions. Also known as CIELAB and CIELCH.
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
name="theme-color" attribute for the <meta> HTML element suggests a color that the browser can use to customize the display of the page or the browser user interface.
text-indent: each-line CSS declaration indents text after forced breaks as well as to the first line of a block.
text-indent: hanging CSS declaration indents all lines except the first.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
WEBGL_draw_buffers extension for WebGL 1.0 contexts enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
WEBGL_multi_draw extension for WebGL 1.0 and 2.0 contexts renders more than one primitive with a single function call.
The following features are newly available:
tab-size CSS property sets the width of the tab character.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Chrome:
accent-color CSS property sets a color for checkboxes, radio buttons, and other form controls.
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
EXT_texture_compression_bptc extension for WebGL 1.0 and 2.0 contexts adds the BPTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
EXT_texture_compression_rgtc extension for WebGL 1.0 and 2.0 contexts adds RGTC compressed texture formats. RGTC is a block-based texture compression format suited for unsigned and signed red and red-green textures. Also known as Red-Green Texture Compression.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
OTPCredential API represents a one-time-password (OTP).
The following features are now available in Chrome Android:
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
Object.hasOwn() static method checks whether an object has a given property. It's a more robust alternative to the Object.prototype.hasOwnProperty() method.
OVR_multiview2 extension for WebGL 2.0 contexts renders into multiple views simultaneously. This especially useful for virtual reality (VR) and WebXR.
The following features are now available in Firefox:
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
The following features are now available in Firefox for Android:
cause property of errors records the specific original cause of the error, particularly for errors that have been re-thrown.
The following features are now widely available:
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
The following features are now available in Chrome:
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
colorSpace parameter of a 2D canvas's getContext() method chooses the color representation, such as "srgb" or "display-p3".
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
The following features are now available in Chrome Android:
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
colorSpace parameter of a 2D canvas's getContext() method chooses the color representation, such as "srgb" or "display-p3".
EXT_texture_compression_bptc extension for WebGL 1.0 and 2.0 contexts adds the BPTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
name="theme-color" attribute for the <meta> HTML element suggests a color that the browser can use to customize the display of the page or the browser user interface.
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
The following features are now available in Edge:
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
colorSpace parameter of a 2D canvas's getContext() method chooses the color representation, such as "srgb" or "display-p3".
assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
The following features are now available in Firefox:
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
The following features are now available in Firefox for Android:
at() method of arrays and typed arrays returns the item at an index, including negative indices for getting items relative to the end of an array. Also known as the relative indexing method.
Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests.
at() method of strings returns the character (one UTF-16 code unit) at an index, including negative indices for getting the character relative to the end of the string. Also known as the relative indexing method.
The following features are now widely available:
checkValidity(), reportValidity() and setCustomValidity().
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
The following features are now available in Firefox:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
ascent-override, descent-override, and line-gap-override descriptors adjust the display of a font declared in an @font-face statement. This can help make fallback fonts look the same size.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
await keyword, when used at the top level of a module (outside of an async function), delays parent module execution until after a promise fulfills.
The following features are now available in Firefox for Android:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
ascent-override, descent-override, and line-gap-override descriptors adjust the display of a font declared in an @font-face statement. This can help make fallback fonts look the same size.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
image-set() CSS function provides a set of images at different resolutions or pixel densities, which the browser can pick from, depending on the device capabilities.
await keyword, when used at the top level of a module (outside of an async function), delays parent module execution until after a promise fulfills.
The following features are now available in Chrome:
Accelerometer, LinearAccelerationSensor and GravitySensor APIs read the acceleration applied to a device in three dimensions, either including the effect of gravity, without its effect, or only its effect, respectively.
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
The following features are now available in Chrome Android:
Accelerometer, LinearAccelerationSensor and GravitySensor APIs read the acceleration applied to a device in three dimensions, either including the effect of gravity, without its effect, or only its effect, respectively.
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
The following features are now available in Edge:
Accelerometer, LinearAccelerationSensor and GravitySensor APIs read the acceleration applied to a device in three dimensions, either including the effect of gravity, without its effect, or only its effect, respectively.
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
navigator.serviceWorker.register() method accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in service workers.
The following features are newly available:
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
gap CSS property in a flexbox layout sets the size of the space between items.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
The following features are now widely available:
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
<output> element represents the result of a calculation, user action, or form entry.
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
finally() method executes a function when the promise settles (resolves or rejects).
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
The following features are now available in Chrome:
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
Sec-CH-UA HTTP request header and the navigator.userAgentData API expose browser and platform information used to vary responses and application logic. User agent client hints are similar to user agent strings but more privacy-preserving and safer to parse.
XRDepthInformation object represents a measurement of the distance from the user's device to the real-world geometry in the user's environment.
XRLightProbe and XRLightEstimate objects represent real-world environmental lighting conditions during a WebXR session.
The following features are now available in Chrome Android:
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
Sec-CH-UA HTTP request header and the navigator.userAgentData API expose browser and platform information used to vary responses and application logic. User agent client hints are similar to user agent strings but more privacy-preserving and safer to parse.
XRDepthInformation object represents a measurement of the distance from the user's device to the real-world geometry in the user's environment.
XRLightProbe and XRLightEstimate objects represent real-world environmental lighting conditions during a WebXR session.
The following features are now available in Edge:
Atomics.waitAsync() static method waits for a value in a shared memory location, providing a promise when the expected value is not yet in memory. The waitAsync() method is a non-blocking alternative to Atomics.wait().
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
Sec-CH-UA HTTP request header and the navigator.userAgentData API expose browser and platform information used to vary responses and application logic. User agent client hints are similar to user agent strings but more privacy-preserving and safer to parse.
XRDepthInformation object represents a measurement of the distance from the user's device to the real-world geometry in the user's environment.
XRLightProbe and XRLightEstimate objects represent real-world environmental lighting conditions during a WebXR session.
The following features are now available in Firefox:
display: ruby CSS declaration renders an element with the box layout of a <ruby> HTML element. Child elements may use equivalents to <ruby> internal elements such as display: ruby-base for <rb>.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
The following features are now available in Firefox for Android:
display: ruby CSS declaration renders an element with the box layout of a <ruby> HTML element. Child elements may use equivalents to <ruby> internal elements such as display: ruby-base for <rb>.
outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border.
:user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.
The following features are now available in Safari:
AudioListener object represents the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
autocorrect global HTML attribute controls whether to automatically correct spelling or punctuation errors for user input.
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
EXT_texture_compression_rgtc extension for WebGL 1.0 and 2.0 contexts adds RGTC compressed texture formats. RGTC is a block-based texture compression format suited for unsigned and signed red and red-green textures. Also known as Red-Green Texture Compression.
Request.formData() and Response.formData() methods read a request or response body and return a FormData promise. You can use it to access the fields of a form submission.
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
KHR_parallel_shader_compile extension for WebGL 1.0 and 2.0 contexts checks the status of shader compilation without blocking the runtime.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
line and position settings in WebVTT files or the lineAlign and positionAlign properties of VTTCue using JavaScript.
The following features are now available in Safari on iOS:
AudioListener object represents the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
autocorrect global HTML attribute controls whether to automatically correct spelling or punctuation errors for user input.
Request.formData() and Response.formData() methods read a request or response body and return a FormData promise. You can use it to access the fields of a form submission.
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
KHR_parallel_shader_compile extension for WebGL 1.0 and 2.0 contexts checks the status of shader compilation without blocking the runtime.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
prefers-contrast CSS media query sets styles based on whether the user prefers more or less contrast, the difference between foreground and background colors.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
line and position settings in WebVTT files or the lineAlign and positionAlign properties of VTTCue using JavaScript.
The following features are now widely available:
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
SpeechSynthesis API converts text to speech with artificial voices.
The following features are now available in Chrome:
share_target web app manifest member registers an installed web app as a handler for shared content. When a user shares content by using the device share dialog, the installed app can be listed as an option for handling the shared content.
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
block-end refers to the bottom. Also known as flow relative.
measureUserAgentSpecificMemory() method estimates the memory usage of a web application including all its iframes and workers.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
navigator.serial API communicates with devices over serial ports, such as microcontrollers.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
await keyword, when used at the top level of a module (outside of an async function), delays parent module execution until after a promise fulfills.
The following features are now available in Chrome Android:
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
block-end refers to the bottom. Also known as flow relative.
measureUserAgentSpecificMemory() method estimates the memory usage of a web application including all its iframes and workers.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
await keyword, when used at the top level of a module (outside of an async function), delays parent module execution until after a promise fulfills.
The following features are now available in Edge:
share_target web app manifest member registers an installed web app as a handler for shared content. When a user shares content by using the device share dialog, the installed app can be listed as an option for handling the shared content.
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
<script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules.
block-end refers to the bottom. Also known as flow relative.
measureUserAgentSpecificMemory() method estimates the memory usage of a web application including all its iframes and workers.
ReadableStream constructed with { type: "bytes" } reads bytes from a stream without making extra copies, improving efficiency for streams of large chunks. Also known as BYOB or bring your own buffer.
navigator.serial API communicates with devices over serial ports, such as microcontrollers.
::target-text pseudo-element allows you to style text highlighted by a URL text fragment such as #:~:text=snippet.
await keyword, when used at the top level of a module (outside of an async function), delays parent module execution until after a promise fulfills.
The following features are now available in Firefox:
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
The following features are now available in Firefox for Android:
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
The following features are now available in Firefox:
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
The following features are now available in Firefox for Android:
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
The following features are newly available:
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are now available in Chrome:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
The following features are now available in Chrome Android:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
The following features are now available in Edge:
aspect-ratio CSS property controls the width-to-height ratio of elements. For <img> and <video> elements, the width and height attributes used together with height: auto control the aspect ratio while the image/video is loading.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
The following features are now available in Firefox:
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
The following features are now available in Firefox for Android:
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
The following features are now available in Firefox:
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
The following features are now available in Firefox for Android:
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
The following features are newly available:
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
The following features are now widely available:
for … of statement and enumerable with the methods entries(), keys(), and values().
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
The following features are now available in Chrome:
CookieStore API is an asynchronous and promise-based API for managing cookies. It does not rely on document and so is available to service workers as well.
EXT_texture_norm16 extension to WebGL 2.0 contexts adds 16 bit signed normalized and unsigned normalized fixed-point texture, renderbuffer, and texture buffer formats.
ascent-override, descent-override, and line-gap-override descriptors adjust the display of a font declared in an @font-face statement. This can help make fallback fonts look the same size.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
navigator.scheduling.isInputPending() method checks if there are pending input events, such as touch or mouse events. This allows you to yield from long-running scripts that might be blocking user interaction.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
The following features are now available in Chrome Android:
CookieStore API is an asynchronous and promise-based API for managing cookies. It does not rely on document and so is available to service workers as well.
EXT_texture_norm16 extension to WebGL 2.0 contexts adds 16 bit signed normalized and unsigned normalized fixed-point texture, renderbuffer, and texture buffer formats.
ascent-override, descent-override, and line-gap-override descriptors adjust the display of a font declared in an @font-face statement. This can help make fallback fonts look the same size.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
navigator.scheduling.isInputPending() method checks if there are pending input events, such as touch or mouse events. This allows you to yield from long-running scripts that might be blocking user interaction.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
The following features are now available in Edge:
CookieStore API is an asynchronous and promise-based API for managing cookies. It does not rely on document and so is available to service workers as well.
EXT_texture_norm16 extension to WebGL 2.0 contexts adds 16 bit signed normalized and unsigned normalized fixed-point texture, renderbuffer, and texture buffer formats.
ascent-override, descent-override, and line-gap-override descriptors adjust the display of a font declared in an @font-face statement. This can help make fallback fonts look the same size.
Intl.Segmenter API creates a locale-aware text splitter that can separate a string into meaningful graphemes, words, or sentences.
navigator.scheduling.isInputPending() method checks if there are pending input events, such as touch or mouse events. This allows you to yield from long-running scripts that might be blocking user interaction.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
The following features are newly available:
The following features are now widely available:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Chrome:
showOpenFilePicker(), showDirectoryPicker(), and showSaveFilePicker() methods request access to files and directories on the user's device and returns a handle for reading and writing to them.
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
::marker CSS pseudo-element selects list item markers for styling numbers or bullets.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
WEBGL_multi_draw extension for WebGL 1.0 and 2.0 contexts renders more than one primitive with a single function call.
"immersive-ar" value for navigator.xr.requestSession() starts an augmented reality WebXR session that renders content aligned with the visible environment.
The following features are now available in Chrome Android:
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
::marker CSS pseudo-element selects list item markers for styling numbers or bullets.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
WEBGL_multi_draw extension for WebGL 1.0 and 2.0 contexts renders more than one primitive with a single function call.
"immersive-ar" value for navigator.xr.requestSession() starts an augmented reality WebXR session that renders content aligned with the visible environment.
The following features are now available in Edge:
showOpenFilePicker(), showDirectoryPicker(), and showSaveFilePicker() methods request access to files and directories on the user's device and returns a handle for reading and writing to them.
:focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.
::marker CSS pseudo-element selects list item markers for styling numbers or bullets.
preservesPitch property for <audio> or <video> adjusts the pitch of audio to sound more natural when the playback rate is faster or slower than the default.
WEBGL_multi_draw extension for WebGL 1.0 and 2.0 contexts renders more than one primitive with a single function call.
"immersive-ar" value for navigator.xr.requestSession() starts an augmented reality WebXR session that renders content aligned with the visible environment.
The following features are now available in Firefox:
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are now available in Firefox for Android:
::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are newly available:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Firefox:
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
The following features are now available in Firefox for Android:
overflow: clip CSS declaration clips an element's overflowing content to the box that's defined by the overflow-clip-margin property. Unlike overflow: hidden, it allows you to hide overflow on one axis while keeping overflow on the other axis visible.
The following features are now available in Safari:
background-clip: text CSS declaration draws the background underneath only the text in the element.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are now available in Safari on iOS:
background-clip: text CSS declaration draws the background underneath only the text in the element.
:is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
:where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.
The following features are newly available:
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
The following features are now available in Chrome:
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
page-orientation CSS property sets the rotation of a page after pagination. This allows pages with the same size declaration to display with different orientations.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
XRAnchor object keeps track of a pose that is fixed relative to the real world. Anchors build an illusion that the placed objects are really present in the user's environment.
The following features are now available in Chrome Android:
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
page-orientation CSS property sets the rotation of a page after pagination. This allows pages with the same size declaration to display with different orientations.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
XRAnchor object keeps track of a pose that is fixed relative to the real world. Anchors build an illusion that the placed objects are really present in the user's environment.
The following features are now available in Edge:
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
page-orientation CSS property sets the rotation of a page after pagination. This allows pages with the same size declaration to display with different orientations.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
Referrer-Policy HTTP header and referrerpolicy HTML attributes control whether requests have the Referer header and what information the header contains.
CSS.registerProperty() static method and the @property CSS at-rule register custom properties for which types and behaviors can be defined.
related_applications web app manifest member lists operating system-specific applications that are related to the current web app, such as an Android app that provides similar functionality. The getInstalledRelatedApps() method lists which of those are installed on the current device.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
getAuthenticatorData(), getPublicKey(), and getPublicKeyAlgorithm() methods of AuthenticatorAttestationResponse access credential data inside attestationObject without the need to parse it.
XRAnchor object keeps track of a pose that is fixed relative to the real world. Anchors build an illusion that the placed objects are really present in the user's environment.
The following features are now available in Firefox:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
::marker CSS pseudo-element selects list item markers for styling numbers or bullets.
iterationComposite property of a KeyframeEffect object sets whether an animation's iterations are calculated independently ("replace") or are accumulated with the value of the previous iteration ("accumulate").
The following features are now available in Firefox for Android:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
::marker CSS pseudo-element selects list item markers for styling numbers or bullets.
iterationComposite property of a KeyframeEffect object sets whether an animation's iterations are calculated independently ("replace") or are accumulated with the value of the previous iteration ("accumulate").
The following features are newly available:
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
The following features are now available in Chrome:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
gap CSS property in a flexbox layout sets the size of the space between items.
layout-shift performance entry and LayoutShift API measures the layout stability of web pages based on movements of the elements on the page. They're used to calculate Cumulative Layout Shift (CLS), a common metric for perceived stability.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
The following features are now available in Chrome Android:
shortcuts web app manifest member registers common actions of an installed web app with the device. The device can present these actions to the user in contextually appropriate locations, such as jump lists on Windows or the app launcher on Android.
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
gap CSS property in a flexbox layout sets the size of the space between items.
layout-shift performance entry and LayoutShift API measures the layout stability of web pages based on movements of the elements on the page. They're used to calculate Cumulative Layout Shift (CLS), a common metric for perceived stability.
related_applications web app manifest member lists operating system-specific applications that are related to the current web app, such as an Android app that provides similar functionality. The getInstalledRelatedApps() method lists which of those are installed on the current device.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
OTPCredential API represents a one-time-password (OTP).
The following features are now available in Edge:
appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
gap CSS property in a flexbox layout sets the size of the space between items.
layout-shift performance entry and LayoutShift API measures the layout stability of web pages based on movements of the elements on the page. They're used to calculate Cumulative Layout Shift (CLS), a common metric for perceived stability.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
navigator.wakeLock.request("screen") API prevents the device's screen from dimming or being turned off.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
The following features are now available in Firefox:
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
externref type can be both a value type and a table element type, while funcref can be a value type.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
SharedArrayBuffer objects can be used in WebGL APIs that previously only worked with ArrayBuffer objects.
The following features are now available in Firefox for Android:
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
capture HTML attribute for <input type="file"> elements allows the user to capture media using the device's camera or microphone.
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
&&=) and the logical OR assignment (||=) operators short-circuit the respective binary logical operators.
offset CSS property animates an element along a defined motion path.
??) and nullish coalescing assignment (??=) operators return (or assign) its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
text-decoration-skip-ink: all CSS declaration forces interruptions in underlines and overlines where the line would cross a glyph. This contrasts with auto, which does not skip for CJK glyphs.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
user-select CSS property controls which elements can be selected by the user.
copy and init, mirror the efficiency of native memcpy and memmove operations.
externref type can be both a value type and a table element type, while funcref can be a value type.
WeakRef and FinalizationRegistry objects hold references to garbage-collectable objects without creating strong references that prevent their garbage collection.
SharedArrayBuffer objects can be used in WebGL APIs that previously only worked with ArrayBuffer objects.
The following features are now available in Firefox:
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
copy and init, mirror the efficiency of native memcpy and memmove operations.
The following features are now widely available:
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
The following features are now available in Chrome:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
The following features are now available in Chrome Android:
BarcodeDetector API recognizes various barcode formats in images.
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
EXT_texture_compression_rgtc extension for WebGL 1.0 and 2.0 contexts adds RGTC compressed texture formats. RGTC is a block-based texture compression format suited for unsigned and signed red and red-green textures. Also known as Red-Green Texture Compression.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
The following features are now available in Edge:
contain-intrinsic-size CSS property sets the intrinsic size of an element. When using size containment, the browser will lay out the element as if it had a single child of this size.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
requestVideoFrameCallback() method for <video> schedules a function that runs with the next video frame. It is similar to requestAnimationFrame(), but for video.
The following features are now available in Firefox:
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
The following features are newly available:
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
The following features are now widely available:
<data> element links a given piece of content with a machine-readable translation.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Chrome:
navigator.setAppBadge() method allows installed web applications to display an application badge, typically a dot or number shown alongside the application's icon on the device's home screen or application dock.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency.
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL canvas independently of the event loop. This can reduce drawing latency.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL2 canvas independently of the event loop. This can reduce drawing latency.
getHitTestResults() method of an XRFrame object helps place objects in an augmented reality session by finding where cast rays intersect with real-world geometry.
The following features are now available in Chrome Android:
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
getHitTestResults() method of an XRFrame object helps place objects in an augmented reality session by finding where cast rays intersect with real-world geometry.
The following features are now available in Edge:
navigator.setAppBadge() method allows installed web applications to display an application badge, typically a dot or number shown alongside the application's icon on the device's home screen or application dock.
Intl.DisplayNames API provides localized names of language, region, script, and currency codes.
getHitTestResults() method of an XRFrame object helps place objects in an augmented reality session by finding where cast rays intersect with real-world geometry.
The following features are now available in Firefox:
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
text-decoration-skip-ink: all CSS declaration forces interruptions in underlines and overlines where the line would cross a glyph. This contrasts with auto, which does not skip for CJK glyphs.
The following features are newly available:
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
fill-opacity, and stroke-opacity SVG attributes and CSS properties control the transparency of a stroke or fill of an SVG element.
overflow CSS property sets the behavior for when content doesn't fit in an element.
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
The following features are now widely available:
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Firefox:
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
The following features are now available in Safari:
navigator.clipboard API asynchronously reads and writes to the system clipboard.
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
ui-serif, ui-sans-serif, ui-monospace and ui-rounded values for the font-family CSS property use device-default user interface fonts for text.
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
tab-size CSS property sets the width of the tab character.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Safari on iOS:
navigator.clipboard API asynchronously reads and writes to the system clipboard.
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
ui-serif, ui-sans-serif, ui-monospace and ui-rounded values for the font-family CSS property use device-default user interface fonts for text.
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
replaceAll() method of strings returns a new string where all matches of a pattern (a string or regular expression) have been substituted with a replacement string.
tab-size CSS property sets the width of the tab character.
transform-box CSS property sets the position and dimensions of the reference box relative to which an element's transformations are calculated.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are newly available:
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
The following features are now available in Chrome:
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests.
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
periodicsync event in a service worker. You can use this to update data in the background at regular intervals.
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
The following features are now available in Chrome Android:
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
navigator.contacts API allows you to ask users to share limited details about entries in their contact list with your application.
Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests.
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
periodicsync event in a service worker. You can use this to update data in the background at regular intervals.
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
The following features are now available in Edge:
CompressionStream and DecompressionStream APIs compress and decompress data using the gzip or deflate formats.
Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests.
SharedWorker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in shared workers.
Worker() constructor accepts { type: "module" } to load scripts that use import and export. Also known as ECMAScript modules or ESM in workers.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
periodicsync event in a service worker. You can use this to update data in the background at regular intervals.
#:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
The following features are newly available:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
<example-element>) that have behaviors you define.
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
caret-color CSS property sets the color of the text insertion pointer in a text input.
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
clip-path property can be animated using CSS transitions and animations.
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
globalThis property accesses the global this value (and hence the global object itself) across environments.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
input event fires when a form control changes or an element with the contenteditable attribute changes.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
catch clause when you don't need information about the exception in a try ... catch statement.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Edge:
alignment-baseline CSS property sets which baseline of an element is aligned with the corresponding baseline of its parent.
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
navigator.clipboard API asynchronously reads and writes to the system clipboard.
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
AudioListener object represents the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
baseline-shift CSS property sets the position of an element relative to its dominant baseline.
navigator.getBattery() API obtains information about the device's battery, including charge level and status. Also known as the Battery API.
beforeinstallprompt event fires when a Progressive Web App (PWA) is installable. You can cancel the event and later call event.prompt() to control when the installation prompt is shown. The appinstalled event fires when the PWA is successfully installed.
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
alpha parameter of a 2D canvas's getContext() method sets whether the canvas has an alpha transparency channel. If set to false, then this permits the browser to optimize compositing for an opaque canvas.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency.
captureStream() method for <audio> and <video> elements returns a MediaStream for the media element's content. You can use this to record media or send it elsewhere, such as a canvas or WebRTC connection.
clip CSS property sets the visible area of an absolutely positioned element.
color-gamut media query sets styles based on the colors a device can display.
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
controlslist attribute for <audio> or <video> hides parts of the browser's built-in controls. For example, controlslist="nofullscreen" removes the button to play the video in fullscreen.
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
CSSStyleValue and its subclasses represent CSS values as distinct types instead of only strings. Also known as typed OM.
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
is attribute, to add new behaviors that you define.
<dialog> HTML element represents a modal or non-modal dialog box, such as a confirmation prompt or a subwindow used to enter data.
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
display-mode CSS media query sets styles based on whether the web page is in an ordinary browser tab mode or another mode, such as fullscreen, standalone, or minimal-ui.
element performance entry and the PerformanceElementTiming API measures the time to render elements that have the elementtiming attribute.
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
Feature-Policy response header sets whether a policy-controlled feature, such as an API, may be used in a document. Not to be confused with permissions policy.
FederatedCredential API represents the details required to authenticate a user using a third-party identity provider. Not to be confused with federated credential management (FedCM).
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
font-family: system-ui CSS declaration uses the operating system default font for text.
forced-colors CSS @media rule detects when a user has chosen to use a forced colors mode, also known as high-contrast mode, and the forced-color-adjust CSS property sets whether forced colors apply to an element.
attachInternals() method of HTMLElement and the ElementInternals API.
gamepad.vibrationActuator property represents a gamepad's haptics hardware, which allows you to control the vibration motors in a gamepad.
Gyroscope API reads the angular velocity of a device in three dimensions.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
:host-context() CSS pseudo-class selects the containing element of the shadow tree in which it is used if that element or an ancestor matches the provided selector.
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
trackVisibility parameter for the IntersectionObserver constructor enables tracking the visibility of an element, to detect if it may be obscured by other content or visual effects. Also known as IntersectionObserver v2.
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
navigator.keyboard.lock() API allows you to capture keys that are normally reserved by the operating system. It can be used to provide an immersive fullscreen experience such as games.
navigator.keyboard.getLayoutMap() API returns a map from key codes to human readable key names. It can be used to describe buttons to the user when using the keyboard as a set of buttons, such as in games.
KHR_parallel_shader_compile extension for WebGL 1.0 and 2.0 contexts checks the status of shader compilation without blocking the runtime.
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
longtask performance event type and the PerformanceLongTaskTiming API provides information about tasks that occupy the UI thread for 50 milliseconds or more, a metric for input latency, delayed animations, and other sources of "jank."
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
offset CSS property animates an element along a defined motion path.
CSS.px() or CSS.kHz(), return a CSSUnitValue representing a CSS number value (as in 12px or 440kHz).
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
AbsoluteOrientationSensor and RelativeOrientationSensor APIs describe the physical orientation of a device in three-dimensional space, either in relation to the Earth's coordinate system or in relation to the device's own orientation, respectively.
overflow-anchor CSS property sets an element as a possible scroll anchor, reducing unintended scrolling when document changes occur above the current scrollport. This is enabled by default where supported.
overflow CSS property sets the behavior for when content doesn't fit in an element.
freeze and resume events fire when the browser suspends or resumes a page from memory while the document.wasDiscarded property reports whether the page was reloaded after being dropped.
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
paint() CSS function creates a custom image, drawn using a paint worklet, for an element's background or border.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
PasswordCredential API represents a username and password.
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
navigator.registerProtocolHandler() method declares a site's ability to handle an address scheme (also known as a protocol). For example, an email site can register to open mailto: URLs or a VoIP site to open tel: URLs.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
requestIdleCallback() API queues a function that runs in idle browser time, either at the end of a frame or when the user is inactive. Also known as the background tasks API.
resize CSS property sets whether an element can be resized by the user, and on which axes.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
Save-Data HTTP request header when the user turns on a data-saving mode. It is a hint to reduce data sent to the browser. Servers should respond with alternative content, such as smaller images and videos, or different markup and styling.
navigator.mediaDevices.getDisplayMedia() method asks the user to choose a screen or portion of a screen (such as a window) to capture as a media stream.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
DOMException, Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError, and URIError objects are serializable. You can call structuredClone() on an error object or pass it to a worker using postMessage().
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
tab-size CSS property sets the width of the tab character.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
text-decoration: blink CSS declaration flashes text between visible and invisible.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
text-size-adjust CSS property disables or modifies the browser's default text size adjustment for small screen sizes.
:past and :future CSS pseudo-classes match prior or upcoming text track cues during media playback.
translate HTML attribute marks whether an element's text should be translated.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
user-select CSS property controls which elements can be selected by the user.
navigator.vibrate() method makes a tactile alert, if the device is equipped with a haptic motor.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
copy and init, mirror the efficiency of native memcpy and memmove operations.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL canvas independently of the event loop. This can reduce drawing latency.
SharedArrayBuffer objects can be used in WebGL APIs that previously only worked with ArrayBuffer objects.
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL2 canvas independently of the event loop. This can reduce drawing latency.
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
navigator.xr API represents the browser's virtual reality or augmented reality system. You can use to request a WebXR session.
gamepad attribute of an XRInputSource represents an XR input device, such as a motion controller, that reports data from physical inputs (such as buttons, touch pads, and triggers).
The following features are now available in Firefox:
translate, rotate, and scale CSS properties apply single transformations independently, as opposed to applying multiple transformations with the transform CSS property.
offset CSS property animates an element along a defined motion path.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
The following features are now available in Chrome:
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
navigator.xr API represents the browser's virtual reality or augmented reality system. You can use to request a WebXR session.
gamepad attribute of an XRInputSource represents an XR input device, such as a motion controller, that reports data from physical inputs (such as buttons, touch pads, and triggers).
The following features are now available in Chrome Android:
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
min() and max() CSS functions return the minimum or maximum of the arguments, while clamp() clamps a value to a given range.
navigator.xr API represents the browser's virtual reality or augmented reality system. You can use to request a WebXR session.
gamepad attribute of an XRInputSource represents an XR input device, such as a motion controller, that reports data from physical inputs (such as buttons, touch pads, and triggers).
The following features are now available in Firefox:
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
OES_fbo_render_mipmap extension for WebGL 1.0 contexts attaches any level of a texture to a framebuffer object.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
subgrid value for the grid-template-columns and grid-template-rows properties allows a grid item to inherit the grid definition of its parent grid container.
The following features are now widely available:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
The following features are now available in Firefox:
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
quotes CSS property sets the quotation marks inserted via the content CSS property or <q> element.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
display CSS property accepts multiple keyword values, such as inline flex or block flow, to explicitly set an element's inner and outer layout mode. Also known as 2-value, multi-keyword, or multiple value syntax.
The following features are newly available:
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
The following features are now widely available:
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
**) operator returns the result of raising the first operand to the power of the second operand.
fetch() method makes asynchronous HTTP requests.
navigator.getGamepads() API accesses and responds to signals from game controllers.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
display property of its children.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
The following features are now available in Chrome:
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
element performance entry and the PerformanceElementTiming API measures the time to render elements that have the elementtiming attribute.
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
attachInternals() method of HTMLElement and the ElementInternals API.
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
DOMException, Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError, and URIError objects are serializable. You can call structuredClone() on an error object or pass it to a worker using postMessage().
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
The following features are now available in Chrome Android:
/ notation in content CSS property values adds alternative text to generated content. For example, the content: url('upvote-icon.svg') / 'Upvote' declaration adds accessible 'Upvote' text to the SVG icon. Also known as alternate text.
element performance entry and the PerformanceElementTiming API measures the time to render elements that have the elementtiming attribute.
enterkeyhint global HTML attribute sets the label for a virtual keyboard's Enter key. For example, enterkeyhint="search" may label the key with a magnifying glass icon.
attachInternals() method of HTMLElement and the ElementInternals API.
largest-contentful-paint performance entry and the LargestContentfulPaint API measures the time it takes for the largest image or text to appear. Largest contentful paint (LCP) is a common metric for perceived loading times.
loading="lazy" attribute for <img> and <iframe> elements blocks loading the external resource until the user scrolls to that element's part of the page.
DOMException, Error, EvalError, RangeError, ReferenceError, SyntaxError, TypeError, and URIError objects are serializable. You can call structuredClone() on an error object or pass it to a worker using postMessage().
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
The following features are now available in Firefox:
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
user-select CSS property controls which elements can be selected by the user.
The following features are now available in Safari:
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
navigator.mediaDevices.getDisplayMedia() method asks the user to choose a screen or portion of a screen (such as a window) to capture as a media stream.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Safari on iOS:
clip-path CSS property and SVG attribute set the visible area of an element. Everything outside the area will be hidden.
color-scheme CSS property sets which color schemes (light or dark) an element uses and may prevent automatic dark mode adjustments by the browser.
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
line-break CSS property sets how strictly to apply rules for wrapping text to new lines, especially for symbols and punctuation.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now widely available:
border-image CSS property draws an image around an element.
The following features are now available in Chrome:
navigator.clipboard API asynchronously reads and writes to the system clipboard.
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
beforeinstallprompt event fires when a Progressive Web App (PWA) is installable. You can cancel the event and later call event.prompt() to control when the installation prompt is shown. The appinstalled event fires when the PWA is successfully installed.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
KHR_parallel_shader_compile extension for WebGL 1.0 and 2.0 contexts checks the status of shader compilation without blocking the runtime.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are now available in Chrome Android:
share_target web app manifest member registers an installed web app as a handler for shared content. When a user shares content by using the device share dialog, the installed app can be listed as an option for handling the shared content.
navigator.clipboard API asynchronously reads and writes to the system clipboard.
backdrop-filter CSS property applies graphical effects such as blurring or color shifting to the area behind an element.
beforeinstallprompt event fires when a Progressive Web App (PWA) is installable. You can cancel the event and later call event.prompt() to control when the installation prompt is shown. The appinstalled event fires when the PWA is successfully installed.
event and first-input performance entries and the PerformanceEventTiming API measures the latency of user input events, such as mouse clicks or keypresses. They're used to calculate Interaction to Next Paint (INP), a common metric for perceived responsiveness.
KHR_parallel_shader_compile extension for WebGL 1.0 and 2.0 contexts checks the status of shader compilation without blocking the runtime.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
Promise.allSettled() static method waits for an array of promises to settle (resolve or reject).
sctp object on RTCPeerConnection represents the negotiated SCTP transport. SCTP (Stream Control Transmission Protocol) is the protocol that RTCDataChannel uses.
The following features are now available in Firefox:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
EXT_texture_compression_bptc extension for WebGL 1.0 and 2.0 contexts adds the BPTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Firefox for Android:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
counter-set CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Chrome:
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
copy and init, mirror the efficiency of native memcpy and memmove operations.
The following features are now available in Chrome Android:
desynchronized parameter of a canvas's getContext() method permits the browser to draw a 2D canvas independently of the event loop. This can reduce drawing latency.
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
_) can be used as separators. For example, 1_050.95 is equivalent to 1050.95.
copy and init, mirror the efficiency of native memcpy and memmove operations.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL canvas independently of the event loop. This can reduce drawing latency.
desynchronized parameter of a canvas's getContext() method permits the browser to draw a WebGL2 canvas independently of the event loop. This can reduce drawing latency.
The following features are now available in Firefox:
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
The following features are now available in Firefox for Android:
EXT_float_blend extension for WebGL 1.0 and 2.0 contexts adds 32-bit floating-point components to blending and draw buffers.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
The following features are now available in Chrome:
Feature-Policy response header sets whether a policy-controlled feature, such as an API, may be used in a document. Not to be confused with permissions policy.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
trackVisibility parameter for the IntersectionObserver constructor enables tracking the visibility of an element, to detect if it may be obscured by other content or visual effects. Also known as IntersectionObserver v2.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
The following features are now available in Chrome Android:
Feature-Policy response header sets whether a policy-controlled feature, such as an API, may be used in a document. Not to be confused with permissions policy.
#! comment at the absolute start of a script or module is treated as a normal comment and is ignored by the JavaScript engine.
trackVisibility parameter for the IntersectionObserver constructor enables tracking the visibility of an element, to detect if it may be obscured by other content or visual effects. Also known as IntersectionObserver v2.
Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
The following features are newly available:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
The following features are now widely available:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
includes() method of arrays and typed arrays returns whether a given value appears in the array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
background-repeat CSS property sets how a background image is tiled.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
function*) create iterators that return multiple values, one after another, on-demand.
let and const declarations define block-scoped variables.
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
for … of statement and enumerable with the methods entries(), keys(), and values().
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
The following features are now available in Chrome:
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
touched property of a GamepadButton object indicates whether a button capable of detecting touch is currently touched.
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
The following features are now available in Chrome Android:
CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets.
touched property of a GamepadButton object indicates whether a button capable of detecting touch is currently touched.
imagesrcset and imagesizes attributes with the rel="preload" attribute for the <link> HTML element starts fetching responsive images before they're found in the body of the document.
part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.
matchAll() method of strings matches a string against a regular expression and returns an iterator of all results, including capturing groups.
The following features are now available in Firefox:
s identifier in a CSS attribute selector matches attribute values case-sensitively in document languages like HTML where attribute values are case-insensitive.
grid-template-columns and grid-template-rows CSS properties.
block-end refers to the bottom. Also known as flow relative.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
overflow-anchor CSS property sets an element as a possible scroll anchor, reducing unintended scrolling when document changes occur above the current scrollport. This is enabled by default where supported.
The following features are now available in Firefox for Android:
s identifier in a CSS attribute selector matches attribute values case-sensitively in document languages like HTML where attribute values are case-insensitive.
grid-template-columns and grid-template-rows CSS properties.
block-end refers to the bottom. Also known as flow relative.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
overflow-block and overflow-inline CSS media queries set styles based on the way a device displays content that's larger than the viewport or page area. For example, a laptop lets users scroll to reveal content, while a printer displays overflowing content on additional pages.
overflow-anchor CSS property sets an element as a possible scroll anchor, reducing unintended scrolling when document changes occur above the current scrollport. This is enabled by default where supported.
The following features are now available in Safari:
clip-path property can be animated using CSS transitions and animations.
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
globalThis property accesses the global this value (and hence the global object itself) across environments.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
prefers-color-scheme CSS media query sets styles based on the requested color scheme, light or dark.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
text-decoration: blink CSS declaration flashes text between visible and invisible.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
The following features are now available in Safari on iOS:
clip-path property can be animated using CSS transitions and animations.
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
globalThis property accesses the global this value (and hence the global object itself) across environments.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
text-decoration: blink CSS declaration flashes text between visible and invisible.
text-underline-offset CSS property shifts underlines on text from the initial position by a given distance. The initial position is affected by the text-underline-position property.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
The following features are now widely available:
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
The following features are newly available:
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
The following features are now available in Chrome:
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
navigator.mediaDevices.getDisplayMedia() method asks the user to choose a screen or portion of a screen (such as a window) to capture as a media stream.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
The following features are now available in Chrome Android:
Intl.ListFormat API creates a locale-aware formatter that turns iterable objects into localized strings.
navigator.userActivation API reveals whether the user has interacted with the page through an "activation" gesture such as a click, tap, or key press. User activation gated APIs (such as the fullscreen API) fail without user interaction, and this API allows you to predict such a failure.
The following features are now available in Firefox:
image-rendering: crisp-edges CSS declaration scales images to preserve lines without blurring.
globalThis property accesses the global this value (and hence the global object itself) across environments.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
The following features are now available in Firefox for Android:
image-rendering: crisp-edges CSS declaration scales images to preserve lines without blurring.
globalThis property accesses the global this value (and hence the global object itself) across environments.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
The following features are newly available:
checkValidity(), reportValidity() and setCustomValidity().
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
The following features are now widely available:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
The following features are now available in Chrome:
globalThis property accesses the global this value (and hence the global object itself) across environments.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
The following features are now available in Chrome Android:
globalThis property accesses the global this value (and hence the global object itself) across environments.
Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string.
queueMicrotask() method schedules a function to run after the currently running synchronous JavaScript finishes but before returning to the event loop.
The following features are now available in Firefox:
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollbar-width CSS property sets the width of the scrollbar.
The following features are now available in Firefox for Android:
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
scrollbar-color CSS property sets the color of the scrollbar track and thumb.
scrollbar-width CSS property sets the width of the scrollbar.
The following features are newly available:
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
<output> element represents the result of a calculation, user action, or form entry.
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
finally() method executes a function when the promise settles (resolves or rejects).
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
The following features are now available in Chrome:
The following features are now available in Chrome Android:
The following features are now available in Edge:
checkValidity(), reportValidity() and setCustomValidity().
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
The following features are now available in Firefox:
<example-element>) that have behaviors you define.
is attribute, to add new behaviors that you define.
gap CSS property in a flexbox layout sets the size of the space between items.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
The following features are now available in Firefox for Android:
<example-element>) that have behaviors you define.
is attribute, to add new behaviors that you define.
gap CSS property in a flexbox layout sets the size of the space between items.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
navigator.mediaCapabilities API queries the encoding and decoding abilities of the device, such as supported codecs, resolutions, and bitrates.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
The following features are newly available:
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
SpeechSynthesis API converts text to speech with artificial voices.
The following features are now widely available:
DOMParser API parses XML or HTML source code from a string into a DOM Document.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Chrome:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
navigator.keyboard.getLayoutMap() API returns a map from key codes to human readable key names. It can be used to describe buttons to the user when using the keyboard as a set of buttons, such as in games.
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are now available in Chrome Android:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
conic-gradient() and repeating-conic-gradient() CSS functions create backgrounds that progress between two or more colors around a center point.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
navigator.keyboard.getLayoutMap() API returns a map from key codes to human readable key names. It can be used to describe buttons to the user when using the keyboard as a set of buttons, such as in games.
OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context.
requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker.
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
navigator.locks API coordinates work with shared resources through mutually exclusive ownership of a resource's name. Also known as web locks.
The following features are now available in Firefox:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
::selection CSS pseudo-element selects text a user has highlighted.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
The following features are now available in Firefox for Android:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
::selection CSS pseudo-element selects text a user has highlighted.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
The following features are now available in Safari:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Safari on iOS:
flat() and flatMap() methods for arrays creates a new array such that each nested array item is concatenated into it.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
overflow: overlay CSS declaration is an alias to overflow: auto. Historically, it caused non-standard behavior, allowing scrollbars to overlay content without taking up layout space.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Chrome:
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
gamepad.vibrationActuator property represents a gamepad's haptics hardware, which allows you to control the vibration motors in a gamepad.
navigator.keyboard.lock() API allows you to capture keys that are normally reserved by the operating system. It can be used to provide an immersive fullscreen experience such as games.
overflow CSS property sets the behavior for when content doesn't fit in an element.
freeze and resume events fire when the browser suspends or resumes a page from memory while the document.wasDiscarded property reports whether the page was reloaded after being dropped.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
SharedArrayBuffer object represents bytes shared between multiple workers and the main thread. The Atomics object safely accesses SharedArrayBuffer data to make sure predictable values are read and written and that operations are not interrupted.
The following features are now available in Chrome Android:
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
gamepad.vibrationActuator property represents a gamepad's haptics hardware, which allows you to control the vibration motors in a gamepad.
navigator.keyboard.lock() API allows you to capture keys that are normally reserved by the operating system. It can be used to provide an immersive fullscreen experience such as games.
overflow CSS property sets the behavior for when content doesn't fit in an element.
freeze and resume events fire when the browser suspends or resumes a page from memory while the document.wasDiscarded property reports whether the page was reloaded after being dropped.
resolution CSS media query sets styles based on the pixel density, or how many pixels a device uses to display a single CSS pixel.
The following features are now available in Firefox:
overflow CSS property sets the behavior for when content doesn't fit in an element.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
The following features are now available in Firefox for Android:
overflow CSS property sets the behavior for when content doesn't fit in an element.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
The following features are newly available:
for … of statement and enumerable with the methods entries(), keys(), and values().
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
The following features are now widely available:
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
The following features are now available in Chrome:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
is attribute, to add new behaviors that you define.
Gyroscope API reads the angular velocity of a device in three dimensions.
navigator.connection API provides information about the network connection a device is using and fires events when the connection type changes.
AbsoluteOrientationSensor and RelativeOrientationSensor APIs describe the physical orientation of a device in three-dimensional space, either in relation to the Earth's coordinate system or in relation to the device's own orientation, respectively.
The following features are now available in Chrome Android:
BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type.
BigInt64Array and BigUint64Array typed arrays represent 64-bit integers, signed and unsigned respectively.
is attribute, to add new behaviors that you define.
Gyroscope API reads the angular velocity of a device in three dimensions.
navigator.connection API provides information about the network connection a device is using and fires events when the connection type changes.
AbsoluteOrientationSensor and RelativeOrientationSensor APIs describe the physical orientation of a device in three-dimensional space, either in relation to the Earth's coordinate system or in relation to the device's own orientation, respectively.
The following features are now available in Firefox:
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
The following features are now available in Firefox for Android:
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
The following features are newly available:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Chrome:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
for … of statement and enumerable with the methods entries(), keys(), and values().
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
CSSStyleValue and its subclasses represent CSS values as distinct types instead of only strings. Also known as typed OM.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
CSS.px() or CSS.kHz(), return a CSSUnitValue representing a CSS number value (as in 12px or 440kHz).
catch clause when you don't need information about the exception in a try ... catch statement.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
The following features are now available in Chrome Android:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
for … of statement and enumerable with the methods entries(), keys(), and values().
AudioWorklet API runs module code in a separate thread, specifically for non-blocking, low latency audio processing.
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
CSSStyleValue and its subclasses represent CSS values as distinct types instead of only strings. Also known as typed OM.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
inputmode global HTML attribute gives a hint about what type of data is to be entered into an <input> element, such as text, numeric, or email, so the browser may help the user enter data using an adapted input mechanism, such as an on-screen virtual keyboard.
rel="modulepreload" attribute for the <link> HTML element indicates that a module script should be fetched, parsed, and compiled preemptively, and stored for later execution.
CSS.px() or CSS.kHz(), return a CSSUnitValue representing a CSS number value (as in 12px or 440kHz).
catch clause when you don't need information about the exception in a try ... catch statement.
trimStart() and trimEnd() methods of strings return a new string with whitespace removed from the beginning or end of the string.
The following features are now available in Edge:
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
font-optical-sizing CSS property sets whether text rendering is optimized for viewing at different sizes.
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
ping attribute for <a> elements sets a URL to send a POST request to when the <a> is clicked. This is typically used for outbound link reporting.
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WEBGL_draw_buffers extension for WebGL 1.0 contexts enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
The following features are now available in Safari:
caret-color CSS property sets the color of the text insertion pointer in a text input.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
fetch() request uploads a stream of data to the server when a request's body property is a ReadableStream object.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
catch clause when you don't need information about the exception in a try ... catch statement.
PaymentRequest API prompts the user to make a payment through the browser's user interface.
finally() method executes a function when the promise settles (resolves or rejects).
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
speak-as CSS property sets how any element's content is spoken. Not to be confused with the speak-as descriptor of @counter-style at-rules.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
The following features are now widely available:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
<iframe> elements or two documents using a shared worker.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
includes() method of strings returns whether a search string appears within the string.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
repeat() method of strings returns the original string repeated a number of times.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
\\u{}) represent Unicode characters within strings.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
word-break CSS property sets how lines break within words.
The following features are now available in Chrome:
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
paint() CSS function creates a custom image, drawn using a paint worklet, for an element's background or border.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
Save-Data HTTP request header when the user turns on a data-saving mode. It is a hint to reduce data sent to the browser. Servers should respond with alternative content, such as smaller images and videos, or different markup and styling.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
The following features are now available in Chrome Android:
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
paint() CSS function creates a custom image, drawn using a paint worklet, for an element's background or border.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
Save-Data HTTP request header when the user turns on a data-saving mode. It is a hint to reduce data sent to the browser. Servers should respond with alternative content, such as smaller images and videos, or different markup and styling.
serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests.
The following features are now available in Firefox:
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
The following features are now available in Firefox for Android:
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
The following features are now available in Safari on iOS:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
caret-color CSS property sets the color of the text insertion pointer in a text input.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
fetch() request uploads a stream of data to the server when a request's body property is a ReadableStream object.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
catch clause when you don't need information about the exception in a try ... catch statement.
PaymentRequest API prompts the user to make a payment through the browser's user interface.
finally() method executes a function when the promise settles (resolves or rejects).
safe-area-inset- CSS environment variables represent a rectangle that cannot cut off content within a non-rectangular screen. For example, top:\ env(safe-area-inset-top); positions the top of an element below the notch on an iPhone.
speak-as CSS property sets how any element's content is spoken. Not to be confused with the speak-as descriptor of @counter-style at-rules.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
document.requestStorageAccess() method allows content in iframes to request storing and reading cookies and other site data, while the document.hasStorageAccess() method checks if such access is granted.
The following features are now widely available:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
<abbr> HTML element represents an abbreviation or acronym.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
Array.isArray() static method checks whether a value is an array.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
background-position CSS property offsets the initial position of background images relative to the background origin.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
<bdo> element overrides the directionality of text, so that the text within is rendered in a different direction than the surrounding text.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border-radius CSS property rounds the corners of the border drawn around an element.
border CSS property sets the color, style, and width of the line around an element.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
@charset CSS at-rule specifies the character encoding of an external style sheet.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
data: scheme and which directly contain data rather than point to remote resources.
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
Date object represents a single moment in time.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
<dfn> element marks a term to be defined, styling text as italic by default.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
<div> HTML element is the generic container for content.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
:empty CSS pseudo-class matches elements without child elements.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
<fieldset> and <legend> elements group several form control elements within a web form.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
focus and blur, fire when an element gets or loses focus.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<form> element contains interactive controls for submitting information.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<html> element represents the top-level of an HTML document and is referred to as the root element.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="number"> HTML element represents numeric input data.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
window.matchMedia() method checks whether a media query applies to the document.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
opacity CSS property sets the transparency of an element.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
<q> element represents a short inline quotation.
RegExp object represents a regular expression, a notation for matching text patterns.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
:root pseudo-class matches the root element of the document, usually the <html> element.
<ruby> element produces small annotations that are rendered with its base text.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
text-shadow CSS property sets the position and styles of shadow on text.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
<video> element plays videos or movies, optionally with controls provided by the browser.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WebSocket API opens a two-way communication channel between the user's browser and a server.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
The following features are now available in Chrome:
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
The following features are now available in Chrome Android:
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
ResizeObserver API observes and reacts to changes in the size of DOM elements.
text-decoration-skip-ink CSS property sets whether underlines and overlines may be interrupted where the line would cross a glyph.
The following features are now available in Firefox:
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
catch clause when you don't need information about the exception in a try ... catch statement.
finally() method executes a function when the promise settles (resolves or rejects).
The following features are now available in Firefox for Android:
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
catch clause when you don't need information about the exception in a try ... catch statement.
finally() method executes a function when the promise settles (resolves or rejects).
The following features are now available in Chrome:
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
finally() method executes a function when the promise settles (resolves or rejects).
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Chrome Android:
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
Intl.PluralRules API creates a locale-aware object that tells you which of the language's pluralization rules apply based on a given number.
overscroll-behavior CSS property disables default scrolling behaviors when the edges of a scrolling area are reached.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
finally() method executes a function when the promise settles (resolves or rejects).
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
The following features are newly available:
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
The following features are now available in Firefox:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
The following features are now available in Firefox for Android:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
async function*) create iterators that return multiple promises, one after another, on-demand.
for await .. of loop.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
The following features are newly available:
<data> element links a given piece of content with a machine-readable translation.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Chrome:
captureStream() method for <audio> and <video> elements returns a MediaStream for the media element's content. You can use this to record media or send it elsewhere, such as a canvas or WebRTC connection.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
The following features are now available in Chrome Android:
captureStream() method for <audio> and <video> elements returns a MediaStream for the media element's content. You can use this to record media or send it elsewhere, such as a canvas or WebRTC connection.
font-stretch CSS property selects a font face from a font family based on width, either by a keyword such as condensed or a percentage.
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
The following features are now available in Edge:
AbortSignal, you can cancel the request.
AbortController and AbortSignal APIs allow you to cancel an ongoing operation, such as a fetch() request.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
The following features are newly available:
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Chrome:
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Chrome Android:
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
navigator.share() method invokes the device's native sharing mechanism and passes text, links, files, and other content to share targets. Also known as the Web Share API.
navigator.storage API provides information about the availability and persistence of the data that a site stores on the device, by using APIs such as the Cache API or the IndexedDB API.
visualViewport API provides a way to query and modify the user-visible viewport of a web page.
The following features are now available in Firefox:
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Firefox for Android:
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Safari:
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
font-family: system-ui CSS declaration uses the operating system default font for text.
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Safari on iOS:
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
font-family: system-ui CSS declaration uses the operating system default font for text.
font-variation-settings CSS property sets an "axis of variability" on a variable font, such as weight, optical size, or a custom axis defined by the typeface designer. When possible, use other CSS font properties, such as font-weight: bold. Also known as variable fonts.
import to load other modules and export to declare what is available to import from other modules. In HTML, modules are loaded with <script type="module">.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Chrome Android:
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
PasswordCredential API represents a username and password.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
SharedArrayBuffer objects can be used in WebGL APIs that previously only worked with ArrayBuffer objects.
The following features are now available in Firefox:
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
touched property of a GamepadButton object indicates whether a button capable of detecting touch is currently touched.
hand and pose properties of a Gamepad object represent the position in space and the hand that WebVR controllers are held in.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
requestIdleCallback() API queues a function that runs in idle browser time, either at the end of a frame or when the user is inactive. Also known as the background tasks API.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
text-justify CSS property sets the justification method of text when text-align: justify is set.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Firefox for Android:
CSS.supports() static method returns whether the browser supports a CSS declaration (given by two arguments, a property and value) or an @supports at-rule condition string.
touched property of a GamepadButton object indicates whether a button capable of detecting touch is currently touched.
hand and pose properties of a Gamepad object represent the position in space and the hand that WebVR controllers are held in.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
requestIdleCallback() API queues a function that runs in idle browser time, either at the end of a frame or when the user is inactive. Also known as the background tasks API.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
text-justify CSS property sets the justification method of text when text-align: justify is set.
The following features are now available in Chrome:
navigator.credentials API provides generic storage for authentication credentials. Other credential APIs represent specific kinds of credentials, such as password or public key credentials, that the credential management API stores.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
font-display CSS descriptor sets whether to show a substitute font or nothing while a font face loads. The property manages what's known as a flash of unstyled text or flash of invisible text.
messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages.
paint performance entry and the PerformancePaintTiming API measures the duration of "paint" (also called "render") operations as a page loads. The API measures the time to First Paint (FP) and First Contentful Paint (FCP), common metrics for perceived loading times.
PasswordCredential API represents a username and password.
PaymentRequest API prompts the user to make a payment through the browser's user interface.
...) syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected.
WEBGL_compressed_texture_s3tc_srgb extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats for the sRGB colorspace to compressedTexImage2D() and compressedTexSubImage2D().
SharedArrayBuffer objects can be used in WebGL APIs that previously only worked with ArrayBuffer objects.
The following features are now available in Chrome:
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
The following features are now available in Chrome Android:
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
createImageBitmap() global method creates an ImageBitmap object from a source such as an image, SVG, blob, or canvas. An ImageBitmap object represents pixel data that can be drawn to a canvas with lower latency than other types, such as ImageData.
The following features are now available in Firefox:
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
The following features are now available in Firefox for Android:
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
fill-box, stroke-box, and view-box values for clip-path set an edge of the element's box to use as the clipping shape.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
The following features are newly available:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
The following features are now available in Chrome:
color-gamut media query sets styles based on the colors a device can display.
controlslist attribute for <audio> or <video> hides parts of the browser's built-in controls. For example, controlslist="nofullscreen" removes the button to play the video in fullscreen.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
longtask performance event type and the PerformanceLongTaskTiming API provides information about tasks that occupy the UI thread for 50 milliseconds or more, a metric for input latency, delayed animations, and other sources of "jank."
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Chrome Android:
color-gamut media query sets styles based on the colors a device can display.
controlslist attribute for <audio> or <video> hides parts of the browser's built-in controls. For example, controlslist="nofullscreen" removes the button to play the video in fullscreen.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
IntersectionObserver API asynchronously observes changes in the intersection of a target element with an ancestor element or with a top-level document's viewport.
longtask performance event type and the PerformanceLongTaskTiming API provides information about tasks that occupy the UI thread for 50 milliseconds or more, a metric for input latency, delayed animations, and other sources of "jank."
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Edge:
touched property of a GamepadButton object indicates whether a button capable of detecting touch is currently touched.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
PaymentRequest API prompts the user to make a payment through the browser's user interface.
The following features are now available in Firefox:
caret-color CSS property sets the color of the text insertion pointer in a text input.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
mask CSS property (and several longhand properties) partially or completely hides an element according to the shape and depth of an image.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Firefox for Android:
caret-color CSS property sets the color of the text insertion pointer in a text input.
display: flow-root CSS declaration sets an element as the root element of a new flow layout for its children, preventing margin collapse with sibling elements.
mask CSS property (and several longhand properties) partially or completely hides an element according to the shape and depth of an image.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are newly available:
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
**) operator returns the result of raising the first operand to the power of the second operand.
fetch() method makes asynchronous HTTP requests.
navigator.getGamepads() API accesses and responds to signals from game controllers.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
display property of its children.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
The following features are now available in Chrome:
caret-color CSS property sets the color of the text insertion pointer in a text input.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
text-decoration: blink CSS declaration flashes text between visible and invisible.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Chrome Android:
caret-color CSS property sets the color of the text insertion pointer in a text input.
navigator.mediaSession API integrates with platform UI for media playback. It can be used to set metadata such as title and artwork, and to handle user actions like playing, pausing, or seeking.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
text-decoration: blink CSS declaration flashes text between visible and invisible.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Firefox:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
touchstart, touchmove, touchend, and touchcancel fire when users interact with a touch-sensitive surface, such as a screen or drawing tablet. These events are similar to mouse events.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Firefox for Android:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
hsl() and hsla() CSS functions pick colors using hue, saturation, lightness, and alpha (transparency) channels.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
rgb(), rgba(), and hexadecimal (as in #004488ff) notations pick colors using red, green, blue, and alpha (transparency) channels.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
WebAssembly.instantiate() and WebAssembly.instantiateStreaming() global static methods load WebAssembly code (also known as Wasm), a portable binary instruction format.
The following features are now available in Safari:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
<example-element>) that have behaviors you define.
checkValidity(), reportValidity() and setCustomValidity().
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are now available in Safari on iOS:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
autocapitalize global HTML attribute sets the virtual keyboard capitalization behavior for user input on an element, such as the first letter of sentences or all words.
<example-element>) that have behaviors you define.
checkValidity(), reportValidity() and setCustomValidity().
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
:focus-within CSS pseudo-class matches an element if the element or any of its children are focused.
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
prefers-reduced-motion CSS media query sets styles based on whether the user prefers to minimize the amount of non-essential animations on the device, such as scrolling, panning, zooming, and strobing.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are newly available:
border-image CSS property draws an image around an element.
The following features are now available in Chrome Android:
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
font-family: system-ui CSS declaration uses the operating system default font for text.
overflow-anchor CSS property sets an element as a possible scroll anchor, reducing unintended scrolling when document changes occur above the current scrollport. This is enabled by default where supported.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
The following features are now available in Chrome:
border-image CSS property draws an image around an element.
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
font-family: system-ui CSS declaration uses the operating system default font for text.
overflow-anchor CSS property sets an element as a possible scroll anchor, reducing unintended scrolling when document changes occur above the current scrollport. This is enabled by default where supported.
window.performance.timing and window.performance.navigation APIs report performance timing information for events that occur during the loading and use of the current page.
position: sticky CSS declaration positions an element in the normal flow until it crosses a specified threshold, at which points it becomes fixed (stuck) at that position.
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
The following features are now available in Firefox:
checkValidity(), reportValidity() and setCustomValidity().
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
The following features are now available in Firefox for Android:
EXT_color_buffer_float extension for WebGL 2.0 contexts adds color-renderable floating point formats to renderbufferStorage().
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
WEBGL_compressed_texture_etc extension for WebGL 1.0 and 2.0 contexts adds many ETC2 and EAC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WebGL2RenderingContext API is the "webgl2" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations. It corresponds to OpenGL ES 3.0.
The following features are now available in Chrome:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
clip-path property can be animated using CSS transitions and animations.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
offset CSS property animates an element along a defined motion path.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
The following features are now available in Chrome Android:
async and await keywords allow you to use the asynchronous, promise-based behavior of a function without using promise chains.
clip-path property can be animated using CSS transitions and animations.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
isSecureContext global property is a boolean for whether the current browsing context is secure. This is primarily a check that the page has been served over an HTTPS URL.
offset CSS property animates an element along a defined motion path.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
The following features are now available in Firefox:
border-image CSS property draws an image around an element.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
The following features are now available in Firefox for Android:
border-image CSS property draws an image around an element.
ImageBitmapRenderingContext API is the "bitmaprenderer" rendering context for the <canvas> element. It is commonly used to transfer frames from an OffscreenCanvas to a user-visible <canvas> element.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
The following features are now available in Chrome:
<example-element>) that have behaviors you define.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
:host-context() CSS pseudo-class selects the containing element of the shadow tree in which it is used if that element or an ancestor matches the provided selector.
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
text-size-adjust CSS property disables or modifies the browser's default text size adjustment for small screen sizes.
user-select CSS property controls which elements can be selected by the user.
The following features are now available in Chrome Android:
<example-element>) that have behaviors you define.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
:host-context() CSS pseudo-class selects the containing element of the shadow tree in which it is used if that element or an ancestor matches the provided selector.
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
text-size-adjust CSS property disables or modifies the browser's default text size adjustment for small screen sizes.
user-select CSS property controls which elements can be selected by the user.
The following features are newly available:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
includes() method of arrays and typed arrays returns whether a given value appears in the array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
background-repeat CSS property sets how a background image is tiled.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
function*) create iterators that return multiple values, one after another, on-demand.
let and const declarations define block-scoped variables.
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
for … of statement and enumerable with the methods entries(), keys(), and values().
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
The following features are now available in Chrome Android:
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
PaymentRequest API prompts the user to make a payment through the browser's user interface.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
The following features are now available in Firefox:
clip-path property can be animated using CSS transitions and animations.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
:dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
SpeechSynthesis API converts text to speech with artificial voices.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
The following features are now available in Firefox for Android:
clip-path property can be animated using CSS transitions and animations.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
:dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
Q CSS length unit is an absolute length anchored to the physical measurement of quarter-millimeters. 1Q is equivalent to 1/40 of 1 centimeter.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
The following features are now available in Safari:
for … of statement and enumerable with the methods entries(), keys(), and values().
color-gamut media query sets styles based on the colors a device can display.
cross-fade() CSS function generates an image by mixing two images.
CSSValue and CSSPrimitiveValue, that were later excluded from the CSS object model.
<data> element links a given piece of content with a machine-readable translation.
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are now available in Safari on iOS:
for … of statement and enumerable with the methods entries(), keys(), and values().
color-gamut media query sets styles based on the colors a device can display.
CSSValue and CSSPrimitiveValue, that were later excluded from the CSS object model.
<data> element links a given piece of content with a machine-readable translation.
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
:host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.
capture HTML attribute for <input type="file"> elements allows the user to capture media using the device's camera or microphone.
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
inverted-colors CSS media query sets styles based on whether the user has inverted all colors, such as with mobile accessibility settings.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are newly available:
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
The following features are now available in Chrome:
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
<slot> HTML element is a placeholder inside a web component where consumers of the component can insert their own markup.
The following features are now available in Edge:
includes() method of arrays and typed arrays returns whether a given value appears in the array.
for … of statement and enumerable with the methods entries(), keys(), and values().
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
<data> element links a given piece of content with a machine-readable translation.
**) operator returns the result of raising the first operand to the power of the second operand.
fetch() method makes asynchronous HTTP requests.
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
let and const declarations define block-scoped variables.
Notification() constructor shows a message to the user, typically using the notification system of the host operating system.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
SpeechSynthesis API converts text to speech with artificial voices.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
The following features are now available in Firefox:
color-adjust shorthand CSS property allows multiple performance related color adjustments to be set at once. Setting the print-color-adjust CSS property directly is preferred, as it is the only such adjustment so far defined.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are now available in Firefox for Android:
color-adjust shorthand CSS property allows multiple performance related color adjustments to be set at once. Setting the print-color-adjust CSS property directly is preferred, as it is the only such adjustment so far defined.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
padStart() and padEnd() methods of strings return a string lengthened to a minimum number of characters by adding characters to the start or end of the string.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are now available in Chrome:
AudioListener object represents the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
**) operator returns the result of raising the first operand to the power of the second operand.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
The following features are now available in Chrome Android:
AudioListener object represents the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
contain CSS property sets limits to the scope of styles, layout, and paint rendering for speed and efficiency. The none keyword value disables containment, strict is equivalent to contain: size layout style paint, and content is equivalent to contain: layout style paint.
contain: layout CSS declaration isolates the inside of an element such that it cannot affect the layout of the rest of the page or be affected by the rest of the page. This permits the browser to avoid slower layout calculations.
contain: paint CSS declaration prevents an element's descendants from being drawn outside the boundaries of the containing element, with any overflow clipped. This permits the browser to avoid slower painting calculations.
contain: size CSS declaration sets an element's dimensions exclusively by its height and width properties, ignoring its contents and descendants. This permits the browser to avoid slower layout calculations.
contain: style CSS declaration permits the browser to avoid slower layout calculations by preventing modification to counter (counter-increment and counter-set) and quotation styles (content property quote values) beyond the element's descendants.
**) operator returns the result of raising the first operand to the power of the second operand.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
The following features are newly available:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
The following features are now available in Chrome Android:
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
FederatedCredential API represents the details required to authenticate a user using a third-party identity provider. Not to be confused with federated credential management (FedCM).
The following features are now available in Firefox:
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
The following features are now available in Firefox for Android:
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
The following features are now available in Chrome:
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
FederatedCredential API represents the details required to authenticate a user using a third-party identity provider. Not to be confused with federated credential management (FedCM).
The following features are now available in Chrome:
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
display property of its children.
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
The following features are now available in Chrome Android:
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
rel="preload" attribute for the <link> HTML element requests resources, such as images or style sheets, that the page needs soon, so the browser may prioritize them for loading before rendering begins.
display property of its children.
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
The following features are now available in Firefox:
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
The following features are now available in Firefox for Android:
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
The following features are newly available:
DOMParser API parses XML or HTML source code from a string into a DOM Document.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Chrome:
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
let and const declarations define block-scoped variables.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Chrome Android:
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
let and const declarations define block-scoped variables.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Firefox:
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
The following features are now available in Firefox for Android:
decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
The following features are now available in Safari:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
border-image CSS property draws an image around an element.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
filter() CSS function applies one or more graphic effects to a CSS image, such as a background image. You can use functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, background: filter(url(image.png), blur(2px)).
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
inverted-colors CSS media query sets styles based on whether the user has inverted all colors, such as with mobile accessibility settings.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Safari on iOS:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
border-image CSS property draws an image around an element.
cross-fade() CSS function generates an image by mixing two images.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
filter() CSS function applies one or more graphic effects to a CSS image, such as a background image. You can use functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, background: filter(url(image.png), blur(2px)).
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
revert CSS keyword resets any property to its previous default, provided by either the user or browser stylesheets. For example, setting display: revert on a <div> will likely result in display: block, the browser default style. This is often confused with initial.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Chrome:
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are now available in Chrome Android:
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
unicode-bidi and direction CSS properties override the Unicode layout algorithm. They are intended for Document Type Definition (DTD) designers. For HTML documents, you should use the dir global HTML attribute and <bdo> HTML element instead.
text-combine-upright CSS property displays multiple characters in the space of a single character in vertical text. This is used in East Asian documents to display Latin-based strings such as components of a date or letters of an initialism.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are now available in Firefox:
let and const declarations define block-scoped variables.
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Firefox for Android:
let and const declarations define block-scoped variables.
RTCPeerConnection.getStats(), RTCRtpSender.getStats(), and RTCRtpReceiver.getStats() methods return detailed information about the status, performance, network, and media for a given WebRTC connection.
The following features are now available in Chrome:
includes() method of arrays and typed arrays returns whether a given value appears in the array.
display-mode CSS media query sets styles based on whether the web page is in an ordinary browser tab mode or another mode, such as fullscreen, standalone, or minimal-ui.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
requestIdleCallback() API queues a function that runs in idle browser time, either at the end of a frame or when the user is inactive. Also known as the background tasks API.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Chrome Android:
includes() method of arrays and typed arrays returns whether a given value appears in the array.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
requestIdleCallback() API queues a function that runs in idle browser time, either at the end of a frame or when the user is inactive. Also known as the background tasks API.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
WEBGL_compressed_texture_astc extension for WebGL 1.0 and 2.0 contexts adds the Adaptive Scalable Texture Compression format to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts.
The following features are now available in Firefox:
includes() method of arrays and typed arrays returns whether a given value appears in the array.
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are now available in Firefox for Android:
includes() method of arrays and typed arrays returns whether a given value appears in the array.
captureStream() method for <canvas> elements returns a MediaStream which includes a CanvasCaptureMediaStreamTrack representing real-time video of the canvas image. You can use this to record the canvas, or send it elsewhere, such as another canvas or WebRTC connection.
hyphens CSS property controls when long words are broken by line wrapping. Although called hyphens, the property applies to word-splitting behavior across languages, such as customary spelling changes or the use of other characters. Support for non-English languages varies significantly.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
The following features are newly available:
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
The following features are now available in Edge:
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
function*) create iterators that return multiple values, one after another, on-demand.
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Firefox:
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
The following features are now available in Firefox for Android:
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
The following features are now available in Chrome:
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
The following features are now available in Chrome Android:
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
fit-content CSS keyword expands a box as needed to fit its contents until the maximum size is reached, preserving the content's preferred aspect ratio.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
min-content and max-content CSS keywords represent the smallest and largest intrinsic sizes of an element.
The following features are newly available:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
<iframe> elements or two documents using a shared worker.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
includes() method of strings returns whether a search string appears within the string.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
repeat() method of strings returns the original string repeated a number of times.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
\\u{}) represent Unicode characters within strings.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
word-break CSS property sets how lines break within words.
The following features are now available in Chrome:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
for … of statement and enumerable with the methods entries(), keys(), and values().
The following features are now available in Chrome Android:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
for … of statement and enumerable with the methods entries(), keys(), and values().
The following features are now available in Firefox:
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
The following features are now available in Firefox for Android:
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
The following features are now available in Safari:
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
display property of its children.
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
WEBGL_draw_buffers extension for WebGL 1.0 contexts enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
The following features are now available in Safari on iOS:
i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
:link CSS pseudo-class matches unvisited links, :visited matches visited links, and :any-link matches both.
display property of its children.
:not() functional pseudo-class matches elements that do not match the selectors in its argument.
of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
:placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.
The following features are now available in Firefox:
includes() method of strings returns whether a search string appears within the string.
\\u{}) represent Unicode characters within strings.
The following features are now available in Firefox for Android:
includes() method of strings returns whether a search string appears within the string.
\\u{}) represent Unicode characters within strings.
The following features are newly available:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
<abbr> HTML element represents an abbreviation or acronym.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
Array.isArray() static method checks whether a value is an array.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
background-position CSS property offsets the initial position of background images relative to the background origin.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
<bdo> element overrides the directionality of text, so that the text within is rendered in a different direction than the surrounding text.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border-radius CSS property rounds the corners of the border drawn around an element.
border CSS property sets the color, style, and width of the line around an element.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
@charset CSS at-rule specifies the character encoding of an external style sheet.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
data: scheme and which directly contain data rather than point to remote resources.
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
Date object represents a single moment in time.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
<dfn> element marks a term to be defined, styling text as italic by default.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
<div> HTML element is the generic container for content.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
:empty CSS pseudo-class matches elements without child elements.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
<fieldset> and <legend> elements group several form control elements within a web form.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
focus and blur, fire when an element gets or loses focus.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<form> element contains interactive controls for submitting information.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<html> element represents the top-level of an HTML document and is referred to as the root element.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="number"> HTML element represents numeric input data.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
window.matchMedia() method checks whether a media query applies to the document.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
opacity CSS property sets the transparency of an element.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
<q> element represents a short inline quotation.
RegExp object represents a regular expression, a notation for matching text patterns.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
:root pseudo-class matches the root element of the document, usually the <html> element.
<ruby> element produces small annotations that are rendered with its base text.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
text-shadow CSS property sets the position and styles of shadow on text.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
<video> element plays videos or movies, optionally with controls provided by the browser.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WebSocket API opens a two-way communication channel between the user's browser and a server.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
The following features are now available in Chrome:
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
\\u{}) represent Unicode characters within strings.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
word-break CSS property sets how lines break within words.
The following features are now available in Chrome Android:
navigator.permissions API checks whether a permission, such as access to geolocation data, has been granted.
\\u{}) represent Unicode characters within strings.
Upgrade-Insecure-Requests HTTP request header tells the server that the response should redirect to a secure (HTTPS) resource.
word-break CSS property sets how lines break within words.
The following features are now available in Edge:
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
background-repeat CSS property sets how a background image is tiled.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
border-image CSS property draws an image around an element.
<iframe> elements or two documents using a shared worker.
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
column-fill CSS property sets the distribution of content across columns in a multi-column layout.
column-span CSS property controls whether a child element extends across all columns of a multi-column parent.
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
<datalist> element sets recommended values for an <input> element. Browsers may show a dropdown menu of all values or match values as the user types.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
window.devicePixelRatio property is the ratio of the size of one CSS pixel to the vertical size of one physical pixel on the current display device.
bgColor, fgColor, alinkColor, linkColor, and vlinkColor properties get and set the background, foreground, active link, link, and visited link colors of that document.
document.open(), document.write(), document.writeln(), and document.close() methods write content to a document, possibly while that document is still loading.
DOMParser API parses XML or HTML source code from a string into a DOM Document.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
window.external.AddSearchProvider() and window.external.IsSearchProviderInstalled() do nothing. Historically, they added external search providers to the browser.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
navigator.getGamepads() API accesses and responds to signals from game controllers.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
rel="prefetch" attribute for the <link> HTML element is a hint to the browser that the user is likely to navigate to a resource, so the browser should preemptively fetch and cache the resource.
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
display property of its children.
navigation performance entry and the PerformanceNavigationTiming API measures navigation events, such as loading time or the number of redirects.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
page-break-before, page-break-inside, and page-break-after CSS properties are aliases to the break-before, break-inside, and break-after properties.
break-after, break-before, break-inside CSS properties control where printed pages start and end. Also known as pagination or page breaking.
:first, :left, and :right pseudo-classes select pages based on their position in sequence after pagination.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
pointerdown, and the PointerEvent API, represent general pointing inputs, from a wide range of devices, such as a mouse, pen or stylus, or touch with one or more fingers. Not to be confused with the pointer-events CSS property.
window.print() method opens the browser's print dialog.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
__proto__ property of objects partially exposes the prototype of an object.
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
::selection CSS pseudo-element selects text a user has highlighted.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
includes() method of strings returns whether a search string appears within the string.
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
repeat() method of strings returns the original string repeated a number of times.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
text-align-last CSS property sets the alignment of the last line of text before a forced line break.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
touchstart, touchmove, touchend, and touchcancel fire when users interact with a touch-sensitive surface, such as a screen or drawing tablet. These events are similar to mouse events.
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
for … of statement and enumerable with the methods entries(), keys(), and values().
\\u{}) represent Unicode characters within strings.
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
WEBGL_compressed_texture_s3tc extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
widows and orphans CSS properties set the minimum lines included in a text fragment created by page, column, or region breaks.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
word-break CSS property sets how lines break within words.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
writing-mode CSS property sets whether text is laid out horizontally or vertically, and left to right, or right to left.
lr, lr-tb, rl, rl-tb, tb, and tb-rl keyword values for the writing-mode CSS property set the text direction for elements in SVG 1.1 documents.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now available in Firefox:
fetch() method makes asynchronous HTTP requests.
Request.formData() and Response.formData() methods read a request or response body and return a FormData promise. You can use it to access the fields of a form submission.
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
The following features are now available in Firefox for Android:
fetch() method makes asynchronous HTTP requests.
Request.formData() and Response.formData() methods read a request or response body and return a FormData promise. You can use it to access the fields of a form submission.
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
rel="preconnect" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another origin, so the browser should preemptively start a connection to the href value's origin.
The following features are now available in Chrome:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
The following features are now available in Chrome Android:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
document.elementFromPoint() and document.elementsFromPoint() methods find the top-most element at a given point in the viewport, or all elements at a given point in the viewport, respectively.
The following features are now available in Firefox:
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
<ruby> element produces small annotations that are rendered with its base text.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
The following features are now available in Firefox for Android:
Array.from() and typed array .from() static methods copy items from an iterable or array-like object to make a new array.
Array.of() and typed array .of() static methods create new arrays from the values of any number of arguments.
BroadcastChannel API allows you to send messages between same-origin browsing contexts, such as between the same page loaded in multiple tabs.
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
<ruby> element produces small annotations that are rendered with its base text.
ruby-align CSS property sets the spacing and alignment of ruby annotation text when it does not fill its available space.
ruby-position CSS property sets the position of a ruby annotation in relation to its base text. Annotations can display over, under, or interleaved with the base text.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
The following features are now available in Chrome:
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
fetch() method makes asynchronous HTTP requests.
tab-size CSS property sets the width of the tab character.
The following features are now available in Chrome Android:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
mediaKeys property of HTMLMediaElement and the navigator.requestMediaKeySystemAccess() method control the playback of content subject to digital rights management. Also known as EME.
fetch() method makes asynchronous HTTP requests.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
tab-size CSS property sets the width of the tab character.
The following features are now available in Chrome:
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
includes() method of strings returns whether a search string appears within the string.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
repeat() method of strings returns the original string repeated a number of times.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Chrome Android:
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
image-rendering CSS property sets how images are scaled, retaining smoothness for photos, or hard edges for pixel art and QR codes.
pointer, any-pointer, hover, and any-hover CSS media queries set styles based on the presence of pointing devices and their ability to hover over elements. For example, most smartphones match the (hover: none) and (pointer: coarse) media query.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
includes() method of strings returns whether a search string appears within the string.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Firefox:
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
for … of statement and enumerable with the methods entries(), keys(), and values().
The following features are now available in Firefox for Android:
fill() method of arrays and typed arrays sets all or some items of an array to a given a value.
find() and findIndex() methods of arrays and typed arrays search an array for the first item that satisfies a test function.
for … of statement and enumerable with the methods entries(), keys(), and values().
The following features are now available in Firefox:
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
text-decoration: blink CSS declaration flashes text between visible and invisible.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Firefox for Android:
EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
navigator.mediaDevices.getUserMedia() API requests access to devices that produce audio or video streams, such as microphones or video cameras.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
scroll-behavior CSS property controls whether scrolling is smooth or snaps, for scroll actions not performed by the user such as those triggered by navigation.
scroll() and scrollBy() methods change the scroll position of overflow content within an element. Similar to setting scrollTop and scrollLeft properties, but with options setting whether the scroll should animate smoothly or jump. Note that scrollTo() is an alias for scroll().
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
text-decoration: blink CSS declaration flashes text between visible and invisible.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Chrome:
checkValidity(), reportValidity() and setCustomValidity().
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
The following features are now available in Chrome Android:
checkValidity(), reportValidity() and setCustomValidity().
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
The following features are now available in Firefox:
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Firefox for Android:
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
filter CSS property applies one or more graphic effects to an element. You can use filter functions, such as blur() and drop-shadow(), alone or combined to produce different effects. For instance, filter: blur(2px).
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Firefox:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
font-language-override CSS property sets which language-specific glyphs are displayed.
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
font-variant-position CSS property sets whether to use alternate glyphs for subscript and superscript text.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
The following features are now available in Firefox for Android:
copyWithin() method of arrays and typed arrays shifts or copies items of an array to another index of the array without changing its length.
font-feature-settings CSS property sets low-level OpenType feature tags for a font. When possible, use font-variant instead.
font-language-override CSS property sets which language-specific glyphs are displayed.
font-synthesis CSS shorthand property disables all font synthesis except the given kinds. To disable a specific kind of font synthesis, instead use the longhand properties such as font-synthesis-style and font-synthesis-weight.
font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs.
font-variant-caps CSS property sets whether text should be displayed in small caps, petite caps, or with capital letters designed for titles.
font-variant-east-asian CSS property controls glyph substitution and sizing in East Asian text.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
font-variant-numeric CSS property sets how numeric characters are displayed. For example, you can align columns of numbers or use zeroes that have a slash.
font-variant-position CSS property sets whether to use alternate glyphs for subscript and superscript text.
String.raw() static method interpolates template literal substitutions, but ignores escape sequences. It is the tag function for template literals.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
The following features are now available in Chrome:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
function*) create iterators that return multiple values, one after another, on-demand.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
The following features are now available in Chrome Android:
function*) create iterators that return multiple values, one after another, on-demand.
:indeterminate CSS pseudo-class selects any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, or radio buttons which are members of a group in which all radio buttons are unchecked.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
The following features are now available in Chrome:
navigator.getBattery() API obtains information about the device's battery, including charge level and status. Also known as the Battery API.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are now available in Chrome Android:
navigator.getBattery() API obtains information about the device's battery, including charge level and status. Also known as the Battery API.
EXT_blend_minmax extension for WebGL 1.0 contexts adds two blend equations, the minimum and maximum color components of the source and destination colors.
EXT_frag_depth extension for WebGL 1.0 and 2.0 contexts adds setting the depth value of a fragment from within the fragment shader.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<picture> element is used for art direction in responsive images, where a different image is displayed based on the <source> element.
screen.orientation.lock() method prevents changes to the screen orientation, typically in fullscreen applications such as games. For example, while locked, rotating a phone to the side won't change the screen orientation from landscape to portrait.
srcset and sizes attributes for <img> elements set a list of possible sources for the image and a corresponding list of size conditions for choosing a source, to show a responsive image that fits the size of the display.
Symbol value is a unique, non-enumerable primitive value used for encapsulation or information hiding. For example, a symbol can be a key of an object that can never collide with any other key.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
with JavaScript statement adds a given object to the chain of scopes used to evaluate names.
The following features are now available in Firefox:
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
navigator.mediaDevices.getDisplayMedia() method asks the user to choose a screen or portion of a screen (such as a window) to capture as a media stream.
The following features are now available in Firefox for Android:
@counter-style CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
DOMMatrix, DOMPoint, DOMQuad and DOMRect APIs represent points, rectangles, quadrilaterals and transformation matrices within JavaScript. They can be used in transformations in CSS, <canvas>, and SVG.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
The following features are now available in Safari:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
audioTracks and videoTracks APIs for media elements switch audio and video tracks during playback.
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
background-repeat CSS property sets how a background image is tiled.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
fastSeek() method seeks an <audio> or <video> element as fast as possible, by seeking to a keyframe instead of exactly the requested time.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
getVideoPlaybackQuality() method of HTMLVideoElement returns metrics that can be used to determine the playback quality of a video, such as how many frames were dropped.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WEBGL_compressed_texture_s3tc extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Chrome Android:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
<dialog> HTML element represents a modal or non-modal dialog box, such as a confirmation prompt or a subwindow used to enter data.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
The following features are now available in Firefox:
box-decoration-break CSS property sets whether box decorations, such as borders or backgrounds, of an element divided across a page, column, or region wraps each fragment or splits across the break.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
The following features are now available in Firefox for Android:
box-decoration-break CSS property sets whether box decorations, such as borders or backgrounds, of an element divided across a page, column, or region wraps each fragment or splits across the break.
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
navigator.getGamepads() API accesses and responds to signals from game controllers.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
The following features are now available in Safari on iOS:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
audioTracks and videoTracks APIs for media elements switch audio and video tracks during playback.
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
background-repeat CSS property sets how a background image is tiled.
EXT_shader_texture_lod extension for WebGL 1.0 and 2.0 contexts adds texture functions to the OpenGL ES Shading Language such that the shader writer explicitly controls of the level of detail (LOD).
fastSeek() method seeks an <audio> or <video> element as fast as possible, by seeking to a keyframe instead of exactly the requested time.
isolation CSS property creates a new stacking context, which impacts z-index ordering and blend modes.
mix-blend-mode CSS property blends an element's content with its background or parent elements using blend modes like multiply, difference, or color.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
The following features are now available in Chrome:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.
<dialog> HTML element represents a modal or non-modal dialog box, such as a confirmation prompt or a subwindow used to enter data.
navigator.hardwareConcurrency property is the number of logical processors available to run threads on the user's computer.
shape-outside CSS property, along with shape-margin and shape-image-threshold, sets the shape around which adjacent content will wrap.
circle(), ellipse(), inset(), and polygon() CSS shape functions create shapes for use with clip-path and shape-outside.
The following features are now available in Chrome:
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
WEBGL_draw_buffers extension for WebGL 1.0 contexts enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Chrome Android:
@font-face CSS at-rule creates a custom font-family value. The at-rule's descriptors set the font's name, source, and various display settings.
repeat() method of strings returns the original string repeated a number of times.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
touch-action CSS property sets whether an element on a touch screen can be panned or pinched to zoom.
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
WeakSet object stores unique values of any type without creating strong references to the values, such that membership in the set does not prevent garbage collection of the value.
will-change CSS property gives hints to the browser about expected changes to an element's scroll position, contents, or style. These hints allow browsers to optimize for upcoming style changes.
The following features are now available in Firefox:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
fastSeek() method seeks an <audio> or <video> element as fast as possible, by seeking to a keyframe instead of exactly the requested time.
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
line and position settings in WebVTT files or the lineAlign and positionAlign properties of VTTCue using JavaScript.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
The following features are now available in Firefox for Android:
navigator.sendBeacon() method asynchronously sends an HTTP POST request with a limited amount of data, typically for app state, events, and analytics data. The one-way beacon is guaranteed to be initiated before the browser unloads the page, but the sender does not get to handle the response.
CSS.escape() static method escapes a string so that it can be used in a valid CSS selector.
-- that set values you can reuse with the var() function. For example, you can set a --key-color property to reuse as border-color: var(--key-color). Also known as CSS variables.
fastSeek() method seeks an <audio> or <video> element as fast as possible, by seeking to a keyframe instead of exactly the requested time.
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
line and position settings in WebVTT files or the lineAlign and positionAlign properties of VTTCue using JavaScript.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
The following features are now available in Firefox:
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
alpha parameter of a 2D canvas's getContext() method sets whether the canvas has an alpha transparency channel. If set to false, then this permits the browser to optimize compositing for an opaque canvas.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
The following features are now available in Firefox for Android:
alpha parameter of a 2D canvas's getContext() method sets whether the canvas has an alpha transparency channel. If set to false, then this permits the browser to optimize compositing for an opaque canvas.
WEBGL_color_buffer_float extension for WebGL 1.0 contexts adds the 32-bit floating-point type RGBA32F as a color-renderable format.
WEBGL_compressed_texture_etc1 extension for WebGL 1.0 and 2.0 contexts adds the ETC1 compressed texture format to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Chrome:
background-blend-mode CSS property blends an element's background image and background color using blend modes like multiply, difference, or color.
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
navigator.getGamepads() API accesses and responds to signals from game controllers.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
The following features are now available in Chrome Android:
document.fonts API dynamically loads custom fonts and tracks when fonts are loading or ready to use.
navigator.getGamepads() API accesses and responds to signals from game controllers.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
The following features are now available in Chrome:
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
The following features are now available in Chrome Android:
EXT_texture_filter_anisotropic extension for WebGL 1.0 and 2.0 contexts adds anisotropic filtering (AF). AF improves the quality of mipmapped texture access when viewing a textured primitive at an oblique angle.
font-variant-ligatures CSS property sets how characters can be visually combined for readability or stylistic reasons.
normalize() method of strings returns a Unicode normal form of a string as a new string. More than one code point sequence can represent the same characters. You can use the normalize() method to find canonically or compatibly equivalent strings.
The following features are now available in Firefox:
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
navigator.getGamepads() API accesses and responds to signals from game controllers.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
<input type="number"> HTML element represents numeric input data.
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
The following features are now available in Firefox for Android:
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
<input type="number"> HTML element represents numeric input data.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
codePointAt() method returns the numeric value of the UTF-16 code point at an index of the string. The fromCodePoint() method returns a string created from one or more code points.
The following features are now available in Firefox:
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
WEBGL_draw_buffers extension for WebGL 1.0 contexts enables a fragment shader to write to several textures, which is useful for deferred shading, for example.
The following features are now available in Firefox for Android:
willReadFrequently parameter of a canvas's getContext() method permits the browser to optimize for frequent getImageData() calls by avoiding hardware acceleration. Also known as multiple readback.
EXT_sRGB extension for WebGL 1.0 contexts adds sRGB support to textures and framebuffer objects.
<input type="file"> element or drag-and-drop events. You may also send file data to other APIs, such as creating images or drawing on canvases.
The following features are now available in Chrome:
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
SpeechSynthesis API converts text to speech with artificial voices.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
The following features are now available in Chrome Android:
font-kerning CSS property sets whether kerning data from a font is used to adjust the space between letters.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
SpeechSynthesis API converts text to speech with artificial voices.
text-underline-position CSS property sets the position of underlines on text. For example, text-underline-position: under places the underline below the text, avoiding crossing descenders. The underline may be further adjusted by the text-underline-offset property.
WEBGL_debug_renderer_info extension for WebGL 1.0 and 2.0 contexts exposes information about the graphics driver for debugging purposes.
The following features are now available in Firefox:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
cursor CSS property styles the pointer, allowing you to provide hints to the user on how to interact with the hovered element.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Firefox for Android:
all CSS property is a shorthand for all CSS properties, except for direction and unicode-bidi. It accepts only the keywords for explicit defaulting (such as initial and inherit), since they are the only values supported on all CSS properties.
unset keyword resets any CSS property, removing any values previously set by the author, user, or browser. Inherited properties (like color) reset to the parent element's computed value. Non-inherited properties (like display) reset to the specified initial value (inline).
The following features are now available in Chrome:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
alpha parameter of a 2D canvas's getContext() method sets whether the canvas has an alpha transparency channel. If set to false, then this permits the browser to optimize compositing for an opaque canvas.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
navigator.vibrate() method makes a tactile alert, if the device is equipped with a haptic motor.
The following features are now available in Chrome Android:
alpha parameter of a 2D canvas's getContext() method sets whether the canvas has an alpha transparency channel. If set to false, then this permits the browser to optimize compositing for an opaque canvas.
object-fit CSS property sets how images, videos, and other replaced elements are scaled within their container.
object-position CSS property places images, videos, and other replaced elements within their boxes.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
navigator.vibrate() method makes a tactile alert, if the device is equipped with a haptic motor.
The following features are now available in Firefox:
function*) create iterators that return multiple values, one after another, on-demand.
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
The following features are now available in Firefox for Android:
function*) create iterators that return multiple values, one after another, on-demand.
image-orientation CSS property corrects the rotation of an image using the image's metadata, such as EXIF.
The following features are now available in Chrome:
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
DOMParser API parses XML or HTML source code from a string into a DOM Document.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
The following features are now available in Chrome Android:
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
DOMParser API parses XML or HTML source code from a string into a DOM Document.
MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
The following features are now available in Chrome:
background-repeat CSS property sets how a background image is tiled.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
The following features are now available in Chrome Android:
ANGLE_instanced_arrays extension for WebGL 1.0 contexts draws the same object multiple times or groups of similar objects multiple times, if the group shares the same vertex data, primitive count and type.
background-repeat CSS property sets how a background image is tiled.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
The following features are now available in Firefox:
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
The following features are now available in Firefox for Android:
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
MediaRecorder API captures data generated by MediaStream or HTMLMediaElement objects for analysis, processing, or saving to disk. Also known as the Media Recording API.
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
OfflineAudioContext API represents an audio processing graph that writes to an AudioBuffer instead of an output device.
The following features are now available in Safari:
background-position CSS property offsets the initial position of background images relative to the background origin.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
image-rendering: crisp-edges CSS declaration scales images to preserve lines without blurring.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
<video> or <audio> elements can be coordinated by a MediaController instance, for example to synchronize a sign-language interpreter track with the main video track.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
Notification() constructor shows a message to the user, typically using the notification system of the host operating system.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
<output> element represents the result of a calculation, user action, or form entry.
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
SpeechSynthesis API converts text to speech with artificial voices.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
:past and :future CSS pseudo-classes match prior or upcoming text track cues during media playback.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WEBGL_compressed_texture_pvrtc extension for WebGL 1.0 and 2.0 contexts adds PVRTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
The following features are now available in Firefox:
focus and blur, fire when an element gets or loses focus.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
repeat() method of strings returns the original string repeated a number of times.
The following features are now available in Firefox for Android:
focus and blur, fire when an element gets or loses focus.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
repeat() method of strings returns the original string repeated a number of times.
The following features are now available in Safari on iOS:
background-position CSS property offsets the initial position of background images relative to the background origin.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
image-rendering: crisp-edges CSS declaration scales images to preserve lines without blurring.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
<video> or <audio> elements can be coordinated by a MediaController instance, for example to synchronize a sign-language interpreter track with the main video track.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
<output> element represents the result of a calculation, user action, or form entry.
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
SpeechSynthesis API converts text to speech with artificial voices.
text-emphasis CSS property sets position and style for text emphasis marks, especially for East Asian languages.
:past and :future CSS pseudo-classes match prior or upcoming text track cues during media playback.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WEBGL_compressed_texture_pvrtc extension for WebGL 1.0 and 2.0 contexts adds PVRTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Chrome:
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Chrome Android:
OES_texture_float_linear extension for WebGL 1.0 and 2.0 contexts adds linear filtering with floating-point pixel types for textures.
OES_texture_half_float_linear extension for WebGL 1.0 contexts adds linear filtering with half floating-point pixel types for textures.
PerformanceResourceTiming entries report when network events happen while loading a resource, such as when connections start and end. You can use this information to measure loading times.
The following features are now available in Firefox:
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
The following features are now available in Firefox for Android:
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
The following features are now available in Chrome:
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
The following features are now available in Chrome Android:
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
WEBGL_compressed_texture_pvrtc extension for WebGL 1.0 and 2.0 contexts adds PVRTC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
The following features are now available in Firefox:
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
<data> element links a given piece of content with a machine-readable translation.
Notification() constructor shows a message to the user, typically using the notification system of the host operating system.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
WEBGL_compressed_texture_s3tc extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Firefox for Android:
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
"copy", "cut", and "paste" events fire on elements when the user starts an action with the clipboard.
<data> element links a given piece of content with a machine-readable translation.
Notification() constructor shows a message to the user, typically using the notification system of the host operating system.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
@supports at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
<time> HTML element represents a time, such as a calendar date, clock time, or duration. It may include the datetime attribute to translate dates into machine-readable format.
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Chrome:
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
The following features are now available in Chrome Android:
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
OES_texture_half_float extension for WebGL 1.0 contexts adds texture formats with 16-bit (also known as half float) and 32-bit floating-point components.
:scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.
The following features are now available in Firefox:
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
The following features are now available in Firefox for Android:
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
The following features are now available in Chrome Android:
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Firefox:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
The following features are now available in Firefox for Android:
document.caretPositionFromPoint() method finds an insertion point, represented by a DOM node and an offset within that node, for given coordinates in the viewport.
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
The following features are now available in Chrome:
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
compositionstart, compositionupdate, and compositionend events fire when an input method editor adds characters that might not be commonly available on keyboards. Examples of these characters are emoji, logograms in Asian languages, or input from speech recognition processors.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
<main> element represents the dominant content of a document. It is commonly used together with <header> and <footer>.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
<template> HTML element holds HTML fragments which you can clone and insert into the document using JavaScript.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
WEBGL_compressed_texture_s3tc extension for WebGL 1.0 and 2.0 contexts adds S3TC compressed texture formats to compressedTexImage2D() and compressedTexSubImage2D().
WEBGL_depth_texture extension for WebGL 1.0 contexts defines 2D depth and depth-stencil textures.
WEBGL_lose_context extension for WebGL 1.0 and 2.0 contexts simulates losing and restoring a WebGLRenderingContext or WebGL2RenderingContext.
The following features are now available in Chrome:
background-position CSS property offsets the initial position of background images relative to the background origin.
widows and orphans CSS properties set the minimum lines included in a text fragment created by page, column, or region breaks.
The following features are now available in Chrome Android:
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
background-position CSS property offsets the initial position of background images relative to the background origin.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
capture HTML attribute for <input type="file"> elements allows the user to capture media using the device's camera or microphone.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
:past and :future CSS pseudo-classes match prior or upcoming text track cues during media playback.
touchstart, touchmove, touchend, and touchcancel fire when users interact with a touch-sensitive surface, such as a screen or drawing tablet. These events are similar to mouse events.
translate HTML attribute marks whether an element's text should be translated.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
widows and orphans CSS properties set the minimum lines included in a text fragment created by page, column, or region breaks.
The following features are now available in Firefox:
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
The following features are now available in Firefox for Android:
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
TextEncoder API transforms a stream of code points into a byte stream with UTF-8 encoding, and TextDecoder does the reverse.
URL object represents a web address, like https://example.com/, and parts of the address, such as the domain, path, and query string (as URLSearchParams).
vw, vh, vmin, and vmax CSS viewport units are relative to the size of the viewport, and are used to size elements in relation to the viewport's dimensions.
The following features are now available in Chrome:
Intl API provides language sensitive string comparison, number formatting, date and time formatting, and more.
mask-type CSS property on an SVG <mask> element sets whether the mask is a luminance or alpha mask.
OES_element_index_uint extension for WebGL 1.0 contexts adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements().
OES_vertex_array_object extension for WebGL 1.0 contexts adds vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and names for different sets of vertex data.
requestAnimationFrame() method schedules a function that runs before the next repaint. You can use it to animate content with JavaScript.
The following features are now available in Firefox:
window.devicePixelRatio property is the ratio of the size of one CSS pixel to the vertical size of one physical pixel on the current display device.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
The following features are now available in Firefox for Android:
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
window.devicePixelRatio property is the ratio of the size of one CSS pixel to the vertical size of one physical pixel on the current display device.
document.visibilityState and document.hidden properties tell you whether the page is visible to the user (for example, it's not minimized or in a background tab).
Proxy and Reflect JavaScript built-ins intercept and define custom behavior for fundamental language operations (such as property lookup, assignment, enumeration, or function invocation).
The following features are now available in Chrome:
overflow-wrap CSS property breaks a line of text onto multiple lines inside the targeted element in an otherwise unbreakable place to prevent overflow. The legacy property is word-wrap.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
:past and :future CSS pseudo-classes match prior or upcoming text track cues during media playback.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
The following features are now available in Firefox:
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
The following features are now available in Firefox for Android:
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
startsWith() and endsWith() methods of strings returns whether a search string appears at the beginning or end of the provided string.
wheel event fires when the user moves a mouse wheel or similar spatially rotating input device.
The following features are now available in Firefox:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
The following features are now available in Firefox for Android:
animation CSS property animates an element's style over time, using keyframes described in @keyframes rules.
calc() CSS function computes mathematical expressions such a calc(100%/3 - 1em).
transform CSS property and its 2D transform functions allow rotating, scaling, skewing, and translating an element. Arbitrary 2D transforms are also possible using a transformation matrix.
transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
transition shorthand CSS property sets how changes to an element's styles may occur over time. Transitions can be applied to specific CSS properties, all properties, or none.
The following features are now available in Chrome:
touchstart, touchmove, touchend, and touchcancel fire when users interact with a touch-sensitive surface, such as a screen or drawing tablet. These events are similar to mouse events.
The following features are now available in Safari on iOS:
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
<dfn> element marks a term to be defined, styling text as italic by default.
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
:first, :left, and :right pseudo-classes select pages based on their position in sequence after pagination.
ping attribute for <a> elements sets a URL to send a POST request to when the <a> is clicked. This is typically used for outbound link reporting.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
translate HTML attribute marks whether an element's text should be translated.
The following features are now available in Firefox:
word-break CSS property sets how lines break within words.
The following features are now available in Firefox for Android:
word-break CSS property sets how lines break within words.
The following features are now available in Chrome:
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
The following features are now available in Firefox:
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
The following features are now available in Safari:
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
<dfn> element marks a term to be defined, styling text as italic by default.
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
:first, :left, and :right pseudo-classes select pages based on their position in sequence after pagination.
ping attribute for <a> elements sets a URL to send a POST request to when the <a> is clicked. This is typically used for outbound link reporting.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
<track> element is used as a child of the media elements that lets you specify a timed text track to be displayed in parallel with the media element.
translate HTML attribute marks whether an element's text should be translated.
<track> element, and the VTTCue API can be used to create or update cues dynamically.
VTTCue API updates various aspects of cues dynamically, such as alignment, size and position.
The following features are now available in Chrome:
srcdoc attribute for the <iframe> HTML element sets a string of HTML to embed in the document. The value of srcdoc overrides loading a document from the src attribute.
<input type="color"> HTML element shows a color picker from which users can choose a color value.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
Notification() constructor shows a message to the user, typically using the notification system of the host operating system.
showNotification() method, sent from installed web applications (for example, saved to the Home Screen on Safari for iOS), show a message to the user, typically using the notification system of the host operating system.
The following features are now available in Chrome Android:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
<abbr> HTML element represents an abbreviation or acronym.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
alignment-baseline CSS property sets which baseline of an element is aligned with the corresponding baseline of its parent.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
Array.isArray() static method checks whether a value is an array.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
baseline-shift CSS property sets the position of an element relative to its dominant baseline.
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
<bdo> element overrides the directionality of text, so that the text within is rendered in a different direction than the surrounding text.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border-radius CSS property rounds the corners of the border drawn around an element.
border CSS property sets the color, style, and width of the line around an element.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
<iframe> elements or two documents using a shared worker.
@charset CSS at-rule specifies the character encoding of an external style sheet.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
clip CSS property sets the visible area of an absolutely positioned element.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
data: scheme and which directly contain data rather than point to remote resources.
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
window.devicePixelRatio property is the ratio of the size of one CSS pixel to the vertical size of one physical pixel on the current display device.
<dfn> element marks a term to be defined, styling text as italic by default.
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
<div> HTML element is the generic container for content.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
:empty CSS pseudo-class matches elements without child elements.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
window.external.AddSearchProvider() and window.external.IsSearchProviderInstalled() do nothing. Historically, they added external search providers to the browser.
<fieldset> and <legend> elements group several form control elements within a web form.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
focus and blur, fire when an element gets or loses focus.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<form> element contains interactive controls for submitting information.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
input event fires when a form control changes or an element with the contenteditable attribute changes.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="number"> HTML element represents numeric input data.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
rel="prefetch" attribute for the <link> HTML element is a hint to the browser that the user is likely to navigate to a resource, so the browser should preemptively fetch and cache the resource.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
window.matchMedia() method checks whether a media query applies to the document.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
opacity CSS property sets the transparency of an element.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
<output> element represents the result of a calculation, user action, or form entry.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
page-break-before, page-break-inside, and page-break-after CSS properties are aliases to the break-before, break-inside, and break-after properties.
:first, :left, and :right pseudo-classes select pages based on their position in sequence after pagination.
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
ping attribute for <a> elements sets a URL to send a POST request to when the <a> is clicked. This is typically used for outbound link reporting.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
window.print() method opens the browser's print dialog.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
__proto__ property of objects partially exposes the prototype of an object.
<q> element represents a short inline quotation.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
RegExp object represents a regular expression, a notation for matching text patterns.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
resize CSS property sets whether an element can be resized by the user, and on which axes.
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
:root pseudo-class matches the root element of the document, usually the <html> element.
<ruby> element produces small annotations that are rendered with its base text.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
::selection CSS pseudo-element selects text a user has highlighted.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
text-shadow CSS property sets the position and styles of shadow on text.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
<video> element plays videos or movies, optionally with controls provided by the browser.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
WebSocket API opens a two-way communication channel between the user's browser and a server.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now available in Firefox:
background-position CSS property offsets the initial position of background images relative to the background origin.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
The following features are now available in Firefox for Android:
background-position CSS property offsets the initial position of background images relative to the background origin.
border CSS property sets the color, style, and width of the line around an element.
DOMParser API parses XML or HTML source code from a string into a DOM Document.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
for...of loop operates on a sequence of values sourced from an iterable object, such as arrays, array-like objects, DOM collections, iterators, generators, and user-defined iterables. All built-in iterators inherit from the Iterator class.
MutationObserver API watches for changes to the DOM tree and calls a callback function when DOM changes occur.
WebSocket API opens a two-way communication channel between the user's browser and a server.
The following features are now available in Chrome:
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
translate HTML attribute marks whether an element's text should be translated.
The following features are now available in Firefox:
DOMParser API parses XML or HTML source code from a string into a DOM Document.
The following features are now available in Chrome:
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
:first, :left, and :right pseudo-classes select pages based on their position in sequence after pagination.
Sourcemap HTTP response header links generated code to a source map, so the browser shows the original source in a debugger. This makes it easier to work with minified or transpiled code.
The following features are now available in Firefox:
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
WebSocket API opens a two-way communication channel between the user's browser and a server.
The following features are now available in Chrome:
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
dirname attribute of <textarea> and <input> HTML elements includes the field's writing direction as form data on submission.
The following features are now available in Firefox:
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
<bdo> element overrides the directionality of text, so that the text within is rendered in a different direction than the surrounding text.
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
The following features are now available in Firefox for Android:
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
<bdo> element overrides the directionality of text, so that the text within is rendered in a different direction than the surrounding text.
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
The following features are now available in Chrome:
<bdi> element isolates text that may have a different text direction from its surrounding text. This prevents the browser's bidirectional text algorithm from affecting or being affected by the direction of the surrounding text.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
hashchange event fires when the URL fragment identifier (the part of the URL starting with #) of the current page has changed.
The following features are now available in Firefox:
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
text-overflow CSS property with a string value sets the string representing clipped text.
The following features are now available in Firefox for Android:
text-overflow CSS property with a string value sets the string representing clipped text.
The following features are now available in Chrome:
<dfn> element marks a term to be defined, styling text as italic by default.
@page CSS at-rule sets the page-specific dimensions and margins for content such as printed documents, ebooks, or slides.
The following features are now available in Safari on iOS:
alignment-baseline CSS property sets which baseline of an element is aligned with the corresponding baseline of its parent.
Array.isArray() static method checks whether a value is an array.
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
<input type="date"> and <input type="time"> HTML elements show date and time pickers.
<input type="number"> HTML element represents numeric input data.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
window.matchMedia() method checks whether a media query applies to the document.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
The following features are now available in Chrome:
setPosition() and setOrientation() methods of the AudioListener API set the virtual position and orientation of a person relative to sound sources, to spatialize audio in a Web Audio context.
download attribute for <a> elements loads the target URL as a file to be saved, instead of navigating to it. An optional attribute value sets a default file name.
The following features are now available in Firefox:
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
The following features are now available in Firefox for Android:
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
The following features are now available in Chrome:
<input type="file" webkitdirectory> HTML element shows a file picker from which users can choose a folder to upload with the form.
navigator.registerProtocolHandler() method declares a site's ability to handle an address scheme (also known as a protocol). For example, an email site can register to open mailto: URLs or a VoIP site to open tel: URLs.
The following features are now available in Firefox:
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
input event fires when a form control changes or an element with the contenteditable attribute changes.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
window.matchMedia() method checks whether a media query applies to the document.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
The following features are now available in Firefox for Android:
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
input event fires when a form control changes or an element with the contenteditable attribute changes.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
window.matchMedia() method checks whether a media query applies to the document.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
@media print queries, the beforeprint and afterprint events allow you to change the page for printing and restore the page after printing.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
touchstart, touchmove, touchend, and touchcancel fire when users interact with a touch-sensitive surface, such as a screen or drawing tablet. These events are similar to mouse events.
WeakMap object holds key-value pairs that do not create strong references to its keys, such that value data can be associated with a key without preventing garbage collection of the key.
The following features are now available in Safari:
alignment-baseline CSS property sets which baseline of an element is aligned with the corresponding baseline of its parent.
background-clip CSS property sets the extent of the background: the padding box, the content box, or the default border box.
background-origin CSS property sets the background starting position relative to the border and padding of an element.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
contenteditable="plaintext-only" global HTML attribute allows the user to edit the content of an element, but prevents rich-text formatting.
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
<input type="number"> HTML element represents numeric input data.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
window.matchMedia() method checks whether a media query applies to the document.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
The following features are now available in Chrome:
<details> element is a disclosure widget which can be expanded to reveal additional content. When closed, only the nested <summary> element is visible.
ping attribute for <a> elements sets a URL to send a POST request to when the <a> is clicked. This is typically used for outbound link reporting.
The following features are now available in Firefox:
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
resize CSS property sets whether an element can be resized by the user, and on which axes.
The following features are now available in Firefox for Android:
accesskey global HTML attribute gives a hint for generating a keyboard shortcut for the current element. The attribute value must consist of a single printable character.
The following features are now available in Chrome:
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
The following features are now available in Chrome:
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
box-sizing CSS property sets whether an element's width and height are calculated based on the content-box, which does not count the size of borders or padding, or border-box, which does count them.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
OES_standard_derivatives extension for WebGL 1.0 contexts adds the GLSL derivative functions dFdx, dFdy, and fwidth.
OES_texture_float extension for WebGL 1.0 contexts adds floating-point pixel types for textures.
<output> element represents the result of a calculation, user action, or form entry.
The following features are now available in Firefox:
Array.isArray() static method checks whether a value is an array.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
border-radius CSS property rounds the corners of the border drawn around an element.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
console API logs debugging messages to the browser development tools' console.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
<output> element represents the result of a calculation, user action, or form entry.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
The following features are now available in Firefox for Android:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
<abbr> HTML element represents an abbreviation or acronym.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
rel="alternate stylesheet" attribute for the <link> HTML element offers an alternative style option to users.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
Array.isArray() static method checks whether a value is an array.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
atob() and btoa() global functions encode and decode strings to and from base 64, respectively.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border-radius CSS property rounds the corners of the border drawn around an element.
box-shadow CSS property applies shadow effects around an element's frame. This can create drop shadow and inner shadow effects.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
@charset CSS at-rule specifies the character encoding of an external style sheet.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
clip CSS property sets the visible area of an absolutely positioned element.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
data: scheme and which directly contain data rather than point to remote resources.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
<dfn> element marks a term to be defined, styling text as italic by default.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
<div> HTML element is the generic container for content.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
:empty CSS pseudo-class matches elements without child elements.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
window.external.AddSearchProvider() and window.external.IsSearchProviderInstalled() do nothing. Historically, they added external search providers to the browser.
<fieldset> and <legend> elements group several form control elements within a web form.
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<form> element contains interactive controls for submitting information.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
<area> and <map> elements define a clickable area on an image.
ime-mode CSS property sets the state of the input method editor for text fields.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
rel="prefetch" attribute for the <link> HTML element is a hint to the browser that the user is likely to navigate to a resource, so the browser should preemptively fetch and cache the resource.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
opacity CSS property sets the transparency of an element.
fill-opacity, and stroke-opacity SVG attributes and CSS properties control the transparency of a stroke or fill of an SVG element.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
<output> element represents the result of a calculation, user action, or form entry.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
__proto__ property of objects partially exposes the prototype of an object.
<q> element represents a short inline quotation.
RegExp object represents a regular expression, a notation for matching text patterns.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
navigator.registerProtocolHandler() method declares a site's ability to handle an address scheme (also known as a protocol). For example, an email site can register to open mailto: URLs or a VoIP site to open tel: URLs.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
:root pseudo-class matches the root element of the document, usually the <html> element.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-shadow CSS property sets the position and styles of shadow on text.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
<video> element plays videos or movies, optionally with controls provided by the browser.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
The following features are now available in Chrome:
window.external.AddSearchProvider() and window.external.IsSearchProviderInstalled() do nothing. Historically, they added external search providers to the browser.
window.matchMedia() method checks whether a media query applies to the document.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
WebGLRenderingContext API is the "webgl" rendering context for the <canvas> element. It represents a space for drawing two- and three-dimensional graphics and animations.
The following features are now available in Chrome:
<figure> and <figcaption> HTML elements represent an illustration, diagram, text, or other self-contained reference content, with an optional caption.
rel="prefetch" attribute for the <link> HTML element is a hint to the browser that the user is likely to navigate to a resource, so the browser should preemptively fetch and cache the resource.
The following features are now available in Safari on iOS:
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
background-size CSS property scales or stretches a background based on the size of the element (with the contain and cover keywords), a length, or percentage.
border-radius CSS property rounds the corners of the border drawn around an element.
<iframe> elements or two documents using a shared worker.
DeviceMotion and DeviceOrientation events report the movement and orientation of the browser's device in physical space. Note that coordinates can differ noticeably between platforms and devices.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<hgroup> element represents a heading and related content.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
<ruby> element produces small annotations that are rendered with its base text.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
WebSocket API opens a two-way communication channel between the user's browser and a server.
The following features are now available in Chrome:
dataset API attaches and accesses custom data on elements, using either the dataset property of HTMLElement or attributes prefixed with data-.
<input type="number"> HTML element represents numeric input data.
<mark> element represents text which is marked or highlighted for reference or notation purposes.
The following features are now available in Chrome:
<meter> element represents a scalar value within a known range or a fractional value, typically shown as a progress bar.
performance global object and the PerformanceObserver API provide access to performance-related information for the current execution context.
<progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
The following features are now available in Safari:
Array.isArray() static method checks whether a value is an array.
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
border-radius CSS property rounds the corners of the border drawn around an element.
<iframe> elements or two documents using a shared worker.
:default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.
<form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
rel="dns-prefetch" attribute for the <link> HTML element is a hint to the browser that the page or user is likely to request resources from another domain, so the browser should preemptively resolve DNS for the href value's domain.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
<ruby> element produces small annotations that are rendered with its base text.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
EventSource API creates a connection to a server and listens to a stream of events sent by the server.
WebSocket API opens a two-way communication channel between the user's browser and a server.
The following features are now available in Safari on iOS:
background-origin CSS property sets the background starting position relative to the border and padding of an element.
@charset CSS at-rule specifies the character encoding of an external style sheet.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
The following features are now available in Chrome:
<article> element represents self-contained content, which is intended to be independently distributable or reusable, such as a comment, a blog post, or news article.
<aside> element represents a portion of a document whose content is only indirectly related to the document's main content.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
<header> and <footer> HTML elements represent content that precedes and follows the main page content, respectively.
<hgroup> element represents a heading and related content.
window.history API manipulates the browser session history, from navigations to state management, in the tab or frame that the current page is loaded in.
sandbox attribute for the <iframe> HTML element sets many security restrictions on the iframe, such as preventing form submissions or opening modal dialogs. Optional allow- values relax specific restrictions.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
<nav> element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
<ruby> element produces small annotations that are rendered with its base text.
<input type="search"> HTML element represents a text field for search queries.
<section> element is a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.
SharedWorker() constructor runs a script in its own thread, which can send and receive messages with other scripts running at the same origin.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
WebSocket API opens a two-way communication channel between the user's browser and a server.
The following features are now available in Safari on iOS:
<abbr> HTML element represents an abbreviation or acronym.
autofocus HTML attribute gives focus to an element on page load.
baseline-shift CSS property sets the position of an element relative to its dominant baseline.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
glyph-orientation-vertical CSS property sets the orientation of glyphs in text rendered in a vertical writing mode.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
The following features are now available in Chrome:
Array.isArray() static method checks whether a value is an array.
border-radius CSS property rounds the corners of the border drawn around an element.
<iframe> elements or two documents using a shared worker.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
Strict-Transport-Security HTTP response header informs browsers that the site should only be accessed using HTTPS, and that any future attempts to access it using HTTP should automatically be converted to HTTPS. Also known as HSTS.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
resize CSS property sets whether an element can be resized by the user, and on which axes.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
The following features are now available in Firefox:
background CSS property is a shorthand that sets several background properties at once.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
linear-gradient() and radial-gradient() CSS functions and their repeating counterparts create backgrounds that progress smoothly between multiple colors.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
rem CSS length unit is a font-relative length that is equal to the font size of the root HTML element which for most browsers is 16px.
The following features are now available in Chrome:
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
<video> element plays videos or movies, optionally with controls provided by the browser.
The following features are now available in Firefox:
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
navigator.geolocation API requests the user's latitude, longitude, heading, and speed.
getComputedStyle() global method returns an CSSStyleDeclaration object that represents all CSS declarations applied to a given element.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
text-shadow CSS property sets the position and styles of shadow on text.
navigator.userAgent property and several others loosely identify a browser. Selectively showing content based on the user agent string, also known as user agent sniffing, is unreliable. Consider using feature detection or user agent client hints instead.
<video> element plays videos or movies, optionally with controls provided by the browser.
The following features are now available in Safari:
<abbr> HTML element represents an abbreviation or acronym.
autofocus HTML attribute gives focus to an element on page load.
baseline-shift CSS property sets the position of an element relative to its dominant baseline.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
@charset CSS at-rule specifies the character encoding of an external style sheet.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
Worker() constructor runs a script in its own thread, which can send and receive messages with the script that created it. Also known as web workers.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
glyph-orientation-vertical CSS property sets the orientation of glyphs in text rendered in a vertical writing mode.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
JSON API provides static methods for parsing values from and converting values to JavaScript Object Notation (JSON), a serialization format for objects, arrays, numbers, strings, Boolean values, and null.
localStorage and sessionStorage APIs store data as key-value pairs. While localStorage persists across sessions, sessionStorage data is discarded when the page is closed.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
resize CSS property sets whether an element can be resized by the user, and on which axes.
setInterval() global function repeatedly executes provided code on a given delay, and the accompanying clearInterval() cancels the interval.
setTimeout() global function executes provided code after a given duration of time, and the accompanying clearTimeout() cancels the timer.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
The following features are now available in Safari on iOS:
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
border CSS property sets the color, style, and width of the line around an element.
<input type="email">, <input type="tel">, and <input type="url"> HTML elements represent email address, telephone number, and URL fields in a form.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<video> element plays videos or movies, optionally with controls provided by the browser.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now available in Chrome:
<abbr> HTML element represents an abbreviation or acronym.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
@charset CSS at-rule specifies the character encoding of an external style sheet.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
<input type="file" multiple> HTML element shows a file picker from which users can choose one or more files to upload with a form.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
pointer-events CSS property sets whether a user can interact with an element using a mouse, touch, or other pointing input device.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
@supports (-webkit-transform-3d) CSS media query is a standardized compatibility alternative to @supports (transform-style).
text-shadow CSS property sets the position and styles of shadow on text.
The following features are now available in Chrome:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
alignment-baseline CSS property sets which baseline of an element is aligned with the corresponding baseline of its parent.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-attachment CSS property sets whether an element's background image or gradient moves as the element scrolls.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
baseline-shift CSS property sets the position of an element relative to its dominant baseline.
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border CSS property sets the color, style, and width of the line around an element.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
clip CSS property sets the visible area of an absolutely positioned element.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
contenteditable global HTML attribute allows the user to edit the content of an element, such as inserting or deleting text.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
window.devicePixelRatio property is the ratio of the size of one CSS pixel to the vertical size of one physical pixel on the current display device.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
<div> HTML element is the generic container for content.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
:empty CSS pseudo-class matches elements without child elements.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
<fieldset> and <legend> elements group several form control elements within a web form.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
focus and blur, fire when an element gets or loses focus.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
<form> element contains interactive controls for submitting information.
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
input event fires when a form control changes or an element with the contenteditable attribute changes.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
opacity CSS property sets the transparency of an element.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
page-break-before, page-break-inside, and page-break-after CSS properties are aliases to the break-before, break-inside, and break-after properties.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
window.print() method opens the browser's print dialog.
__proto__ property of objects partially exposes the prototype of an object.
<q> element represents a short inline quotation.
:read-only and :read-write CSS pseudo-classes match elements that are read-only or read-write, respectively. For example, :read-only matches <input> and <textarea> elements with the readonly attribute.
RegExp object represents a regular expression, a notation for matching text patterns.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
:root pseudo-class matches the root element of the document, usually the <html> element.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
::selection CSS pseudo-element selects text a user has highlighted.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now available in Safari on iOS:
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
:empty CSS pseudo-class matches elements without child elements.
focus and blur, fire when an element gets or loses focus.
<form> element contains interactive controls for submitting information.
input event fires when a form control changes or an element with the contenteditable attribute changes.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
:lang() CSS functional pseudo-class matches elements based on their content language.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
<q> element represents a short inline quotation.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
The following features are now available in Firefox:
rel="alternate stylesheet" attribute for the <link> HTML element offers an alternative style option to users.
display: table CSS declaration renders an element with the box layout of a <table> HTML element. Child elements may use equivalents to <table> internal elements such as display: table-row for <tr>.
ime-mode CSS property sets the state of the input method editor for text fields.
<input type="file"> HTML element shows a file picker from which users can choose a file to upload with the form.
postMessage() global method sends cross-origin messages to windows and workers, including popups and iframes. Also known as cross-document messaging.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
<filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
The following features are now available in Safari:
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
<audio> element plays sound such as audio effects or music, optionally with controls provided by the browser.
:empty CSS pseudo-class matches elements without child elements.
focus and blur, fire when an element gets or loses focus.
input event fires when a form control changes or an element with the contenteditable attribute changes.
<input type="range"> element represents a slider for choosing an inexact value between a minimum and maximum value.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
:lang() CSS functional pseudo-class matches elements based on their content language.
:nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.
:nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
<source> element sets a media resource for the <picture>, <video>, and <audio> elements.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
<video> element plays videos or movies, optionally with controls provided by the browser.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
zoom CSS property scales the size of an element. Unlike the transform property, a zoomed element affects page layout.
The following features are now available in Safari:
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
<body> element represents the content of an HTML document.
<br> element produces line breaks in text.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
console API logs debugging messages to the browser development tools' console.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
<form> element contains interactive controls for submitting information.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
<p> element represents a paragraph of text.
__proto__ property of objects partially exposes the prototype of an object.
<q> element represents a short inline quotation.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<svg> element, creates two-dimensional vector graphics with declarative or scripted interaction and animation.
-webkit-text-stroke-width and -webkit-text-stroke-color CSS properties set the thickness and color of text outlines. The -webkit-text-fill-color sets the color within text character outlines. Both default to the text color.
word-break: break-word CSS declaration sets word breaks to occur according to their customary rules.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
The following features are now available in Safari on iOS:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background CSS property is a shorthand that sets several background properties at once.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<body> element represents the content of an HTML document.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
clip CSS property sets the visible area of an absolutely positioned element.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
console API logs debugging messages to the browser development tools' console.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
<div> HTML element is the generic container for content.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="checkbox"> HTML element represents a tickable box with two states, checked and unchecked.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
opacity CSS property sets the transparency of an element.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
window.print() method opens the browser's print dialog.
__proto__ property of objects partially exposes the prototype of an object.
RegExp object represents a regular expression, a notation for matching text patterns.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
-webkit-device-pixel-ratio, -webkit-min-device-pixel-ratio, and -webkit-max-device-pixel-ratio CSS media queries are standardized compatibility alternatives to resolution media queries.
:root pseudo-class matches the root element of the document, usually the <html> element.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
text-shadow CSS property sets the position and styles of shadow on text.
text-transform CSS property sets text case and capitalization.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
widows and orphans CSS properties set the minimum lines included in a text fragment created by page, column, or region breaks.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.
The following features are now available in Firefox:
device-aspect-ratio, device-height, and device-width media features describe physical properties of the displaying output device.
window.external.AddSearchProvider() and window.external.IsSearchProviderInstalled() do nothing. Historically, they added external search providers to the browser.
rel="prefetch" attribute for the <link> HTML element is a hint to the browser that the user is likely to navigate to a resource, so the browser should preemptively fetch and cache the resource.
navigator.registerProtocolHandler() method declares a site's ability to handle an address scheme (also known as a protocol). For example, an email site can register to open mailto: URLs or a VoIP site to open tel: URLs.
spellcheck global HTML attribute sets whether the browser may check an element for spelling errors.
The following features are now available in Firefox:
::before and ::after CSS pseudo-elements select inline boxes preceding and following an element. They are often used with the content property to generate cosmetic content.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
@charset CSS at-rule specifies the character encoding of an external style sheet.
currentColor CSS value allows you to reuse an element's computed text color for other properties.
<embed> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
navigator.onLine property is a boolean for whether the browser is connected to some network (though not necessarily the internet). The online and offline events fire when the connection state changes.
fill-opacity, and stroke-opacity SVG attributes and CSS properties control the transparency of a stroke or fill of an SVG element.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
pageshow and pagehide transition events fire when a document loads or unloads due to a navigation, such as clicking on a link on a page or the back button in a browser.
tabindex HTML attribute make an element focusable, and sets the element's relative ordering for sequential focus navigation.
The following features are now available in Safari:
background CSS property is a shorthand that sets several background properties at once.
background-image CSS property sets the graphics to display behind the content of an element and in front of the background color. Graphics may be any combination of images or gradients.
<canvas> HTML element is a space to draw graphics in, using the 2D canvas API, WebGL, or WebGPU.
CanvasRenderingContext2D API is the "2d" rendering context for the <canvas> element. It represents a flat, two-dimensional space for drawing graphics and animations.
clip CSS property sets the visible area of an absolutely positioned element.
execCommand() method reads and writes from the clipboard and performs editing commands on editable text, such as changing the font name or style. Related methods check whether commands are supported, enabled, or applied.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
opacity CSS property sets the transparency of an element.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-overflow CSS property sets how hidden overflow content appears to users. The property can clip content, truncate content with an ellipsis (…), or truncate with a custom string.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
widows and orphans CSS properties set the minimum lines included in a text fragment created by page, column, or region breaks.
The following features are now available in Firefox:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
<abbr> HTML element represents an abbreviation or acronym.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
__defineGetter__() and __defineSetter__() methods of objects bind a function to a property, which is called on setting or reading the property.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
attr() CSS function, in content property declarations, sets a ::before or ::after pseudo-element's content to the value of the specified HTML attribute.
autofocus HTML attribute gives focus to an element on page load.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
visible property of the window.locationbar, window.menubar, window.personalbar, window.scrollbars, window.statusbar, and window.toolbar APIs historically represented the visibility of a browser user interface. For privacy reasons, it now represents whether the window is a pop-up.
<base> element sets the base URL (the URL that relative URLs are relative to) for all relative URLs in the document.
beforeunload event is fired when the current window is about to be unloaded. Typically this is used to display a dialog to confirm if users really want to leave the page when there is unsaved data that would be lost.
<blockquote> element represents an extended quotation, styling contents as an indented block by default.
<body> element represents the content of an HTML document.
border CSS property sets the color, style, and width of the line around an element.
<br> element produces line breaks in text.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
ch CSS length unit is a font-relative length based on the width of the zero (0) character.
change event for <input>, <select>, and <textarea> elements fires when the user modifies the element's value. Unlike the input event, the change event does not necessarily fire on every alteration to an element's value.
<cite> element represents the title of a quoted, referenced, or mentioned creative work, such as a film or book.
clip CSS property sets the visible area of an absolutely positioned element.
<code> element displays its contents as a fragment of computer code.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
navigator.cookieEnabled property is a boolean for whether the browser accepts or ignores attempts to write cookie data.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
counter-reset and counter-increment CSS properties and the counter() and counters() functions automatically number headings or ordered list items.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
<del> element represents a range of text that has been deleted from a document, styling text as strikethrough by default.
<dl>, <dt>, and <dd> HTML elements represent a list of terms and their associated descriptions. Use a description list to create glossaries or similar list of key-value pairs.
<dfn> element marks a term to be defined, styling text as italic by default.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
<div> HTML element is the generic container for content.
dominant-baseline CSS property sets the specific baseline used to align an elements's text and inline-level contents.
<em> HTML element emphasizes or stresses the content, styling text as italic by default.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
:empty CSS pseudo-class matches elements without child elements.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
<fieldset> and <legend> elements group several form control elements within a web form.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
<form> element contains interactive controls for submitting information.
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
caller and arguments properties of a non-strict mode Function object are the function that called it and the arguments it was called with. Not to be confused with the arguments variable in a function body's local scope.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<h1> through <h6> HTML elements represent six levels of section headings, in order of decreasing importance.
<hr> element represents a thematic break between paragraphs, often shown as a horizontal rule.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<iframe> element embeds another HTML page into the current page.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
:checked, :disabled, and :enabled CSS pseudo-classes match form elements based on their state.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
<ins> element represents a range of text that has been inserted into a document, styling text as underlined by default.
<script> element. JavaScript has changed over many years. This feature represents the oldest language features, such as built-in objects, statements, and operators. Also known as ECMAScript.
<kbd> element represents textual user input, such as keyboard or voice input, styling text in monospaced type by default.
<label> HTML element represents a caption for a form field.
:lang() CSS functional pseudo-class matches elements based on their content language.
lang global HTML attribute defines the language of an element. It's used by assistive technology to correctly read the content, translation tools to select the origin language, and other applications.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
<link> element creates a relationship between the current document and an external resource, such as a stylesheet or favicon.
<ol>, <ul>, and <li> HTML elements represent ordered and unordered lists.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
@media CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as screen or print, and one or more mandatory media features, such as prefers-reduced-animations.
<menu> element represents an unordered list of action items (<li>), such as a toolbar. It is a semantic alternative to the <ul> element.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
min-width, min-height, max-width, and max-height CSS properties set the minimum and maximum size of an element.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
<object> element represents an external resource such as a PDF or SVG document. It was historically used for plugins such as Shockwave Flash.
opacity CSS property sets the transparency of an element.
<p> element represents a paragraph of text.
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
<pre> element represents a block element of preformatted text that is presented exactly as written, including all white space.
window.print() method opens the browser's print dialog.
__proto__ property of objects partially exposes the prototype of an object.
<q> element represents a short inline quotation.
RegExp object represents a regular expression, a notation for matching text patterns.
compile() method of RegExp objects recompiles an existing regular expression object using a new pattern and flags.
RegExp object has several static properties to access the input and results of the most-recent regular expression match.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
:root pseudo-class matches the root element of the document, usually the <html> element.
<s> HTML element indicates text that is no longer relevant or accurate, styling text as strikethrough by default.
<samp> element represents a sample or quoted output from a computer program. Styled in a monospace font by default.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<script> element contains or loads data or executable code. This is typically used to load JavaScript code. The <noscript> element represents alternative content to show when scripting is not allowed.
scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
<small> element represents side-comments and small print, like copyright and legal text, independent of its styled presentation. Styled in a reduced font size by default.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<strong> HTML element brings attention to the content, styling text as bold by default.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
<sub> and <sup> elements sets inline text to be displayed as subscript or superscript for solely typographical reasons.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
:target CSS pseudo-class matches the element with an ID matching the URL fragment.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-transform CSS property sets text case and capitalization.
<textarea> element represents an editing control that allows users to enter multi-line, free-form, plain text.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
title global HTML attribute sets information about an element, such as a name or description. The value is typically shown as a tooltip that appears on mouse over. Since it's not often available to touch-only, keyboard-only, or assistive technology users, it's not a substitute for other text.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
:active, :focus, and :hover CSS pseudo-classes match elements based on how users are interacting with them.
<var> element represents the name of a variable in a mathematical expression or a programming context.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
visibility CSS property sets whether an element is shown. Invisible elements still affect the document layout.
<wbr> HTML element represents a word break opportunity, to explicitly mark a place within a word where a line might be broken.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
XMLHttpRequest API makes HTTP requests. It's the predecessor to fetch(). Also known as XHR.
XMLSerializer API provides the serializeToString() method to construct an XML string representing a DOM tree.
document.evaluate() method selects elements in an HTML or XML document based on an expression of XPath, a domain specific language for querying XML documents. Also known as XML Path Language.
XSLTProcessor API transforms XML documents into new XML or HTML documents, using XSLT stylesheets. You can use XSLT to convert data between different XML schemas or to convert XML data into web pages or PDF documents. Also known as Extensible Stylesheet Language Transformations.
The following features are now available in Safari:
initial keyword resets any CSS property to its initial value as defined by the specification. For example, the initial value of the display property is inline, regardless of the element being styled. Not to be confused with revert, which resets to the user or browser default style.
keydown and keyup events fire for each key press (or, with modifier keys, a combination of key presses) on a keyboard.
outline-color, outline-style, and outline-width and outline-offset CSS properties style a line around an element, outside of the border.
The following features are now available in Safari:
window.print() method opens the browser's print dialog.
::selection CSS pseudo-element selects text a user has highlighted.
text-shadow CSS property sets the position and styles of shadow on text.
The following features are now available in Safari:
<a> element creates a hyperlink to any resource that's accessible via a URL, such as web pages, files, email addresses, or locations within the same page.
position: absolute CSS declaration removes an element from the normal flow and positions it relative to its containing block, which is often the root element, or closest positioned ancestor.
<address> element represents contact information for a person or people, or for an organization.
window.alert(), window.confirm(), and window.prompt() methods open modal dialogs for notifying the user, asking for confirmation, or entering text.
callee property of the arguments variable in a non-strict function body's local scope is the function that arguments belongs to.
splice() method changes an array in-place. You can use it to delete items, overwrite items, or insert items, starting from an index.
<b> HTML element draws reader's attention to text, styling text as bold by default.
background-color CSS property sets the fill color of an element, behind any content and background images or gradients.
border CSS property sets the color, style, and width of the line around an element.
<button> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default.
color CSS property sets the primary foreground color of an element, which is used for text, the default border color, and text decorations.
content CSS property sets the content inside of an element or pseudo-element, replacing the current value. It's often used with the ::before and ::after pseudo-elements to generate cosmetic content.
Set-Cookie HTTP header stores limited amounts of data that persist across request and response, creating shared state between the browser and server.
Date object represents a single moment in time.
getYear() and setYear() methods of Date objects get and set the year as an offset to 1900.
toGMTString() method of Date objects is an alias to the toUTCString() method.
display CSS property sets the display behavior of an element's box within its layout and sets the layout behavior for its child elements.
display: list-item CSS declaration renders an element with the box layout of a <li> HTML element.
<div> HTML element is the generic container for content.
em CSS length unit is a font-relative length equal to the specified font size. In an element with a 2 inch font, 1em equals 2 inches.
escape() and unescape() built-in Javascript methods encode and unencode strings using percent encoding, where certain characters are replaced by hexadecimal escape sequences.
Event API and the addEventListener() method on objects that receive events (event targets) represent and handle significant things happening on a page. Many APIs fire events for a wide range of situations relating to those APIs, such as an image loading, a user clicking, or a value changing.
ex CSS length unit is a font-relative length equal to the used x-height of the first available font. X-height is often equal to the height of the lowercase x.
::first-letter CSS pseudo-element selects the first letter in an element for styling.
::first-line CSS pseudo-element selects the first line of text in an element for styling.
position: fixed CSS declaration removes an element from the normal flow and positions it relative to the viewport or page.
float CSS property aligns an element to either side of its container, allowing text and inline elements to flow around it. The clear CSS property sets whether an element is moved below floating elements that proceed it.
font-family CSS property sets the desired font face for text, along with optional fallback font faces.
font CSS property shorthand sets multiple font properties, including style, weight, size, and font family.
font-size CSS property sets the text height.
font-style CSS property sets the text style, with normal, italic, and oblique options.
font-variant CSS property is a shorthand for font-variant-alternates, font-variant-caps, font-variant-east-asian, font-variant-emoji, font-variant-ligatures, font-variant-numeric, and font-variant-position.
font-weight CSS property controls the thickness of a font. It is set explicitly with the keyword bold or a number, or relative to the inherited thickness with the keywords bolder or lighter.
function keyword (as in function () { }) and arrow (=>) expression create functions. The JavaScript functions protocol includes default and rest parameters and binding to this.
<head> element contains machine-readable information (metadata) about the document, such as the title, <script> and <style> elements, and <meta> elements.
<html> element represents the top-level of an HTML document and is referred to as the root element.
String.bold() and String.italics(), wrap strings in (often historic) HTML.
Authorization and WWW-Authenticate headers authenticate a user with a server.
<i> HTML element identifies idiomatic content, styling text as italic by default.
<area> and <map> elements define a clickable area on an image.
<img> element adds an image into the document.
@import CSS at-rule loads styles from another stylesheet.
inherit keyword resets any CSS property to the computed value of that property from the parent element.
<input type="text"> HTML element allows the user to enter information into a form. By default, an <input> element is a text input.
<input type="button"> HTML element represents a button that triggers some action, such as submitting a form or opening a dialog, styled as a labeled rectangular box by default. Not to be confused with the <button> element, which contains HTML content.
<input type="hidden"> HTML element represents a form field that is not shown visually but is still included in the form submission.
<input type="image"> HTML element is an image that can be used to submit a form, like the <input type="submit"> element.
<input type="password"> HTML element represents a field for users to enter a password. The password is hidden from view, typically replaced by dots or asterisks.
<input type="radio"> HTML element represents one button in a group such that only one can be chosen at a time.
<input type="reset"> HTML element represents a button that sets all form fields to their initial values.
<input type="submit"> HTML element represents a button that triggers an action on its associated <form>, such as sending the form data to a server.
navigator.language property is a string representing the preferred language of the user, usually the language of the browser UI. The navigator.languages property is an array of strings representing the user's preferred languages.
letter-spacing CSS property controls the amount of space between each letter in an element or block of text.
line-height CSS property sets the spacing between text baselines, oriented to the horizontal or vertical writing mode.
list-style shorthand CSS property and the list-style-image, list-style-position, and list-style-type longhand properties set the position and appearance of a list item's marker.
location global object represents the current page's address. You can use it to get the parts of the address (such as location.hostname or location.pathname) or navigate to another URL.
margin CSS property sets space around an element. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.
<meta> element represents metadata about the page used by the browser or search engines, including description, keywords, and character sets.
click, mousedown, or mousemove, fire when users interact with an input or pointing device such as a mouse, trackpad, or touchscreen.
red or limegreen. They stand in for specific RGB color values.
@namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.
window.navigator API is a generic global object, under which many other, more interesting APIs are located. It doesn't do anything interesting on its own.
Number object) represents floating-point numbers, such as 42 or -4.201, while the Math API contains mathematical functions and constants. JavaScript can also represent boundless negative and positive values as Infinity or not-a-number as NaN (as in 0 * Infinity).
padding CSS property sets space between an element's edge and its contents. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.
top, right, bottom, and left, set the inset position of an element relative to the corresponding side of a container determined by the element's position property.
position CSS property sets the origin position of an element to an element, the element's scrollport, or the viewport.
RegExp object represents a regular expression, a notation for matching text patterns.
position: relative CSS declaration offsets the position of an element relative to its position in the normal flow.
:root pseudo-class matches the root element of the document, usually the <html> element.
window.screen property contains information about the screen of the output device that the referenced window is being rendered on.
<select> element provides a menu of options for a user to pick from, typically rendered as a dropdown list.
<span> HTML element is the generic inline container for content.
position: static CSS declaration positions an element in the normal flow. A statically positioned element ignores physical and logical properties such as top or inset-block-start.
String object) represents a sequence of characters.
<style> element embeds an inline CSS stylesheet in a document.
style global HTML attribute applies inline CSS styling declarations to individual elements.
ButtonBorder or LinkText, allow you to match default colors from the user agent.
<table> HTML element, with several related elements, represents tabular data in rows and columns of cells.
text-align CSS property sets the horizontal placement of the inner content of a block element.
text-decoration CSS property sets the style and color of decorative lines including underline, overline, line-through, or a combination of lines.
text-indent CSS property sets the size of the empty space (indentation) at the beginning of lines in a text.
text-transform CSS property sets text case and capitalization.
<title> element sets the title of the document and exposes it to users via the UI of the browser or app they're using and through assistive technology.
<u> HTML element makes non-textual annotations, styling text as underlined by default.
vertical-align CSS property sets the vertical alignment of inline, inline-block, and table cell elements. It has no effect on block-level elements.
white-space CSS property sets how white space is collapsed and how lines wrap. It is a shorthand for white-space-collapse and text-wrap-mode.
width and height CSS properties set the preferred physical size of an element.
window global object represents a browser tab or iframe and its relationship to the document and other tabs. It's also a generic global object, under which many other APIs are located.
word-spacing CSS property sets the amount of white space between words.
z-index CSS property orders overlapping elements, with higher values appearing in front of or on top of lower values.