見出し画像

Illustratorで作ったSVG画像が崩れる問題を解決

イラレでアイコンのSVG画像を作ったのですが、書き出した後、なぜか形が歪になる問題が起きていました。

画像2

なんでだろうーって何度か作り直したりと試行錯誤していたのですが、ふと、サイズに問題があるのではと思い、調整してみました。

アイコンサイズ(width 14px、height 8px)をwidth 60px、height 32pxに。

画像2

きれいに表示されて驚きました。
13×13pxのデータでも崩れずに表示されているアイコンもあるので、いまいち理由はしっくりこないのですが、きれいになったと言うことで結果OKです。
デザイン女子部の朝活でちまちま調べていましたが、やっとスッキリしました。同じように困っている方のお役に立てば嬉しいなと思い、noteにまとめました。