Beta do Chrome 150

Rachel Andrew

Publicado em: 3 de junho de 2026

Salvo indicação em contrário, as mudanças a seguir se aplicam à versão mais recente do canal Beta do Chrome para Android, ChromeOS, Linux, macOS e Windows. Saiba mais sobre os recursos listados aqui nos links fornecidos ou na lista em ChromeStatus.com. O Chrome está na versão Beta em 2 de junho de 2026. Faça o download da versão mais recente em Google.com para computadores ou na Google Play Store no Android.

CSS e interface

Cores do sistema AccentColor e AccentColorText

As cores do sistema AccentColor e AccentColorText podem ser usadas em CSS para acessar a cor de destaque do sistema especificada no dispositivo do usuário. Esse recurso permite que os desenvolvedores apliquem um estilo semelhante a um app ao conteúdo da Web em contextos em que os usuários esperam a integração do tema do sistema operacional, como um aplicativo da Web instalado. Os usuários precisam estar em um aplicativo da Web instalado no perfil inicial para ver a cor de destaque do sistema renderizada.

Permitir parâmetro de arredondamento opcional para polygon()

Permite especificar um parâmetro de arredondamento de canto opcional na função de forma CSS polygon(). Os desenvolvedores podem especificar um valor de comprimento para arredondar os cantos do polígono sem calcular manualmente as curvas de Bézier.

Zoom animável

A propriedade CSS zoom é animável e interpolada como um <number>. Os desenvolvedores podem fazer a transição e animar o zoom para dimensionar elementos e o layout deles de maneira suave, complementando o dimensionamento baseado em transformação.

Modificadores de solicitação de URL CSS

As funções url() do CSS aceitam modificadores de solicitação opcionais após a string de URL entre aspas: cross-origin(), integrity() e referrer-policy(). Esses modificadores controlam o comportamento de busca do recurso referenciado diretamente do CSS, sem exigir mudanças na marcação HTML ou no JavaScript.

Por exemplo, background-image: url("image.png" cross-origin(anonymous)) busca a imagem usando o modo anônimo do CORS.

Propriedade CSS text-fit

Dimensiona o tamanho da fonte dos nós de texto para se ajustar perfeitamente à largura da caixa que os contém.

Essa propriedade permite que os desenvolvedores garantam que os títulos ou o conteúdo dinâmico preencham o espaço horizontal disponível sem cálculos manuais de tamanho da fonte ou soluções alternativas complexas de JavaScript. Essa propriedade oferece uma solução robusta e nativa do CSS para tipografia responsiva que mantém o alinhamento visual em diferentes tamanhos de tela e comprimentos de texto.

CSS background-clip: border-area

Implementa o valor border-area para a propriedade CSS background-clip, conforme definido em CSS Backgrounds Level 4. O valor background-clip corta o plano de fundo de um elemento na área pintada pelos traços da borda, considerando border-width e border-style, enquanto ignora a transparência de border-color. Esse valor permite criar bordas gradientes sem imagem de borda.

Função CSS image(<color>)

A função image() permite que os desenvolvedores gerem uma imagem de cor sólida de qualquer cor. A sintaxe é: image() = image( <color> ).

CSS light-dark() com valores de imagem

Estende a função CSS light-dark() para aceitar valores de imagem, como url(), image-set() e none, em folhas de estilo do autor, permitindo que propriedades de imagem como background-image, list-style-image, border-image-source, cursor e content alternem automaticamente entre imagens com base no esquema de cores preferido do usuário. Antes, esse comportamento era permitido apenas em folhas de estilo do User Agent. Essa mudança está alinhada com a especificação CSS Color 5 e corresponde à implementação atual do Firefox.

Clonar em todos os elementos descendentes selectedcontent

Várias pequenas mudanças estão sendo feitas em casos extremos do elemento selectedcontent:

• Quando vários elementos selectedcontent são colocados em um elemento <select> ao mesmo tempo, todos eles são mantidos atualizados, em vez de apenas o primeiro na ordem do DOM.
• A atualização do elemento selectedcontent é adiada quando ele é executado durante as etapas de inserção, remoção ou movimentação para corrigir problemas de segurança. A atualização é adiada usando etapas de pós-inserção ou microtarefas.

