「Google Chrome 147」安定版リリース、アニメーションのネストや文字色自動調整機能が追加される

ウェブブラウザ「Google Chrome」の最新安定版であるバージョン147がリリースされました。要素ごとに独立してアニメーションを行ったり、背景色を考慮して文字色を自動で決めたり、要素の形を自由に設定したりする機能が追加されています。

Chrome 147  |  Release notes  |  Chrome for Developers
https://developer.chrome.com/release-notes/147?hl=ja

◆特定の要素だけを独立してアニメーションさせることが可能に
Chrome 147では「element.startViewTransition()」が全てのHTML要素に導入され、個別の要素を独立してアニメーションさせることができるようになりました。

この機能を使用することで、アニメーションしている要素を含むHTML要素をさらにアニメーションさせる「ビュートランジションのネスト」が可能になるとのこと。


さらに、要素がアニメーションしている間もページの他の部分はインタラクティブな状態を保てるようになっています。

◆黒文字にするか白文字にするかを自動で判定する機能が追加される
CSSに「contrast-color()」が導入されました。文字の色を指定する際に「contrast-color()」を指定することで、背景色を読み取って白文字と黒文字のどちらがよりコントラストが高いかを自動で判定してくれるようになります。

例えば、以下の画面では「送信」の文字に「contrast-color()」が設定されています。

ボタンの背景色を暗めの色に変更すると、「送信」の文字が自動で白くなりました。

◆要素の形を自由に設定できるようになる
これまで、HTMLの要素の見た目はclip-path関数やTransformプロパティを駆使することで変更できても、クリック判定などは長方形でした。Chrome 147では「border-shape」プロパティが実装され、自由に要素の形を定義することが可能になっています。

◆その他の更新点
・ビュータイムラインの名前付き範囲のセットに「scroll」が追加されました。
・CSSPseudoElementが実装されました。
・イベントの発生元が疑似要素の場合「.pseudoTarget」を通じて情報が提供されるようになりました。
・「border-width」「outline-width」「column-rule-width」の動作がCSSの仕様に準拠するようになりました。
・textPath要素の「Path」属性がサポートされました。
・WebXR Plane Detection APIが実装されました。
・「link rel="modulepreload"」を使用してJSONとスタイルをロード可能になりました。
・XMLパーサーがより安全なRustで記述されたものに置き換えられました。
・浮動小数点数精度の損失を抑えて計算する関数「Math.sumPrecise」が実装されました。
・サービスワーカーからローカルネットワークへのアクセスの制限が行われました。

◆オリジントライアル
・クロスオリジンiframeのプリレンダリング
・自動入力する予定の内容を通知するイベント
・WebNN

また、Google Chrome 147には多数のセキュリティバグフィックスが含まれています。

なお、次期安定版の「Google Chrome 148」は現地時間の2026年5月5日(火)にリリース予定です。