逆角丸デザインの実装 clip-pathによる逆角丸の実装とコンポーネント化

角丸と、逆に角丸を当てている要素からせり出したような角丸の2つを組み合わせて作られる、逆角丸デザインを実装する方法を解説します。また、逆角丸部分をコンポーネント化する際に考えるべきポイントについても紹介します。

著者 中野 祐人 Jamstackエンジニア