こんにちは、ゆるふわwebデザイナーのなかむらです。 弊社ではデザイナーがコーディングまで行うことがあるのですが、フロントエンドエンジニアさんのような知識があるわけでもないゆるふわデザイナー2人がclip-pathツールを使おうとしてドツボにハマった経験を活かし、表層だけを撫でるclip-pathの記事を執筆いたします。 clip-pathとは メリット 落とし穴 Safariと死ぬほど仲が悪い 落とし穴にはまらない使い方とポイント パターン1:clip-pathに直接数値を書いて切り抜く パターン2:svgで書いたパスをclip-pathに読み込んで切り抜く パスのsvgの作り方 XDでのやり方 Illustratorでのやり方 まとめ clip-pathとは clip-path は CSS のプロパティで、要素のどの部分を表示するかを設定するクリッピング領域を作ります。具体的には、領域
![【css】clip-pathと仲良くなりたいwebデザイナーの話 - トライト技術ブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/a562c401c0d0663c8817152ea3ac1ba3fdb80815/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fm%2Fmh-nakamura%2F20221223%2F20221223105342.png)