Consultas de contêiner separadas por vírgula

Oferece suporte a várias consultas por regra @container. A regra @container será aplicada se pelo menos uma das consultas corresponder.

Esse recurso permite ter consultas de fallback para recursos que não são compatíveis com todos os navegadores, por exemplo.

Exemplo:

@container --name1 not-supported(--foo: bar), --name2 (width > 600px) {}

Além do suporte a várias consultas, o modelo de objeto é estendido para oferecer suporte ao atributo conditions na API CSSContainerRule.

Expor áreas não imprimíveis ao CSS

As impressoras geralmente têm uma pequena área em cada uma das quatro bordas de uma folha de papel que não podem ser marcadas de maneira confiável, geralmente devido ao mecanismo de manuseio de papel da impressora. Espera-se que as margens de página padrão sejam maiores do que essas áreas, mas, se os autores definirem margens por conta própria e até mesmo quiserem adicionar caixas de margem @page, por exemplo, para cabeçalhos e rodapés personalizados, eles precisam de uma maneira de determinar onde é seguro imprimir.

O descritor CSS page-margin-safety pode ser usado para evitar essas áreas não imprimíveis.

O atributo focusgroup

Permite que os autores ofereçam de forma declarativa a navegação por teclas de seta de widgets compostos, uma parada de tabulação garantida e a memória do último foco, substituindo scripts de tabindex móveis programados manualmente. Exemplo:

<div focusgroup="toolbar wrap" aria-label="Formatting">
  <button>Bold</button>
  <button>Italic</button>
  <button>Underline</button>
</div>

Pseudoclasses de elementos de mídia

As pseudoclasses CSS :playing, :paused, :seeking, :buffering, :stalled, :muted, e :volume-locked correspondem aos elementos <audio> e <video> com base no estado deles.

Esse recurso é uma das áreas de foco no Interop 2026.

Mudanças de comportamento popover=hint

Essa mudança implementa um modelo de empilhamento revisado e simplificado para o atributo popover=hint e as interações dele com popover=auto. Antes, as interações entre esses dois tipos de pop-ups podiam ser complexas em algumas situações de caso extremo, como aninhar popover=auto dentro de popover=hint, e podiam levar a um comportamento inesperado. No novo modelo, a abertura de um popover=hint não fecha inadvertidamente elementos popover=auto não relacionados. Os pop-ups de dica só ficam ocultos quando o popover=auto ancestral está oculto ou quando um novo popover=auto não relacionado é aberto. Além disso, os desenvolvedores podem aninhar com segurança um pop-up automático dentro de um pop-up de dica. Em vez de gerar uma exceção ou interromper a pilha, o popover=auto aninhado é rebaixado normalmente e se comporta como um popover=hint. Esse recurso permite que os desenvolvedores coloquem um <select> em um popover=hint.

Para melhorar ainda mais a previsibilidade e evitar mutações de estado complexas, o Chrome também está reforçando o comportamento em torno da abertura e do fechamento de pop-ups no evento beforetoggle. Antes, havia proteções para alguns, mas não para todos os casos possíveis. Essa mudança reformula o mecanismo usado para detectar esses casos para gerar InvalidStateErrors de maneira mais confiável para todos esses casos. Essa mudança garante que o gerenciamento de estado do pop-up permaneça estável e evita bugs de reentrada em loop.

Essas mudanças foram motivadas por conversas de padrões com a Mozilla sobre a solicitação de pull de especificação HTML no GitHub.

Cores alfa relativas

As cores alfa relativas oferecem uma maneira direta de CSS de derivar uma versão translúcida de uma cor existente sem reescrever os canais de cor. Os desenvolvedores precisam duplicar valores de componentes ou criar tokens pré-computados separados quando querem a mesma cor com opacidade diferente. A função CSS Color 5 alpha() preserva os componentes de cor originais e só muda o alfa, o que reduz o overhead de criação e facilita a reutilização e manutenção de tokens de cor.

Com tamanho responsivo <iframe>

Permite que os sites ativem iframes com dimensionamento responsivo, que dimensiona o <iframe> elemento no documento pai para o dimensionamento de estouro de layout do documento do iframe para evitar a rolagem no documento filho.

