この変更が意味すること
Chrome 149 では CSS shape-outside プロパティの大幅な拡張と、Firefox・Safari に追いつく形での互換性改善が中心です。image-rendering: crisp-edges の正式サポートにより、ピクセルアート表示のクロスブラウザ対応が完了します。セキュリティ面では SVG フィルターのクロスオリジン制限が追加されています。
主な新機能
CSS shape-outside: path() / shape() / rect() / xywh()
float 要素の exclusion shape を定義する shape-outside プロパティに、4つの新しい形状関数が追加されます。
path()/shape(): SVG パスデータを使った自由な形状定義rect()/xywh(): 矩形座標による簡潔な形状指定
rect() / xywh() は Firefox・Safari ともに実装済みで、Chrome の対応によりクロスブラウザで利用可能になります。path() / shape() は Firefox が Positive シグナル。
テキストの回り込みを複雑な形状に合わせるレイアウトが、追加ライブラリなしで実現できます。
image-rendering: crisp-edges
image-rendering: crisp-edges が正式にサポートされます。画像のスケーリング時にエッジとコントラストを保持し、ぼかしを避けるレンダリングモードです。
ピクセルアートやドット絵の表示、QR コードの拡大表示などで、pixelated との使い分けが明確になります。Firefox・Safari ともに実装済み。
path-length CSS プロパティ
SVG の pathLength 属性を CSS プロパティとして公開します。<path>、<circle>、<rect> などの SVG 幾何要素に適用でき、stroke-dasharray や stroke-dashoffset と組み合わせたアニメーションの制御が CSS だけで可能になります。
Firefox は Positive シグナル。
SVG フィルターのクロスオリジン制限
クロスオリジンまたはサンドボックス化された iframe、および PDF などの埋め込みプラグインに対して、SVG フィルター効果の適用が無効化されます。サイドチャネル攻撃によるピクセル情報の漏洩を防ぐセキュリティ強化です。
Safari は実装済み、Firefox は Under consideration。
Web app scope system accent color
AccentColor / AccentColorText CSS キーワードと accent-color: auto のアクセスを、Web アプリコンテキスト内に制限します。システムのアクセントカラーはフィンガープリンティングのベクターになりうるため、一般の Web ページからの利用を制限する変更です。
Firefox は Positive シグナル。
その他の変更
- Payment Request エラー報告: ペイメントハンドラが「ユーザーキャンセル」と「内部エラー」を区別して返せるように。Safari は Positive
- WebSocket BFCache 対応: アクティブな WebSocket 接続がある場合もページを BFCache に保存可能に（Safari 実装済み）
- テーブルの border-color UA ルール削除: 仕様にない
border-color: grayルールを削除し、currentColor がデフォルトに（Firefox・Safari 実装済み） - User action pseudo class top layer boundary: :hover / :active / :focus-within がトップレイヤー要素で境界として機能
- Service Worker Router タイミングフィールド:
workerMatchedRouterSource/workerFinalRouterSource属性を追加 - autocorrect="off" Windows 対応: Windows タッチキーボードで autocorrect 属性が尊重されるように
非推奨・削除
Chrome 149 での非推奨・削除機能はデータ上確認されていません。
開発者への影響
- shape-outside の拡張: 既存の
circle()/ellipse()/polygon()に加え、より柔軟な形状定義が可能に。Progressive Enhancement として安全に導入できます - image-rendering: crisp-edges:
pixelatedとの併用フォールバックが不要に - SVG フィルター制限: クロスオリジン iframe に SVG フィルターを適用している場合は動作確認が必要
- accent-color 制限: Web アプリ以外のコンテキストでシステムアクセントカラーを使用している場合、デフォルト値にフォールバックされます
データソース: Chrome Platform Status AI解説は Claude API により自動生成されています。正確性については原文をご確認ください。