Experimental Chromium Web Platform Features

The HTMLElement.accessKeyLabel read-only property returns a human-readable string representing the actual keyboard shortcut assigned to the element by the browser, based on the user’s platform and browser. If no access key is assigned, it returns an empty string.

Ignore tree-scope when matching container-name for @container queries. Previously, container-name matching for container queries used tree-scoped names/references for matching, which meant the same name would not match if the @container rule and the container-type property were originating from different trees such that that container-type declaration came from an inner shadow tree. With this change container names match regardless of @container rule or container-type declaration origins.

Support of new CSS property `ruby-overhang` is added. The property accepts one of `auto` and `none` keywords, and controls overhang of ruby annotation text.

This feature introduces support for the font-language-override CSS property in Chromium. The property allows developers to override the system language used for OpenType glyph substitution by specifying a four-character language tag directly in CSS. This enables fine-grained typographic control, particularly useful for multilingual content or fonts with language-specific glyph variants.

Modulepreload and dynamic imports now correctly send the page’s referrer header when fetching scripts, aligning Chrome with the HTML specification.

Currently NavigationTransition has a "from" property, exposing the old URL of the navigation. Exposing "to" (a NavigationDestination) completes this. It is especially useful when using precommit handlers, as during precommit the current URL has not yet switched to the destination. Note that navigation.transition is only exposed for intercepted navigations - which means same-origin document-initiated navigations.

This feature supports applying width and height as presentation attributes on nested <svg> elements through both SVG markup and CSS. This dual approach provides even greater flexibility for developers, allowing them to manage and style SVG elements more efficiently within complex designs. With this feature the below two html will now have the same output: With CSS Properties for nested <svg> element: <svg width="100px" height="100px"> <svg style="width:50px;height:50px;"> <circle cx="50px" cy="50px" r="40px" fill="green" /> </svg> </svg> Without CSS Properties for nested <svg> element: <svg width="100px" height="100px"> <svg width="50px" height="50px"> <circle cx="50px" cy="50px" r="40px" fill="green" /> </svg> </svg>

These pseudo-classes match scroll markers that are, respectively, before or after the active marker (the one matching :target-current) within the same scroll marker group, as determined by flat tree order: * :target-before matches all scroll markers that precede the active marker in the flat tree order within the group. * :target-after matches all scroll markers that follow the active marker in the flat tree order within the group.

Decouples the computed values of border-width, outline-width, and column-rule-width from their corresponding style properties. Previously, if a style such as border-style was set to none or hidden, the computed width would resolve to 0px. For example, even if border-left-width was explicitly set to 10px, its computed value would be 0px if border-left-style was none or hidden. Following the resolution CSSWG issue [1], this behavior should change. The computed values of border-width, outline-width, and column-rule-width will now reflect their specified values, regardless of the associated style property's value. [1]: https://github.com/w3c/csswg-drafts/issues/11494#issuecomment-2675800489

View Transitions API allows developers to start visual transitions between different states. The primary SPA entry point to this is `startViewTransition()` which returns a transition object. This object contains several promises and functionality to track the transition progress, as well as allow manipulations such as skipping the transition or modifying its types. The proposal here is ergonomic in nature: instead of requiring that users store this object in some sort of way for easy access, provide a `document.activeViewTransition` property that represents this object, or null if there is no transition ongoing. Note this similarly applies to MPA transitions, where the object is only available via `pageswap` and `pagereveal` events. In this proposal `document.activeViewTransition` would be set to this object for the duration of the transition.

By using the size and multiple attributes, the select element can be rendered as an in-page listbox or a button with a popup. However, these modes are not consistently available across mobile and desktop chrome. Currently, in-page listbox rendering is not available on mobile, and button with popup is not available on desktop when the multiple attribute is present. This feature adds the listbox to mobile and adds a multi-select popup to desktop, and makes the opt-ins with the size and multiple attributes result in the same rendering mode across mobile and desktop. Here is a summary of the changes: - When the size attribute has a value greater than 1, in-page rendering will always be used. Previously, this was ignored on mobile. - When the multiple attribute is set with no size attribute, in-page rendering will be used. Previously, this was a popup instead of an in-page listbox on mobile. - When the multiple attribute is set with size=1, a popup will be used. Previously, this was an in-page listbox on desktop. By making this change, we are providing a foundation to bring customizable select to in-page rendering and multi-select. Customizable select currently only works for single-selects with a popup.