flex-wrap:balance

flex-wrap:balance permite que os desenvolvedores distribuam conteúdo entre linhas flexíveis para que ele pareça mais equilibrado, semelhante a text-wrap:balance.

Função named-feature() para CSS @supports

A função named-feature() permite que as regras CSS @supports consultem um pequeno conjunto de recursos nomeados específicos que não podem ser testados usando outros mecanismos @supports, mas que são considerados muito valiosos para testar.

overscroll-behavior: chain

overscroll-behavior tem três valores: none, auto e contain. Esses valores afetam dois efeitos independentes: propagação de rolagem e efeito de borda local. Por exemplo, o alongamento de rolagem esticada.

• none: sem propagação de rolagem, sem efeitos de limite local.
• auto: propagação de rolagem, efeitos de limite local.
• contain: sem propagação de rolagem, efeitos de limite local.

Essa versão rastreia um novo valor para concluir o conjunto: chain: propagação de rolagem, sem efeitos de limite local.

Esse valor é útil para efeitos como menus laterais implementados como barras de rolagem. Você pode abrir o menu e, quando ele atingir a borda, não vai rolar demais, esticar ou traduzir. No entanto, a rolagem é encadeada ao ancestral.

APIs Web

Desativar filtros SVG em plug-ins e iframes de origem cruzada ou restritos

O Chrome 150 impede que os filtros de Elementos gráficos vetoriais escaláveis (SVG) sejam aplicados a iframes de origem cruzada ou restritos, por exemplo, em sandbox, e plug-ins incorporados, por exemplo, PDFs. Quando um frame ou plug-in é pintado com um efeito de filtro SVG, a árvore de efeitos é percorrida para encontrar o ancestral mais alto sem filtros SVG, e esse efeito é aplicado.

IndexedDB: back-end SQLite

A implementação do IndexedDB do Chromium é reescrita na parte de cima do SQLite para substituir a implementação anterior que usa um híbrido de LevelDB e arquivos simples. Essa mudança não afeta a API Web.

Espera-se que essa reescrita melhore a confiabilidade e, em menor grau, o desempenho.

Por enquanto, essa mudança se aplica a novos repositórios de dados. Essa mudança é a etapa 2 de um lançamento progressivo de várias fases. Consulte a página de recursos do ChromeStatus para contextos na memória do SQLite que rastreia a etapa 1.

Contadores de frames MediaStreamTrackProcessor

Adiciona atributos discardedFrames e totalFrames à interface MediaStreamTrackProcessor. Esses contadores permitem que os desenvolvedores da Web monitorem a integridade dos pipelines de processamento de mídia rastreando o número de frames recebidos e descartados pelo processador.

Origem opaca para URLs data:

O Chrome 150 atualiza a maneira como DedicatedWorker e SharedWorker processam data: URLs. Em vez de herdar automaticamente a origem de segurança do script ou da página que os criou, esses workers recebem uma origem opaca exclusiva.

Essa mudança está alinhada com a especificação HTML do worker e melhora a segurança isolando esses workers do estado de mesma origem do criador, impedindo que eles acessem dados sensíveis por mecanismos como BroadcastChannel ou armazenamento de mesma origem. Para manter os limites de isolamento corretos, esses workers ainda residem na mesma partição de armazenamento (por exemplo, preservando o site de nível superior ou o nonce) que o criador.

Esse ajuste de segurança é ativado por padrão em plataformas para computadores e dispositivos móveis. Os administradores podem revisar ou verificar os limites de segurança nas configurações centralizadas. Para detalhes técnicos de implementação e referências de especificação, consulte a etapa 3 das configurações de worker do HTML Living Standard.

Migração de origem da PWA

Quando um usuário instala um App Web Progressivo (PWA), a identidade e o contexto de segurança dele ficam fortemente vinculados à origem da Web, por exemplo, app.example.com. Essa vinculação representa um desafio significativo para os desenvolvedores que precisam mudar a origem do PWA devido a rebranding, reestruturação de domínio ou re-arquitetura técnica. Essa mudança força os usuários a desinstalar manualmente o app antigo e reinstalar o novo, o que causa uma experiência disruptiva e possível perda de usuários. O Chrome 150 apresenta um mecanismo para que os desenvolvedores migrem um PWA instalado para uma origem nova no mesmo site, preservando a confiança e as permissões do usuário.

