Published: June 3, 2026
Unless otherwise noted, the following changes apply to the newest Chrome beta channel release for Android, ChromeOS, Linux, macOS, and Windows. Learn more about the features listed here through the provided links or from the list on ChromeStatus.com. Chrome is beta as of June 2, 2026. You can download the latest on Google.com for desktop or on Google Play Store on Android.
CSS and UI
AccentColor and AccentColorText system colors
The AccentColor and AccentColorText system colors can be used in CSS to access
the system accent color specified on the user's device. This capability lets
developers apply app-like styling to their web content in contexts where
users expect operating system theme integration, such as an installed web application. Users
must be in an installed web application on the initial profile to see the
system accent color rendered.
Allow optional rounding parameter for polygon()
Lets you specify an optional corner-rounding parameter in the polygon() CSS
shape function. Developers can specify a length value to round polygon corners
without manually computing bezier curves.
Animatable zoom
The CSS zoom property is animatable and interpolates as a <number>. Developers
can transition and animate zoom to smoothly scale elements and their layout,
complementing existing transform-based scaling.
CSS URL request modifiers
CSS url() functions accept optional request modifiers after the quoted URL
string: cross-origin(), integrity(), and referrer-policy(). These modifiers
control the fetch behavior of the referenced resource directly from CSS,
without requiring changes to HTML markup or JavaScript.
For example, background-image: url("image.png" cross-origin(anonymous))
fetches the image
using CORS anonymous mode.
CSS text-fit property
Scales the font size of text nodes to perfectly fit the width of their containing box.
This property lets developers ensure headlines or dynamic content fill the available horizontal space without manual font-size calculations or complex JavaScript workarounds. This property provides a robust, CSS-native solution for responsive typography that maintains visual alignment across different screen sizes and varying text lengths.
CSS background-clip: border-area
Implements the border-area value for the CSS background-clip property, as
defined in CSS Backgrounds Level 4. The background-clip value clips an
element's background to the area painted by its border strokes, taking
border-width and border-style into account while ignoring transparency from
border-color. This value lets you create gradient borders without border-image.
CSS image(<color>) function
The image() function lets developers generate a solid-color image from any color.
The syntax is: image() = image( <color> ).
CSS light-dark() with image values
Extends the CSS light-dark() function to accept image values, such as url(),
image-set(), and none, in author stylesheets, letting image properties like
background-image, list-style-image, border-image-source, cursor, and content
automatically switch between images based on the user's preferred color scheme.
Previously, this behavior was only allowed in User Agent stylesheets. This change
aligns with the CSS Color 5 specification and matches Firefox's existing implementation.
Clone into all descendant selectedcontent elements
Several small changes are being made to edge cases of the selectedcontent
element:
- When multiple
selectedcontentelements are put in a<select>element at the same time, all of them are kept up to date instead of only the first one in DOM order. - Updating the
selectedcontentelement is deferred when it runs during insertion, removal, or moving steps to fix security issues. The update is deferred by using post-insertion steps or microtasks.
Comma-separated container queries
Supports multiple queries per @container rule. The @container rule applies if at
least one of the queries matches.
This capability makes it possible to have fallback queries for features that are not supported in all browsers, for example.
Example:
@container --name1 not-supported(--foo: bar), --name2 (width > 600px) {}
Along with the support for multiple queries, the object model is extended to
support the conditions attribute on the CSSContainerRule API.
Expose unprintable areas to CSS
Printers usually have a small area at each of the four edges of a sheet of
paper that they are not capable of marking reliably, usually due to the
printer's paper handling mechanism. The default page margins are expected to be
bigger than these areas, but if authors set margins on their own, and even want
to add @page margin boxes, for example, for custom headers and footers, they
need a way to determine where it's safe to print.
The CSS descriptor page-margin-safety can be used to steer clear of such
unprintable areas.
The focusgroup attribute
Lets authors declaratively give composite widgets arrow key navigation, a guaranteed tab stop, and last-focused memory, replacing hand-coded roving tabindex scripts. Example:
<div focusgroup="toolbar wrap" aria-label="Formatting">
<button>Bold</button>
<button>Italic</button>
<button>Underline</button>
</div>
Media element pseudo-classes
The :playing, :paused, :seeking, :buffering, :stalled, :muted,
and :volume-locked CSS pseudo-classes match <audio> and <video> elements
based on their state.
This feature is one of the focus areas in Interop 2026.
popover=hint behavior changes
This change implements a revised and simplified stacking model for the
popover=hint attribute and its interactions with popover=auto. Previously,
the interactions between these two types of popovers could be complex in some
corner case situations, such as nesting popover=auto inside popover=hint, and
could lead to unexpected behavior. Under the new model, opening a popover=hint
no longer inadvertently closes unrelated popover=auto elements. Hint popovers are only
hidden when their ancestral popover=auto is hidden, or when a new, unrelated
popover=auto is opened. Additionally, developers can safely nest an auto
popover inside a hint popover; instead of throwing an exception or breaking the
stack, the nested popover=auto gracefully downgrades and behaves as a popover=hint.
This capability lets developers place a customizable <select> within
a popover=hint.
To further improve predictability and prevent complex state mutations, Chrome
is also tightening the behavior around opening and closing popovers from within
the beforetoggle event. There were guards in place for some, but not all, of
the possible cases before. This change revamps the mechanism used to detect
these cases to more reliably throw InvalidStateErrors for all such cases. This
change ensures that popover state management remains stable and prevents
looping reentrancy bugs.
These changes were motivated by standards conversations with Mozilla on the HTML specification pull request on GitHub.
Relative alpha colors
Relative alpha colors provide a direct CSS way to derive a translucent version
of an existing color without rewriting its color channels.
Developers currently need to duplicate component values or create separate
precomputed tokens when they want the same color with different opacity.
The CSS Color 5 alpha() function preserves the original color components
and only changes alpha, which reduces authoring overhead and makes color tokens
easier to reuse and maintain.
Responsively-sized <iframe>
Lets sites opt into iframes having responsive sizing, which sizes the
<iframe> element in the parent document to the iframe document's layout
overflow sizing to avoid scrolling in the child document.
flex-wrap:balance
flex-wrap:balance lets developers distribute content between flex-lines so that
it appears more balanced, similar to text-wrap:balance.
named-feature() function for CSS @supports
The named-feature() function lets CSS @supports rules query for a small set of
specific named features that are not possible to test for using other @supports
mechanisms but that are considered highly valuable to test for.
overscroll-behavior: chain
overscroll-behavior has three values: none, auto, and contain. These values
affect two independent effects: scroll propagation and local border effect. For
example overscroll stretch.
none: no scroll propagation, no local boundary effects.auto: scroll propagation, local boundary effects.contain: no scroll propagation, local boundary effects.
This release tracks a new value to complete the set: chain: scroll propagation, no
local boundary effects.
This value is useful for effects like side menus implemented as scrollers. You can bring the menu in, and when it hits the edge, it doesn't overscroll, or stretch and translate. However, the scroll then chains to the ancestor.
Web APIs
Disable SVG filters on plugins and cross-origin or restricted iframes
Chrome 150 prevents Scalable Vector Graphics (SVG) filters from being applied to cross-origin or restricted iFrames, for example, sandboxed ones, and embedded plugins, for example, PDFs. When a frame or plugin is painted with an SVG filter effect, the effect tree is traversed to find the highest ancestor without SVG filters, and that effect is applied instead.
IndexedDB: SQLite backend
Chromium's IndexedDB implementation is rewritten on top of SQLite to replace
the previous implementation that uses a hybrid of LevelDB and flat files. This
change doesn't affect the Web API.
This rewrite is expected to improve reliability and, to a lesser extent, performance.
For now, this change applies to new data stores. This change is step 2 of a multi-phase progressive release. See the ChromeStatus feature page for SQLite in-memory contexts which tracks step 1.
MediaStreamTrackProcessor frame counters
Adds discardedFrames and totalFrames attributes to the
MediaStreamTrackProcessor interface. These counters let web developers monitor
the health of their media processing pipelines by tracking the number of frames
received and dropped by the processor.
Opaque origin for data: URLs
Chrome 150 updates how DedicatedWorker and SharedWorker handle
data: URLs. Rather than
automatically inheriting the security origin of the script or page that created
them, these workers are assigned a unique opaque origin.
This change aligns with the worker
HTML specification
and enhances security by isolating these workers from the creator's same-origin
state, preventing them from accessing sensitive data through mechanisms like
BroadcastChannel or same-origin storage. To maintain correct isolation
boundaries, these workers still reside within the same storage partition (for
example, by preserving the top-level site or nonce) as their creator.
This security adjustment is enabled by default across desktop and mobile platforms. Administrators can review or verify security boundaries through their centralized configurations. For technical implementation details and specification references, see Step 3 of the HTML Living Standard Worker Settings.
PWA origin migration
When a user installs a Progressive Web App (PWA), its identity and security
context are tightly bound to its web origin, for example, app.example.com.
This binding presents a significant challenge for developers who need to change
their PWA's origin due to rebranding, domain restructuring, or technical
re-architecture. Such a change forces users to manually uninstall the old app
and reinstall the new one, leading to a disruptive experience and potential
user loss. Chrome 150 introduces a mechanism for developers to
migrate an installed PWA
to a new, same-site origin, preserving user trust and
permissions.
The WebAppInstallForceList policy blocks migration. Since enterprise policies around web applications are primarily based on URLs and origins, there is a risk that a migration might bypass certain policies an admin might have configured. Chrome doesn't offer a migration to the user when an app is force-installed by their enterprise administrator, and instead displays a banner that explains this to the user.
Parse processing instructions in HTML
Processing instructions (syntax: <?target data>) are an existing DOM construct,
exposed in XML, that allow node objects that are not elements but can have some
semantic meaning for the processing of a document.
For example, you can use them to denote ranges for streaming or highlighting without requiring new DOM elements and changing the DOM structure as far as CSS is concerned, or as directives for the HTML parser about how to buffer and stream.
Out-of-order streaming
Out-of-order streaming lets you use <template for> and processing instruction ranges
(<?start> and <?end>) to deliver HTML in non-sequential order and update existing parts of the document without
JavaScript.
Programmatic scroll promises
This capability provides a reliable signal for the completion status of a
programmatic smooth-scroll. All scroll methods in Element and Window return
Promise objects that get resolved on scroll completion, and the resolved value
indicates whether the scroll was interrupted.
WebGPU Immediates
Adds a new immediate address space in WGSL and a setImmediateData() method on render pass, compute pass, and render bundle encoders that allows passing small amounts of frequently-updated data directly to shaders without creating GPU buffer objects or bind groups. This is particularly useful for applications that need to update per-draw parameters such as object indexes, material indexes, or transformation matrixes every draw call, enabling significant performance improvements by avoiding buffer and bind group management overhead.
Web Speech API: On-device recognition quality
Extends the SpeechRecognition interface by adding a quality property to
SpeechRecognitionOptions. This property lets developers specify the semantic
capability required for on-device recognition by using processLocally: true.
The proposed quality enum supports three levels—command, dictation, and
conversation—mapping to increasing task complexity and hardware requirements.
This capability lets developers determine if the local device can handle
high-stakes use cases (like meeting transcription) or if they need to fall back
to cloud services, solving the opaque nature of on-device model capabilities.
New origin trials
In Chrome 150 you can opt into the following new origin trials.
Email Verification Protocol (EVP)
The Email Verification Protocol (EVP) helps users create, access, and recover
accounts by providing cryptographic proof of ownership seamlessly rather than
email OTPs manually.
Deprecations and removals
This release of Chrome introduces the following deprecations and removals.
Remove [LegacyNoInterfaceObject] from FontFaceSet IDL
Chromium's FontFaceSet IDL previously incorrectly used
[LegacyNoInterfaceObject], which hid FontFaceSet as a global property and
deleted the constructor property from its prototype. This behavior deviated
from the CSS Font Loading spec and differed from Safari and Firefox behavior.
This removal removes [LegacyNoInterfaceObject] from the FontFaceSet IDL,
making FontFaceSet properly accessible as a global property. Since no
constructor() is defined in the IDL, calling new FontFaceSet() from
JavaScript correctly throws TypeError: Illegal constructor, matching
spec-mandated behavior.