This feature introduces support for the download attribute on the SVGAElement interface in Chromium, aligning with the SVG 2 specification. The download attribute enables authors to specify that the target of an SVG hyperlink should be downloaded rather than navigated to, mirroring the behavior already supported in HTMLAnchorElement. This enhancement promotes interoperability across major browsers and ensures consistent behavior between HTML and SVG link elements, thereby improving developer experience and user expectations.

WebTransport Application Protocol Negotiation allows negotiation of the protocol used by the web application within the WebTransport handshake. A web application can specify a list of application protocols offered when constructing a WebTransport object, which are then conveyed to the server via HTTP headers; if the server picks one of those protocols, it can indicate that within response headers, and that reply is available within the WebTransport object.

Adds a global HDR headroom attribute to CanvasRenderingContext2D. When drawing HDR content (e.g, gain map images), to the canvas' bitmap, this attribute will determine how much tone mapping should be performed (if any).

The "clipboardchange" event fires whenever the system clipboard contents are changed either by a web app or any other system application. This allows web-apps like remote desktop clients to keep their clipboards synchronized with the system clipboard. It provides an efficient alternative to polling the clipboard(using Javascript) for changes.

A new key-value API, tentatively `window.crashReport`, backed by a per-Document map holding data that gets appended to crash reports. See https://github.com/WICG/crash-reporting/issues/15 for initial discussion. The data placed in this API's backing map gets sent in the `CrashReportBody` [1] if any renderer process crashes are incurred by the site. This lets developers debug what specific state in their application might be causing a given crash. [1]: https://wicg.github.io/crash-reporting/#crashreportbody

The shape of the caret in native applications is most commonly a vertical bar, an underscore or a rectangular block. In addition, the shape often varies depending on the input mode, such as insert or replace. The CSS caret-shape property allows sites to choose one of these shapes for the caret inside editable elements, or leave the choice up to the browser. The recognized property values are auto, bar, block and underscore.

Enables percentage values for the letter-spacing and word-spacing CSS property, as defined in the CSS Text Module Level 4 spec. Percentage values are calculated relative to the advance measure of the space character (U+0020). This gives developers more robust and flexible control over typography, particularly in responsive designs where text spacing needs to adapt to different viewports and font sizes.

CSS Masonry is a layout module where items of varying heights are arranged in columns, filling gaps to create a seamless grid, similar to a brick wall, perfect for accommodating elements with varying aspect ratios. Unlike CSS Grid, Masonry is better suited for one-dimensional flow layouts, like image galleries, where the focus is on filling the space efficiently rather than aligning items along both axes. Masonry provides greater design freedom, enabling the creation of dynamic, responsive layouts that adapt to content variations without the need for manual adjustments or a non-standard JavaScript implementation.

Introduces the <geolocation> element, a declarative, user-activated control for accessing the user's location. It streamlines the user and developer journey by not only handling the permission flow but also directly providing location data to the site, often eliminating the need for a separate JavaScript API call. This addresses the long-standing problem of permission prompts being triggered directly from JavaScript without a strong signal of user intent. By embedding a browser-controlled element in the page, the user's click provides a clear, intentional signal. This enables a much better prompt UX and, crucially, provides a simple recovery path for users who have previously denied the permission. Note: This feature was previously developed and tested in an Origin Trial as the more generic <permission> element. Based on feedback from developers and other browser vendors, it has evolved into the capability-specific <geolocation> element to provide a more tailored and powerful developer experience. Explainer: https://github.com/WICG/PEPC/blob/main/geolocation_explainer.md Instructions: https://github.com/WICG/PEPC/blob/main/HOWTO.md