A política WebAppInstallForceList bloqueia a migração. Como as políticas empresariais relacionadas a aplicativos da Web são baseadas principalmente em URLs e origens, há o risco de que uma migração ignore determinadas políticas que um administrador possa ter configurado. O Chrome não oferece uma migração ao usuário quando um app é instalado à força pelo administrador da empresa. Em vez disso, um banner explica isso ao usuário.

Analisar instruções de processamento em HTML

As instruções de processamento (sintaxe: <?target data>) são uma construção DOM existente, exposta em XML, que permite objetos de nó que não são elementos, mas podem ter algum significado semântico para o processamento de um documento.

Por exemplo, é possível usá-los para indicar intervalos de streaming ou destaque sem exigir novos elementos DOM e mudar a estrutura do DOM no que diz respeito ao CSS ou como diretivas para o analisador HTML sobre como armazenar em buffer e transmitir.

Streaming fora de ordem

O streaming fora de ordem permite usar <template for> e intervalos de instruções de processamento (<?start> e <?end>) para entregar HTML em ordem não sequencial e atualizar partes atuais do documento sem JavaScript.

Promessas de rolagem programática

Esse recurso fornece um sinal confiável para o status de conclusão de uma rolagem suave programática. Todos os métodos de rolagem em Element e Window retornam objetos de promessa que são resolvidos na conclusão da rolagem, e o valor resolvido indica se a rolagem foi interrompida.

Imediatos da WebGPU

Adiciona um novo espaço de endereço imediato no WGSL e um método setImmediateData() na passagem de renderização, na passagem de computação e nos codificadores de pacote de renderização que permite transmitir pequenas quantidades de dados atualizados com frequência diretamente para sombreadores sem criar objetos de buffer de GPU ou grupos de vinculação. Isso é particularmente útil para aplicativos que precisam atualizar parâmetros por desenho, como índices de objetos, índices de materiais ou matrizes de transformação a cada chamada de desenho, permitindo melhorias significativas de desempenho, evitando o overhead de gerenciamento de buffer e grupo de vinculação.

API Web Speech: qualidade de reconhecimento no dispositivo

Estende a interface SpeechRecognition adicionando uma propriedade quality a SpeechRecognitionOptions. Essa propriedade permite que os desenvolvedores especifiquem a capacidade semântica necessária para o reconhecimento no dispositivo usando processLocally: true.

A enumeração quality proposta oferece suporte a três níveis: command, dictation e conversation, que mapeiam para aumentar a complexidade da tarefa e os requisitos de hardware. Esse recurso permite que os desenvolvedores determinem se o dispositivo local pode lidar com casos de uso de alto risco (como a transcrição de reuniões) ou se eles precisam fazer o fallback para serviços de nuvem, resolvendo a natureza opaca das capacidades do modelo no dispositivo.

Novos testes de origem

No Chrome 150, você pode ativar os seguintes novos testes de origem.

Protocolo de verificação de e-mail (EVP)

O Protocolo de verificação de e-mail (EVP) ajuda os usuários a criar, acessar e recuperar contas, fornecendo uma prova criptográfica de propriedade de maneira integrada, em vez de OTPs de e-mail manualmente.

Suspensões de uso e remoções

Esta versão do Chrome apresenta as seguintes suspensões de uso e remoções.

Remover [LegacyNoInterfaceObject] do IDL FontFaceSet

O IDL FontFaceSet do Chromium usava incorretamente [LegacyNoInterfaceObject], que ocultava FontFaceSet como uma propriedade global e excluía a propriedade do construtor do protótipo. Esse comportamento se desviava da especificação de carregamento de fontes CSS e era diferente do comportamento do Safari e do Firefox.

Essa remoção remove [LegacyNoInterfaceObject] do IDL FontFaceSet, tornando FontFaceSet acessível corretamente como uma propriedade global. Como nenhum constructor() é definido no IDL, chamar new FontFaceSet() do JavaScript gera corretamente TypeError: Illegal constructor, correspondendo ao comportamento exigido pela especificação.