Tailwind CSSでclip-pathを使う
Tailwind CSSでclip-pathを使う方法を説明します。
2025-6-3
バージョン
- tailwindcss 4系
Tailwind CSSの4系でclip-path
を使う方法を説明します。
以下のように[]
で囲って指定することができます。
半角スペースは、_
を使って指定します。
<span class="[clip-path:polygon(50%_0,0_100%,100%_100%)]"></span>
これで以下のように出力されます。
clip-path: polygon(50% 0, 0 100%, 100% 100%);