backdrop-filter

ぼかし。FireFoxとIE以外は大体使える。

background-clip、text-fill-color

background-clipは背景の配置調整、text-fill-colorはテキストの色。
background-clip: text; と text-fill-color: transparent; の合わせ技で背景を文字で切り抜いたりする(color: transparent; ではできない)。

mix-blend-mode

いろんな色変換

prefers-color-scheme

ダークモードに対応するためのメディアクエリ

scroll-snap

スクロール位置合わせ

flex gap

flexbox での余白を楽に調整

.list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}

.item {
  width: calc((100% - 30px * 2) / 3);
}

display: grid

中央揃えとかも格段に楽になる。

.hoge {
  display: grid;
  place-items: center;
}

text-stroke

テキストの装飾に。

background-clip: text

クリッピングマスクの作成。