Publié le : 3 juin 2026
Sauf indication contraire, les modifications suivantes s'appliquent à la dernière version bêta de Chrome pour Android, ChromeOS, Linux, macOS et Windows. Pour en savoir plus sur les fonctionnalités listées ici, consultez les liens fournis ou la liste sur ChromeStatus.com. Chrome est en version bêta depuis le 2 juin 2026. Vous pouvez télécharger la dernière version sur Google.com pour ordinateur ou sur le Google Play Store pour Android.
CSS et UI
Couleurs système AccentColor et AccentColorText
Les couleurs système AccentColor et AccentColorText peuvent être utilisées dans CSS pour accéder à la couleur d'accentuation du système spécifiée sur l'appareil de l'utilisateur. Cette fonctionnalité permet aux développeurs d'appliquer un style semblable à celui d'une application à leur contenu Web dans des contextes où les utilisateurs s'attendent à une intégration du thème du système d'exploitation, comme une application Web installée. Les utilisateurs doivent se trouver dans une application Web installée sur le profil initial pour voir la couleur d'accentuation du système s'afficher.
Autoriser le paramètre d'arrondi facultatif pour polygon()
Vous permet de spécifier un paramètre d'arrondi d'angle facultatif dans la fonction de forme CSS polygon(). Les développeurs peuvent spécifier une valeur de longueur pour arrondir les angles du polygone sans calculer manuellement les courbes de Bézier.
Zoom animable
La propriété CSS zoom est animable et s'interpole en tant que <number>. Les développeurs peuvent effectuer des transitions et animer le zoom pour mettre à l'échelle les éléments et leur mise en page de manière fluide, en complément de la mise à l'échelle existante basée sur les transformations.
Modificateurs de requête d'URL de CSS
Les fonctions url() CSS acceptent des modificateurs de requête facultatifs après la chaîne d'URL entre guillemets : cross-origin(), integrity() et referrer-policy(). Ces modificateurs contrôlent le comportement de récupération de la ressource référencée directement à partir du code CSS, sans nécessiter de modifications du balisage HTML ni de JavaScript.
Par exemple, background-image: url("image.png" cross-origin(anonymous)) récupère l'image en mode anonyme CORS.
Propriété CSS text-fit
Met à l'échelle la taille de police des nœuds de texte pour qu'ils s'adaptent parfaitement à la largeur de leur boîte de contenu.
Cette propriété permet aux développeurs de s'assurer que les titres ou le contenu dynamique remplissent l'espace horizontal disponible sans avoir à calculer manuellement la taille de la police ni à utiliser des solutions de contournement JavaScript complexes. Elle fournit une solution robuste et native CSS pour la typographie responsive, qui maintient l'alignement visuel sur différentes tailles d'écran et longueurs de texte.
CSS background-clip: border-area
Implémente la valeur border-area pour la propriété CSS background-clip, telle que définie dans CSS Backgrounds Level 4. La valeur background-clip découpe l'arrière-plan d'un élément dans la zone peinte par les traits de sa bordure, en tenant compte de border-width et border-style, tout en ignorant la transparence de border-color. Cette valeur vous permet de créer des bordures en dégradé sans border-image.
Fonction CSS image(<color>)
La fonction image() permet aux développeurs de générer une image de couleur unie à partir de n'importe quelle couleur.
La syntaxe est la suivante : image() = image( <color> ).
CSS light-dark() avec des valeurs d'image
Étend la fonction CSS light-dark() pour accepter les valeurs d'image, telles que url(), image-set() et none, dans les feuilles de style de l'auteur, ce qui permet aux propriétés d'image telles que background-image, list-style-image, border-image-source, cursor et content de basculer automatiquement entre les images en fonction du jeu de couleurs préféré de l'utilisateur.
Auparavant, ce comportement n'était autorisé que dans les feuilles de style de l'agent utilisateur. Cette modification s'aligne sur la spécification CSS Color 5 et correspond à l'implémentation existante de Firefox.
Cloner dans tous les éléments selectedcontent descendants
Plusieurs petites modifications sont apportées aux cas extrêmes de l'élément selectedcontent :
- Lorsque plusieurs éléments
selectedcontentsont placés dans un élément<select>en même temps, ils sont tous tenus à jour, et pas seulement le premier dans l'ordre du DOM. - La mise à jour de l'élément
selectedcontentest différée lorsqu'elle s'exécute lors des étapes d'insertion, de suppression ou de déplacement pour résoudre les problèmes de sécurité. La mise à jour est différée à l'aide d'étapes post-insertion ou de microtâches.
Requêtes de conteneur séparées par une virgule
Prise en charge de plusieurs requêtes par règle @container. La règle @container s'applique si au moins l'une des requêtes correspond.
Cette fonctionnalité permet d'avoir des requêtes de secours pour les fonctionnalités qui ne sont pas prises en charge dans tous les navigateurs, par exemple.
Exemple :
@container --name1 not-supported(--foo: bar), --name2 (width > 600px) {}
En plus de la prise en charge de plusieurs requêtes, le modèle d'objet est étendu pour prendre en charge l'attribut conditions sur l'API CSSContainerRule.
Exposer les zones non imprimables au CSS
Les imprimantes ont généralement une petite zone à chacun des quatre bords d'une feuille de papier qu'elles ne peuvent pas marquer de manière fiable, généralement en raison du mécanisme de gestion du papier de l'imprimante. Les marges de page par défaut sont censées être plus grandes que ces zones, mais si les auteurs définissent eux-mêmes les marges et souhaitent même ajouter des zones de marge @page, par exemple pour des en-têtes et des pieds de page personnalisés, ils ont besoin d'un moyen de déterminer où il est sûr d'imprimer.
Le descripteur CSS page-margin-safety peut être utilisé pour éviter ces zones non imprimables.
Attribut focusgroup
Permet aux auteurs de fournir de manière déclarative aux widgets composites une navigation au clavier, une tabulation garantie et une mémorisation de la dernière sélection, en remplacement des scripts roving tabindex codés à la main. Exemple :
<div focusgroup="toolbar wrap" aria-label="Formatting">
<button>Bold</button>
<button>Italic</button>
<button>Underline</button>
</div>
Pseudo-classes d'éléments multimédias
Les pseudo-classes CSS :playing, :paused, :seeking, :buffering, :stalled, :muted et :volume-locked correspondent aux éléments <audio> et <video> en fonction de leur état.
Cette fonctionnalité fait partie des axes de travail d'Interop 2026.
Modifications du comportement de popover=hint
Cette modification implémente un modèle d'empilement révisé et simplifié pour l'attribut popover=hint et ses interactions avec popover=auto. Auparavant, les interactions entre ces deux types de pop-ups pouvaient être complexes dans certains cas particuliers, comme l'imbrication de popover=auto dans popover=hint, et pouvaient entraîner un comportement inattendu. Avec le nouveau modèle, l'ouverture d'un élément popover=hint n'entraîne plus la fermeture involontaire d'éléments popover=auto non associés. Les pop-ups d'indices ne sont masqués que lorsque leur popover=auto ancêtre est masqué ou lorsqu'un nouveau popover=auto non lié est ouvert. De plus, les développeurs peuvent imbriquer en toute sécurité un popover automatique dans un popover d'indice. Au lieu de générer une exception ou de casser la pile, l'élément popover=auto imbriqué est rétrogradé de manière fluide et se comporte comme un élément popover=hint.
Cette fonctionnalité permet aux développeurs de placer un <select> personnalisable dans un popover=hint.
Pour améliorer encore la prévisibilité et éviter les mutations d'état complexes, Chrome renforce également le comportement lié à l'ouverture et à la fermeture des popovers à partir de l'événement beforetoggle. Auparavant, des mesures de protection étaient en place pour certains cas possibles, mais pas pour tous. Cette modification remanie le mécanisme utilisé pour détecter ces cas afin de générer des InvalidStateError de manière plus fiable pour tous ces cas. Cette modification garantit que la gestion de l'état du pop-up reste stable et empêche les bugs de réentrance en boucle.
Ces modifications ont été motivées par des discussions sur les normes avec Mozilla concernant la demande d'extraction de la spécification HTML sur GitHub.
Couleurs alpha relatives
Les couleurs alpha relatives offrent un moyen CSS direct de dériver une version translucide d'une couleur existante sans réécrire ses canaux de couleur.
Les développeurs doivent actuellement dupliquer les valeurs des composants ou créer des jetons précalculés distincts lorsqu'ils souhaitent utiliser la même couleur avec une opacité différente.
La fonction alpha() de CSS Color 5 préserve les composants de couleur d'origine et ne modifie que le canal alpha, ce qui réduit la charge de travail de l'auteur et facilite la réutilisation et la maintenance des jetons de couleur.
flex-wrap:balance
flex-wrap:balance permet aux développeurs de répartir le contenu entre les lignes flexibles afin qu'il apparaisse plus équilibré, comme text-wrap:balance.
Fonction named-feature() pour @supports CSS
La fonction named-feature() permet aux règles @supports CSS d'interroger un petit ensemble de fonctionnalités nommées spécifiques qu'il n'est pas possible de tester à l'aide d'autres mécanismes @supports, mais qui sont considérées comme très utiles à tester.
overscroll-behavior: chain
overscroll-behavior comporte trois valeurs : none, auto et contain. Ces valeurs affectent deux effets indépendants : la propagation du défilement et l'effet de bordure local, par exemple l'étirement du dépassement de défilement.
none: aucune propagation du défilement, aucun effet de limite locale.auto: propagation du défilement, effets de limite locale.contain: pas de propagation du défilement, effets de limite locale.
Cette version suit une nouvelle valeur pour compléter l'ensemble : chain : propagation du défilement, sans effets de limite locale.
Cette valeur est utile pour les effets tels que les menus latéraux implémentés en tant que scrollers. Vous pouvez faire entrer le menu, et lorsqu'il atteint le bord, il ne défile pas au-delà ni ne s'étire et ne se traduit pas. Toutefois, le défilement est ensuite enchaîné à l'ancêtre.
API Web
Désactiver les filtres SVG sur les plug-ins et les iFrames inter-origines ou restreints
Chrome 150 empêche l'application de filtres SVG (Scalable Vector Graphics) aux iFrames inter-origines ou restreints (par exemple, en bac à sable) et aux plug-ins intégrés (par exemple, les PDF). Lorsqu'un frame ou un plug-in est peint avec un effet de filtre SVG, l'arborescence des effets est parcourue pour trouver l'ancêtre le plus élevé sans filtres SVG, et cet effet est appliqué à la place.
IndexedDB : backend SQLite
L'implémentation IndexedDB de Chromium est réécrite sur SQLite pour remplacer l'implémentation précédente qui utilise un hybride de LevelDB et de fichiers plats. Cette modification n'a aucune incidence sur l'API Web.
Cette réécriture devrait améliorer la fiabilité et, dans une moindre mesure, les performances.
Pour l'instant, cette modification s'applique aux nouveaux magasins de données. Il s'agit de l'étape 2 d'une version progressive en plusieurs phases. Consultez la page de la fonctionnalité ChromeStatus pour les contextes en mémoire SQLite, qui suit l'étape 1.
MediaStreamTrackProcessor Compteurs de frames
Ajoute les attributs discardedFrames et totalFrames à l'interface MediaStreamTrackProcessor. Ces compteurs permettent aux développeurs Web de surveiller l'état de leurs pipelines de traitement multimédia en suivant le nombre de frames reçus et supprimés par le processeur.
Origine opaque pour les URL data:
Chrome 150 met à jour la façon dont DedicatedWorker et SharedWorker gèrent les URL data:. Au lieu d'hériter automatiquement de l'origine de sécurité du script ou de la page qui les a créés, ces workers se voient attribuer une origine opaque unique.
Ce changement est conforme à la spécification HTML des workers et renforce la sécurité en isolant ces workers de l'état de même origine du créateur, ce qui les empêche d'accéder aux données sensibles par le biais de mécanismes tels que BroadcastChannel ou le stockage de même origine. Pour maintenir des limites d'isolation correctes, ces nœuds de calcul résident toujours dans la même partition de stockage (par exemple, en conservant le site de premier niveau ou le nonce) que leur créateur.
Ce réglage de sécurité est activé par défaut sur les plates-formes pour ordinateur et mobile. Les administrateurs peuvent examiner ou vérifier les limites de sécurité grâce à leurs configurations centralisées. Pour en savoir plus sur l'implémentation technique et les références aux spécifications, consultez l'étape 3 des paramètres des workers HTML Living Standard.
Migration de l'origine des PWA
Lorsqu'un utilisateur installe une progressive web app (PWA), son identité et son contexte de sécurité sont étroitement liés à son origine Web, par exemple app.example.com.
Cette liaison pose un problème important aux développeurs qui doivent modifier l'origine de leur PWA en raison d'un changement de marque, d'une restructuration de domaine ou d'une refonte technique. Un tel changement oblige les utilisateurs à désinstaller manuellement l'ancienne application et à réinstaller la nouvelle, ce qui entraîne une expérience perturbatrice et une perte potentielle d'utilisateurs. Chrome 150 introduit un mécanisme permettant aux développeurs de migrer une PWA installée vers une nouvelle origine de même site, tout en préservant la confiance et les autorisations des utilisateurs.
La règle WebAppInstallForceList bloque la migration. Étant donné que les règles d'entreprise appliquées aux applications Web reposent essentiellement sur les URL et les origines, une migration peut potentiellement contourner certaines règles configurées par un administrateur. Chrome ne propose pas de migration à l'utilisateur lorsqu'une application est installée d'office par son administrateur d'entreprise. Une bannière s'affiche alors pour lui en expliquer la raison.
Analyser les instructions de traitement en HTML
Les instructions de traitement (syntaxe : <?target data>) sont une construction DOM existante, exposée en XML, qui autorise les objets de nœud qui ne sont pas des éléments, mais qui peuvent avoir une signification sémantique pour le traitement d'un document.
Par exemple, vous pouvez les utiliser pour désigner des plages de streaming ou de mise en surbrillance sans avoir besoin de nouveaux éléments DOM ni de modifier la structure DOM en ce qui concerne le CSS, ou comme directives pour l'analyseur HTML sur la façon de mettre en mémoire tampon et de diffuser.
Streaming dans le désordre
Le streaming hors séquence vous permet d'utiliser <template for> et des plages d'instructions de traitement (<?start> et <?end>) pour diffuser du code HTML dans un ordre non séquentiel et mettre à jour des parties existantes du document sans JavaScript.
Promesses de défilement programmatique
Cette fonctionnalité fournit un signal fiable pour l'état d'achèvement d'un défilement fluide programmatique. Toutes les méthodes de défilement dans Element et Window renvoient des objets Promise qui sont résolus à la fin du défilement. La valeur résolue indique si le défilement a été interrompu.
WebGPU Immediates
Ajoute un nouvel espace d'adressage immédiat dans WGSL et une méthode setImmediateData() sur les encodeurs de pass de rendu, de pass de calcul et de bundle de rendu qui permet de transmettre de petites quantités de données fréquemment mises à jour directement aux nuanceurs sans créer d'objets de tampon GPU ni de groupes de liaison. Cela est particulièrement utile pour les applications qui doivent mettre à jour les paramètres par dessin, tels que les index d'objet, les index de matériau ou les matrices de transformation à chaque appel de dessin. Cela permet d'améliorer considérablement les performances en évitant la surcharge de gestion des tampons et des groupes de liaison.
API Web Speech : qualité de la reconnaissance sur l'appareil
Étend l'interface SpeechRecognition en ajoutant une propriété quality à SpeechRecognitionOptions. Cette propriété permet aux développeurs de spécifier la capacité sémantique requise pour la reconnaissance sur l'appareil à l'aide de processLocally: true.
L'énumération quality proposée prend en charge trois niveaux (command, dictation et conversation) qui correspondent à une complexité croissante des tâches et à des exigences matérielles. Cette fonctionnalité permet aux développeurs de déterminer si l'appareil local peut gérer des cas d'utilisation à fort enjeu (comme la transcription de réunions) ou s'ils doivent se rabattre sur les services cloud, ce qui résout le problème de l'opacité des capacités des modèles sur l'appareil.
Nouvelles phases d'évaluation
Dans Chrome 150, vous pouvez activer les nouveaux essais Origin suivants.
Protocole de validation des adresses e-mail (EVP)
Le protocole de validation d'adresse e-mail (EVP) aide les utilisateurs à créer des comptes, à y accéder et à les récupérer en fournissant une preuve cryptographique de propriété de manière fluide plutôt que des codes secrets à usage unique par e-mail manuellement.
Obsolescence et suppressions
Cette version de Chrome introduit les abandons et suppressions suivants.
Supprimer [LegacyNoInterfaceObject] de l'IDL FontFaceSet
L'IDL FontFaceSet de Chromium utilisait auparavant de manière incorrecte [LegacyNoInterfaceObject], ce qui masquait FontFaceSet en tant que propriété globale et supprimait la propriété du constructeur de son prototype. Ce comportement s'écartait de la spécification CSS Font Loading et différait de celui de Safari et Firefox.
Cette suppression supprime [LegacyNoInterfaceObject] de l'IDL FontFaceSet, ce qui rend FontFaceSet correctement accessible en tant que propriété globale. Étant donné qu'aucun constructor() n'est défini dans l'IDL, l'appel de FontFaceSet() à partir de JavaScript génère correctement TypeError: Illegal constructor, ce qui correspond au comportement requis par la spécification.