今回の使用例
OcticonsはGitHubのアイコン集です。今回はdownloadの16px版を選び、同じSVGを16・32・48pxで表示しました。下の保存リンクではアイコンだけに頼らず、何が保存されるかを文字でも伝えています。
検索して公式SVGを保存する
- 公式のOcticons一覧の「Search icons...」にdownloadを入力します。
- 結果のdownloadを開き、16px版の詳細を確認します。
- 今回のファイルは公式リポジトリのdownload-16.svgから取得しました。RawのSVGをdownload.svgという名前で保存します。
- 同じリポジトリのLICENSEも保存します。作例ではLICENSE.txtとして同梱しています。
取得したSVGは427バイト、viewBoxは0 0 16 16でした。16px向けの絵を48pxに拡大することと、別途用意された24px版を選ぶことは同じではありません。実際に使うサイズで輪郭を確認してください。
文字と並べて使う
<a href="example.txt" download="octicons-example.txt">
<img src="download.svg" width="24" height="24" alt="">
例文をテキストで保存
</a>この例では隣の文字がリンクの意味を伝えるので、画像のaltは空にしています。画像単独のリンクに流用する場合は、別途名前が必要です。リンクを押したことと保存完了は分け、ブラウザのダウンロード一覧や実ファイルを確認します。
ZIPを展開し、example.htmlを開くと同じ作例が動きます。フレーム内では保存が制限される環境もあるため、その場合は作例を直接開いて試してください。
MITと確認範囲
公式配布はMIT。Copyright (c) 2026 GitHub Inc.の著作権・許諾文の全文をZIPにも残しています。自作HTML・CSS・例文はCC0ですが、Octiconsの条件をCC0へ変更していません。ロゴや商標の使用まで一律に許可する説明でもありません。
2026年10月16日、公式検索と詳細ページ、SVG保存、3サイズの表示、例文リンクからのファイル保存をPCブラウザで確認しました。スマホ実機、すべてのアイコン・サイズ・支援技術での確認は未実施です。作者はGitHub・Primerの制作チームであり、個人開発やAI利用、最近の流行は断定しません。