Extends DisplayMediaStreamOptions for getDisplayMedia() with a windowAudio option. This new option allows web applications to hint to the user agent whether the user should be offered the ability to share audio when a window is selected. windowAudio can be set to exclude, system, or window based on application preference. A web application that is configured for audio capture but wants to limit system audio capture when a window is selected should set windowAudio: "exclude".

Extends echoCancellation behavior of MediaTrackConstraints dictionary - former true/false - by values "all" and "remote-only". Allows the clients to modify echo cancellation behavior applied to audio tracks received from microphones, controlling how much of the user system playout (all, or only audio received from PeerConnections) is removed from the microphone signal.

This feature adds an `interestfor` attribute to <button> and <a> elements. This attribute adds "interest" behaviors to the element, such that when the user "shows interest" in the element, actions are triggered on the target element, such as showing a popover. The user agent will handle detecting when the user "shows interest" in the element, via methods such as hovering the element with a mouse, hitting special hotkeys on the keyboard, or long-pressing the element on touchscreens. When interest is shown or lost, an `InterestEvent` will be fired on the target, which have default actions in the case of popovers - showing and hiding the popover.

Support for character-level and glyph-level mirroring when rendering MathML operators in right-to-left mode. When using RTL mode some operators can be mirrored by changing them to another code point (e.g. a right parentheses becomes a left parentheses). This is character-level mirroring, with equivalences defined by Unicode's `Bidi_Mirrored` property. There are operators that have no appropriate mirroring character. Glyph-level mirroring applies in this case, with the `rtlm` font feature, where another glyph can replace it in a mirrored context. Some existing implementations mirror the original glyph directly, but this may change the meaning for asymmetrical characters, such as the clockwise contour integral.

The origin is a fundamental component of the web’s implementation, essential to both the security and privacy boundaries which user agents maintain. The concept is well-defined between HTML and URL, along with widely-used adjacent concepts like "site". Origins, however, are not directly exposed to web developers. Though there are various origin getters on various objects, each of those returns the ASCII serialization of an origin, not the origin itself. This has a few negative implications. Practically, developers attempting to do same-origin or same-site comparisons when handling serialized origins often get things wrong in ways that lead to vulnerabilities. Philosophically, it seems like a missing security primitive that developers struggle to polyfill accurately. We can address this gap in the platform by introducing an Origin object that encapsulates the origin concept, and provides helpful methods for comparison, serialization, parsing, and etc.

Adds HDR headroom to the attributes of a display that may be queried in ScreenDetailed. The HDR headroom of a screen is the parameter that is used for many HDR tone mapping algorithms. Custom tone mapping (e.g, in WebGPU) requires knowing this parameter.

This feature preserves the sticky user activation state after a page navigates to another same-origin page. The lack of user activation in the post-navigation page prevents some use cases like showing virtual keyboards on auto-focus, and this has been a blocker for the developers who want to build MPAs over SPAs. Note that browser-initiated navigation requests (reload, history navigation, typed URL in address bar etc) are not covered by this feature.

This feature ensures consistent rendering of the <use> element when using width and height via both CSS and presentation attributes. It also adds support for x, y, width, and height on <symbol>, giving developers better control over layout. Before: Only CSS-based width and height on <use> were supported; presentation attributes were ignored or inconsistent. Now: <use> supports width and height as presentation attributes. <symbol> supports x, y, width, and height as presentation attributes. This ensures consistent rendering across CSS and markup. Before: <svg width="100" height="100"> <defs> <symbol id="sym"> <rect width="100" height="100" fill="green"/> </symbol> </defs> <use href="#sym" style="width:40; height:40"/> </svg> Now: <svg width="100" height="100"> <defs> <symbol id="sym" width="80" height="80" x="10" y="10"> <rect width="100" height="100" fill="green"/> </symbol> </defs> <use href="#sym" width="40" height="40"/> </svg>