every Tech Blog

株式会社エブリーのTech Blogです。

iOSアプリ開発においてベクター画像にはSVGとPDFのどちらを使うべきか

この記事は every Tech Blog Advent Calendar 2025 の7日目の記事です。

はじめに

デリッシュキッチンのiOSアプリを開発している成田です。 iOSアプリを開発していると、アイコンやロゴなどの画像アセットを扱う場面が必ずあります。 アイコンやロゴなどのベクター画像を扱う際、PDFSVGの2つの形式が候補として出てくるかと思いますが、どちらを使えば良いか迷ったことはないでしょうか。 今回はPDFとSVGをいくつかの観点から比較し、どちらを選ぶべきか考えてみたいと思います。

PDFとSVGはそもそも何が違うのか

まず、両者の設計目的の違いを見てみましょう。

項目 SVG PDF
設計目的 Web用ベクター画像 環境に依存しない文書形式
ファイル形式 テキスト(XML) バイナリ
開発元 W3C Adobe

SVGは「画像」のための形式

SVGは「Scalable Vector Graphics」の略で、Web上でベクター画像を扱うために設計された形式です。 テキスト(XML)形式で、描画データだけを持つシンプルな構造になっています。

<svg viewBox="0 0 24 24">
  <circle cx="12" cy="12" r="10" fill="#FF6B00"/>
</svg>

例えば上記は円を描画するものですが、XML形式なので人間にも読み取ることができます。

PDFは「文書」のための形式

PDFは「Portable Document Format(ポータブル・ドキュメント・フォーマット)」の略で、1993年にAdobeが開発したファイル形式です。 Adobe公式によると、PDFの設計目的は「どのコンピューターやソフトウェアで文書を作成しても、作成時の見た目のまま表示・印刷できること」でした。

PDFはベクター画像やラスター画像も含められる汎用的なコンテナ形式です。 PDFは文書形式として設計されているため、描画データ(ベクター・ラスター画像)の他にも、メタデータ(作成者、日時)やフォント情報、ページ構造、印刷設定など様々な情報が含まれるとみられます。

アイコンやロゴなどの用途で必要なのは描画データだけですが、PDFではそれ以外の情報も含まれるため、その分オーバーヘッドが生じます。 一方でSVGは最初からベクター画像のために設計されているため、アイコン用途にはより適していると言えそうです。

iOSのサポート

形式 サポート開始
PDF iOS 11(2017年)
SVG iOS 13(2019年)

iOSではPDFの方が古くからサポートされています。iOS12以下をサポートする必要がある場合はPDFを選ぶ必要がありますがありますが、2025年12月現在では大体のアプリはiOS12以下はサポートしていないと思うので基本的にはどちらを使っても特に不具合等は起こらないとみられます。 Appleの公式ドキュメントを読んでもどちらを推奨するなどの旨の記述は見つかりませんでした。

ファイルサイズ

シンプルなアイコンの場合

シンプルなアイコンの場合、一般的にSVGはPDFより軽くなります。

実際に上のようなシンプルなアイコンをPDFとSVGで書き出して比較したところ、ファイルサイズは以下のようになりました。

形式 サイズ
SVG 約0.8KB
PDF 約5KB

複雑な画像の場合

ただし、複雑なパスやグラデーションが多いような画像では、PDFの方が軽くなる可能性もありそうです。 SVGはテキスト形式のため、複雑な曲線を表現するには大量の座標データをそのまま保持する必要がありますが、一方でPDFはバイナリ圧縮されるため、ある種の複雑なベクターデータでは圧縮効率が高くなる場合があると考えられます。

Git上の管理

PDFはバイナリ形式なのでGitで差分を確認することができませんが、SVGはテキスト(XML)形式なので、Gitで差分を確認することができます。 PRのレビューで変更内容を確認できることは大きなメリットなのでGit管理のしやすさにおいてはSVGの方が適しています。

レンダリングの品質

iOSアプリでSVGとPDFを使った際のレンダリング品質の差については、調べた限りでは明確な違いは見つかりませんでした。 どちらもベクター形式なので拡大縮小しても劣化せず、レンダリング品質・機能面ではどちらを選んでも問題なさそうです。

結論

ここまでいくつかの観点で比較してきましたが、iOS 13以降をサポートするアプリであればSVGを使うのが良さそうです。

SVGを選ぶ理由

  1. アイコンは「画像」なので、画像用に設計されたSVGが適切
  2. シンプルなアイコンならファイルサイズが小さい
  3. Gitで差分が見える(PRレビューがしやすい)

おわりに

今回はiOSアプリにおけるベクター画像の形式としてSVGとPDFを比較しました。 PDFは長くiOS開発で使われてきた実績がありますが、iOS13でSVGがサポートされた今、アイコン用途ではSVGを選ぶメリットの方が大きいと感じます。 特にGitで差分が見えるようになるのは、チーム開発において地味ながら嬉しいポイントです。