CSS Snapshot 2026が公開

2026年2月26日付けでCSS Snapshot 2026が公開されました（参考日本語訳、W3C News）。

CSS Snpshotは、各CSSモジュール仕様がどの程度安定しているのかを示すものです。去年の9月に発行されたCSS Snapshot 2025からは、Geometry Interfaces Module Level 1が大まかな相互運用性をもつモジュール（Modules with Rough Interoperability）として追加されました。

Geometry Interfaces Module Level 1がどのようなCSSモジュールなのかは、MDNの幾何インターフェイスが簡単にまとまっています。引用してみますと、

幾何インターフェイス は、 3D および 2D グラフィックを操作するためのインターフェイスを提供する CSS モジュールです。特に、点、長方形、四角形、座標変換行列 （グラフィックを移動、拡大縮小、回転、歪め/傾け、反転、乗算/連鎖させ、逆演算/元に戻す処理）を演算するためのインターフェイスを提供します。

とあり、通常のWeb制作で使うことはまずないと思われます。

安全に公開可能なpre-CR例外（Safe to Release pre-CR Exceptions）についても見てみましょう。下記の疑似クラスやプロパティが追加されています。（カッコ内はBaselineかどうかを記載しています）

• CSS Pseudo-Elements Module Level 4の::marker疑似要素（Limited availability）
• CSS Inline Layout Module Level 3のtext-box-trimとtext-box-edgeプロパティ（いずれもLimited availability）
• CSS Environment Variables Module Level 1のenv()関数（Baseline Widely available）
• Selectors Level 4の疑似クラス
  • :scope、:defined、:focus-within、:any-link、:modal、:placeholder-shown、:default、:valid、:invalid、:required、:optional、:nth-child()、:nth-last-child（Baseline Widely available）
  • :dir()（Baseline 2023）
  • :popover-open（Baseline 2024）
  • :open、:fullscreen（Limited availability）
• CSS Basic User Interface Module Level 4のaccent-colorプロパティ（Limited availability）とoutline-colorプロパティ（Baseline Widely available）

この中でaccent-colorプロパティはわかりやすくて面白いなと思いました。下記がサンプルです。チェックボックスの色が変化しているのがわかるかと思います。

サンプルチェックボックス

Limited availabilityということで実案件で使うのは躊躇しますが、UIの見た目をCSSで変えられるというのはアクセシビリティの向上にもつながるのではないかと考えます。