SVGアニメーションのことについて調べているとこんな動画を見つけたので、真似してデザインやアニメーションを少し変更してローディング用のアイコンを作ってみました。 完成するとこんな感じになります。 1.イラレでアニメーションにするアイコンのデザインを作成する アートボードのサイズは100px × 100pxです。 2.SVG形式で保存する キャプチャはIllustrator CS5のものです。 SVGオプションは恐らくデフォルトのままでOKかと思います。 3.index.htmlを作成して、imgタグで保存したSVGファイルを読み込む <!DOCTYPE> <html lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>SVG anim
![【10分ぐらいでできる!】Illustratorで作るSVGローディングアニメーション | s-oyama.me](https://cdn-ak-scissors.b.st-hatena.com/image/square/2469d6fa9766faca2cc1b74e6dfa3e8da7c45a9c/height=288;version=1;width=512/https%3A%2F%2Fs-oyama.me%2FWP%2Fwp-content%2Fuploads%2F2014%2F08%2Fthumb_20140813_272.png)