Figma 画像書き出し完全ガイド｜PNG・SVG・PDFを4ステップで出力

Figmaの画像書き出しは、対象を選択して右パネルの「エクスポート」から形式と倍率を指定するだけで完了します。PNG・JPG・SVG・PDFの使い分けから一括書き出し、透過出力まで、この記事で4ステップと5つの実務ハックを解説します。

▶ 3日で初案件PR

この記事でわかること

Figmaの書き出し4ステップを3分で習得できる。PNG・JPG・SVG・PDFを用途で即決できる判断基準がわかる。透過PNGの設定ミスをゼロにする3手順を知ることができる。

この記事の結論

Figmaの書き出しは「選択→形式指定→倍率指定→エクスポート実行」の4ステップで完了します。Web用途ならPNG/JPG、コード連携ならSVG、提案資料ならPDFを選ぶのが実務の基本です。フリーランス案件では納品前にクライアントへ形式確認を行うことで、差し戻しをゼロに近づけられます。

状況別ショートカット

Figma画像書き出しは4ステップで完了

操作自体は4ステップで完結するため、手順を覚えれば30秒以内に実行できます。「エクスポートボタンがどこにあるのか」を把握するだけで、初回から迷わず書き出せるようになります。

ステップ1：書き出し対象を選択する

Figmaのキャンバス上で、書き出したいフレーム・レイヤー・グループをクリックして選択します。フレームを選択すると右パネルにフレーム名が表示されるため、対象が正しいことをここで確認してください。

キャンバス全体を書き出したい場合は、選択を解除した状態（何も選んでいない状態）でエクスポートを実行します。この挙動はフレーム単位の書き出しと異なるため、「意図しないサイズで出力された」というトラブルを防ぐうえで重要な区別です（Figmaからのエクスポート – Figma公式ヘルプ）。

「フレームを選択するか/しないか」という1つの違いが出力範囲を決定するため、書き出す前に選択状態を必ず目視で確認してください。

ステップ2：右パネルで「エクスポート」を追加する

対象を選択した状態で、画面右パネル最下部にある「エクスポート」セクションを確認します。初期状態では空欄になっているため、「＋」ボタンをクリックして書き出し設定を追加してください。

設定できる項目は形式（PNG/JPG/SVG/PDF）、スケール（倍率）、サフィックス（ファイル名末尾への追記文字列）の3つです。この3項目が書き出し品質のすべてを決定します。

ステップ3：形式と倍率を指定する

形式ドロップダウンで目的に応じた出力形式を選び、スケールで倍率を指定します。Web用途で2x（2倍）を設定すると、Retina/高解像度ディスプレイ向けの品質が確保できます。

倍率を1xのままにしておくと、高解像度ディスプレイでぼやけて見えることがあります。「書き出し形式の問題」ではなく「倍率設定の問題」であるため、画質低下を感じた場合はまず倍率を2x〜3xに変更してください。なお、画像圧縮で画質を落とさない方法も合わせて参考にすると、書き出し後のファイル最適化に役立ちます。

あわせて読みたい

画像圧縮で画質落とさない方法|5つの仕組みで軽量化 画像圧縮で画質を落とさない方法を解説。JPEG圧縮率80～85%またはPNG/WebP可逆圧縮で、ファイルサイズを30～70%削減。5つのツール選びと設定で最適化。

ステップ4：「エクスポート」ボタンを押して保存する

設定完了後、セクション内に表示される「エクスポート {レイヤー名}」ボタンをクリックします。保存先を選択するダイアログが表示されるため、任意のフォルダを指定してファイルを保存してください。

ショートカットを使う場合、MacではShift + Command + E、WindowsではShift + Ctrl + Eでエクスポートモーダルを呼び出せます（Figmaからのエクスポート – Figma公式ヘルプ）。複数要素をまとめて確認・実行したい場面では、モーダル経由の操作が効率的です。

Q：フレームではなくグループを選択した場合も書き出せますか？

A：はい、グループを選択した状態でも同じ手順でエクスポートできます。グループには背景フレームが含まれない場合があるため、意図した範囲で出力されているか確認してください。

Q：書き出し設定を複数パターン保存しておくことはできますか？

A：はい、「＋」を複数回押すことで、異なる形式・倍率の設定を複数追加できます。エクスポート実行時にはすべての設定分のファイルが一度に生成されます。

Figma書き出し形式は用途で4択に絞れる

PNG、JPG、SVG、PDFの使い分けは、形式ごとに向いているケースと向いていないケースを整理しておくと判断時間を大幅に短縮できます。迷ったときは「透過が必要かどうか」を最初の判断軸にしてください。

PNGは透過・Web素材の第一選択肢

PNGは透過（アルファチャンネル）をサポートし、ロゴやアイコン、ボタン素材など背景を透かしたい画像に最適です。可逆圧縮のため画質劣化がなく、Web制作での素材書き出しには最も汎用性が高い形式です。

写真のような色数の多い画像ではJPGと比べてファイルサイズが大きくなりやすいため、写真素材の書き出しには向きません。「透過が必要かどうか」を最初の判断軸にすると、PNG/JPGの選択が即決できます。

JPGは写真・背景ありのビジュアルに向く

JPGは非可逆圧縮のため画質をある程度犠牲にしますが、写真やビジュアル系コンテンツではPNGよりファイルサイズを大幅に小さく抑えられます。バナー、ヘッダー画像、プレゼン用スクリーンショットなど、透過が不要で写真が主体のコンテンツに向いています。

透過を必要としないにもかかわらずPNGで書き出すと、ファイルサイズが不必要に増加してWebページの表示速度に影響します。用途が確定している場合は形式を迷わず指定することがページパフォーマンス改善の基本です。

SVGはアイコン・イラストの解像度フリー出力

SVGはベクター形式であるため、どの解像度でも劣化しません。アイコン、ロゴ、シンプルなイラストなど、コード上で扱うUIパーツの書き出しに向いています。CSSでの色変更やサイズ変更もSVGなら容易に実装できます。画像フリーアイコン選びでSVG形式が推奨される理由も、この解像度フリーの特性にあります。

あわせて読みたい

画像フリーアイコン選びは3条件で即決|商用利用安全サイト8選 フリーアイコンの商用利用は3条件で即判断。著作権トラブルを防ぐ見分け方と、安全性の高い8サイトの選び方を解説。ライセンス確認で法的リスクをゼロに。

写真やグラデーションが複雑な要素はSVGに変換しても期待どおりに出力されないことがあり、ファイルサイズが膨大になる場合もあります。SVGの適用範囲はシンプルなベクターデザインに限定して運用するのが実務上の標準です。

PDFは提案資料・複数ページ納品に対応

PDFはFigmaの複数フレームを1ファイルにまとめて書き出せるため、提案資料、仕様書、ワイヤーフレームの納品に向いています。書き出しはメニューの「ファイル > エクスポート」から実行し、対象フレームを選択した状態で形式にPDFを指定します。

PDFは画像編集ソフトでの再編集が前提の納品には向かないため、クライアントが「Figmaデータそのものを受け取りたい」という場合はFigmaの共有リンクを渡す方法と使い分けてください。

Q：1つの要素をPNGとSVGの両方で書き出すことはできますか？

A：はい、エクスポートセクションに設定を2行追加することで、1回のエクスポート操作で両形式を同時に書き出せます。納品で複数形式が求められる場合に活用できます。

Q：JPGの品質（圧縮率）はFigmaで調整できますか？

A：現在のFigmaのJPG書き出しでは品質スライダーは表示されず、自動圧縮で出力されます。品質を細かく調整したい場合は、いったんPNGで書き出してから別途画像変換ツールで圧縮する方法が現実的です。

Figma一括書き出しは複数選択で対応

複数の画面や素材を個別に書き出していると、時間がかかるだけでなく設定漏れや書き忘れが発生しやすくなります。Figmaの一括書き出しを活用すると、複数のフレームを同じ設定で一度に出力でき、ミスの発生を抑えられます。

Shift選択で対象を複数指定する

キャンバス上でShiftキーを押しながら複数のフレームやレイヤーをクリックすると、選択状態を維持したまま対象を追加できます。左パネルのレイヤーリストからもShift選択が可能で、名前を確認しながら対象を選びやすいという利点があります。

複数選択後に右パネルを確認すると「エクスポート」セクションが表示されるため、ここで形式と倍率を設定してください。設定は選択したすべての要素に一括適用されます。

ショートカットキーでモーダルから一括管理する

MacではShift + Command + E、WindowsではShift + Ctrl + Eを押すと、書き出し設定の一覧モーダルが開きます。このモーダルではページ内のすべてのエクスポート設定済み要素が一覧表示され、チェックボックスで書き出し対象を取捨選択できます。

個別に設定済みの要素をまとめてレビューしてから実行できるため、「設定は入れたが書き出し忘れた」という事故を防ぎやすい操作です。複数素材の納品前にはこのモーダルを経由することで確認漏れを防げます。

一括書き出し前に要素名を整理しておく

一括書き出しで生成されるファイル名は、Figmaのレイヤー名またはフレーム名がそのまま使われます。「Frame 1」「Frame 2」のようなデフォルト名のままだと、書き出し後のファイル整理に時間がかかります。

書き出し前にフレーム名を「top_hero」「about_section」のように用途が分かる名称に変更しておくと、納品ファイルの整理工数を大幅に削減できます。複数人での作業やクライアントへの納品では、ファイル名の命名規則を事前に合意しておくことが差し戻し防止につながります。

Q：大量のアセットを一括で書き出す場合、処理は重くなりますか？

A：要素数が多い場合や倍率が高い（3x以上）場合は処理に数十秒かかることがあります。大量の書き出しを行う際は、まず少数で設定確認してから実行してください。

Q：一括書き出し時に形式を要素ごとに変えることはできますか？

A：はい、各要素に個別にエクスポート設定を追加しておけば、一括実行でも要素ごとの形式が維持されます。先に個別設定を入れてからショートカットモーダルで一括実行する流れが効率的です。

Figma透過書き出しは3手順で設定

透過の仕組みを正しく理解することで、3手順で確実に透過PNGを出力できます。「PNGで書き出したのに背景が白くなってしまう」原因のほとんどは、形式設定ではなくFill設定の見落としにあります。

手順1：書き出し形式をPNGに指定する

SVGも透過対応していますが、Web素材としての汎用性を考えると透過目的の第一選択はPNGです。JPGは透過非対応のため、透過が必要な素材にJPGを選ぶと背景が白で塗りつぶされます。

エクスポートセクションで形式ドロップダウンをPNGに設定してください。この時点でFigma上の透過部分は書き出しに反映される準備が整っています。

手順2：背景色（Fill）の「Show in exports」を確認する

フレームに背景色が設定されている場合、デフォルトでは書き出し時に背景色が含まれます。フレームを選択して右パネルの「Fill」セクションを確認し、塗りの左側にある目のアイコン（Show in exports）をオフにすると、その塗りは書き出し結果から除外されます。

これが「透過PNGを設定したはずなのに背景が残る」原因の大部分を占めます。Figmaの透過設定は「形式をPNGにする」だけでは不完全で、「Fillのエクスポート表示設定」も必ずセットで確認してください。

手順3：書き出し後に透過を目視確認する

書き出したPNGファイルを画像ビューアで開き、背景がチェッカー柄（透過を示すパターン）になっていることを確認します。ブラウザで開くと背景色が付いて見える場合がありますが、これはブラウザの表示設定によるもので、透過データ自体には問題がありません。

納品前にはAdobe Photoshopや別のFigmaファイルに配置して、意図した透過になっているかを確認する習慣をつけると、クライアントへの誤納品を防げます。また、画像の背景透過を無料でする方法も参考にすると、Figma以外の環境での確認作業を効率化できます。

あわせて読みたい

こんなに簡単!? 画像の背景透過は無料で3秒完了 画像の背景透過は無料AIツールやペイント、Officeで3秒完了。Adobe ExpressやCanvaなど登録不要のツール、Windows11ペイントでも簡単に透過できます。

Q：フレームではなくコンポーネントやグループを透過PNGで書き出すとどうなりますか？

A：コンポーネントやグループには背景フレームがないケースが多いため、Fillの設定がなければ初めから透過で書き出されます。意図せずフレームの背景色を継承している場合は、親フレームのFill設定を確認してください。

Q：Figmaで透過PNGを書き出すと画質が落ちることはありますか？

A：いいえ、透過の有無は画質に影響しません。画質が低下する場合は倍率が1xのままになっていることが原因です。Retina対応が必要な場合は倍率を2xに変更して書き出してください。

Figma書き出しできない原因は3パターン

「ボタンが反応しない」「ファイルが保存されない」「エクスポートセクションが表示されない」という状況は、原因が3つのパターンに絞られます。パターンを把握すれば、解決に要する時間を大幅に短縮できます。

パターン1：エクスポート設定が追加されていない

「エクスポート」ボタンを押したのにダイアログが出ない場合、右パネルのエクスポートセクションに設定（形式・倍率）が追加されていないことが原因の大半を占めます。「＋」ボタンを押して設定行を追加した後に「エクスポート」ボタンが有効化されます。

設定を追加せずにボタンを押しても動作しない仕様のため、「ボタンを押したら選択肢が出るはず」という想定とFigmaの実際の動作がずれてしまうことで発生する誤解です。

パターン2：選択対象が正しくない

レイヤーパネル上で「非表示」に設定されている要素、またはマスクグループの内側だけを選択している場合に書き出しが意図通りに動作しないケースがあります。

非表示レイヤーはエクスポート対象から除外されるため、書き出し後にファイルが空白や意図しない内容で生成される原因になります。書き出し前にレイヤーの表示/非表示状態をパネルで確認してください。

パターン3：ブラウザ版とデスクトップ版の保存先の違い

Figmaにはブラウザ版とデスクトップアプリ版があり、書き出し時の保存ダイアログの動作が若干異なります。ブラウザ版ではダウンロードフォルダへ自動保存される場合があり、「保存されない」と感じた実際はダウンロードフォルダに出力済みというケースが少なくありません。

ブラウザのダウンロード設定で「毎回保存先を確認する」にしておくと、保存先の見失いを防げます。書き出し操作を行った直後にブラウザのダウンロードバーを確認する習慣が現実的な対処法です。

Q：Figmaでエクスポートセクション自体が表示されない場合はどうすればよいですか？

A：何も選択されていない状態または複数のバラバラな要素が選択されている状態では、エクスポートセクションが表示されない場合があります。単一のフレームまたはグループを選択し直すと表示されます。

Q：書き出したファイルを開くと壊れている（サイズが0KB）ことがあります。原因は？

A：非表示レイヤーのみを書き出そうとしたか、ネットワーク接続が不安定な状態でクラウドデータの取得が失敗した可能性があります。要素の表示状態を確認してから再度書き出しを試みてください。

Figmaの書き出し設定を3分で診断

「今の書き出し設定が正しいかどうか分からない」という状況は、経験者でも案件の種類によって判断が変わります。3つの質問で自分の状況を確認してみてください。

Q1：書き出し後の画像がぼやけて見えますか？

YesならQ2へ / NoならResult A

Q2：倍率（スケール）を1xのままにしていますか？

YesならResult B / NoならQ3へ

Q3：書き出し形式はJPGを選んでいますか？

YesならResult C / NoならResult D

Result A：現在の設定で問題ありません。

倍率と形式の設定が適切に機能しています。納品前に実際の使用環境（スマートフォン・Retina画面）で表示確認を行うと、より確実です。

Result B：倍率を2xまたは3xに変更してください。

1x設定はFigmaのデザインピクセルをそのまま出力するため、Retinaディスプレイでは実質的に解像度が半分に見えます。2xに変更するだけで画質の問題が解消するケースがほとんどです。

Result C：透過が不要な用途ならJPGで問題ありません。

FigmaのJPG書き出しは自動圧縮のため、品質が不十分な場合はPNGで書き出してから別途圧縮ツールで変換する方法を検討してください。

Result D：形式・倍率ともに設定済みなのに画質が低い場合は、SVGへの変更を検討してください。

ロゴやアイコン類はSVGで書き出すことで解像度依存をなくせます。写真素材はPNGまたは高品質JPGで再書き出してください。

Q：Retinaディスプレイ向けに3xで書き出すと、通常ディスプレイでは大きすぎる画像になりますか？

A：ファイルサイズと画素数は増えますが、Webでの表示サイズはCSSの幅・高さ指定で制御するため表示上の問題はありません。サイズが大きいほどページ読み込みに影響するため、用途に応じて2x/3xを使い分けてください。

Q：倍率の数値は整数以外（1.5xなど）でも設定できますか？

A：はい、Figmaのエクスポートセクションではカスタム倍率を入力できます。特定の寸法に合わせたい場合や1.5xが最適な場合は直接数値入力が有効です。

Figma書き出しは5つの仕組みで品質を担保

書き出し品質を安定させるための5つのハックを解説します。フリーランス案件での差し戻しや再書き出しを減らすため、今日から1つずつ取り入れてください。

ハック1：フレーム単位設計で書き出し事故を防止

【対象】： Figmaファイルの整理をせずに書き出しを行い、不要な要素が混入するトラブルに悩んでいるフリーランス

【手順】：

書き出したい単位ごとに「フレーム」を作成し、コンテンツをそのフレーム内に収めます（15分/ファイル初期設定）。次にレイヤーパネルでフレーム名を用途が分かる名前（例：hero_pc_2x、logo_transparent）に変更します（5分）。書き出し前にフレームのみを選択してプレビューを確認し、範囲が意図通りであることを目視確認してください（1分/書き出しごと）。

【コツと理由】： 「フレーム単位で設計しておき、フレーム選択=書き出し範囲確定」という設計先行型にすることで、選択の曖昧さがゼロになります。書き出し設定もフレームに紐づいて保持されるため、次回以降は設定のやり直しが不要になります。

【注意点】： フレーム内の不要な非表示レイヤーはファイルを肥大化させます。チームでの作業では混乱の原因になるため、定期的にクリーンアップしてください。

ハック2：サフィックスと倍率の組み合わせでRetina対応を一発完了

【対象】： WebやアプリのUIデザインをFigmaで行い、1x/2xの両方を納品する必要があるフリーランスデザイナー

【手順】：

エクスポートセクションに「＋」で設定行を1行追加し、倍率1x・サフィックスなし・形式PNGに設定します（1分）。さらに「＋」で2行目を追加し、倍率2x・サフィックス「@2x」・形式PNGに設定します（1分）。「エクスポート」を1回押すと、「button.png」と「button@2x.png」が同時に生成されます（30秒）。

【コツと理由】： サフィックスと複数設定を組み合わせることで、1度のエクスポートで両サイズを同時生成できます。リネーム作業をゼロにしながら命名規則を守れる点が実務上の最大のメリットです。

【注意点】： 設定行を増やしすぎると1回の書き出しで大量のファイルが生成されます。設定は実際に必要な形式・倍率だけに絞り、不要な設定行は「－」ボタンで削除する習慣をつけてください。

ハック3：命名規則の統一で納品後の差し戻しをゼロに近づける

【対象】： 複数のフレームを一括書き出しして納品するフリーランスで、ファイル名の混乱でクライアントから差し戻しが発生したことがある方

【手順】：

プロジェクト開始時に「ページ名_エリア名_倍率」（例：top_hero_2x）のような命名規則をクライアントまたはチームと合意します（15分/プロジェクト初期）。Figmaのフレーム名を命名規則に沿った名前に変更します（5〜10分/ページ）。一括書き出し後に出力ファイルの名前リストを確認し、命名規則から外れているものがないかチェックして納品してください（2分）。

【コツと理由】： 「書き出し後にリネームする」のではなく、「Figmaのフレーム名を最初から命名規則に合わせる」ことで、書き出し後のリネーム作業がゼロになります。Figmaはフレーム名をそのままファイル名に使用するため、設計段階での命名が最も効率的な管理法です。フリーランス案件では納品形式の確認の観点で家事按分と同様に「根拠を先に整備する」姿勢が差し戻し防止に直結します。

あわせて読みたい

家事按分割合目安|費用別の決め方と税務署に通る根拠の作り方 フリーランスの家事按分割合を費用別に解説。面積比・時間比の計算方法から税務調査に通る根拠書類の作り方まで、実践的な按分管理の全手順を紹介します。

【注意点】： 日本語フレーム名は書き出しファイル名でも日本語になります。ファイルシステムやCMSによっては日本語ファイル名が問題を起こす場合があるため、納品先の環境が不明な場合は英数字・ハイフン・アンダースコアのみで命名してください。

ハック4：書き出し前チェックリストで品質ゼロ欠損を実現

【対象】： 書き出し後にぼけ・余白・形式ミスが発覚して再書き出しが発生することが多いフリーランス

【手順】：

書き出し実行前に「対象フレームの表示状態確認→倍率確認→形式確認→フレーム名確認」の4点を確認します（2分）。書き出し後に生成されたファイルを画像ビューアで開き、100%表示でぼけ・欠け・余白の有無を確認します（2分）。問題がなければ納品フォルダへ移動し、問題があれば設定を修正してから再書き出ししてください（1分）。

【コツと理由】： 「書き出し前の確認4点」と「書き出し後の目視確認」の2段階をルーティン化することで、再書き出しの発生頻度を大幅に減らせます。確認を省いた書き出しは短時間に見えて、再作業コストを含めると結果的に時間のロスになります。

【注意点】： 書き出したファイルをダブルクリックして開く確認だけでは不十分なケースがあります。特に透過PNGは、チェッカー柄表示ができる環境（Photoshop、別のFigmaファイルへの配置など）で確認してください。

ハック5：納品形式の事前確認でクライアント要望の認識ズレを防止

【対象】： フリーランスとして納品後に「形式が違う」「サイズが違う」という指摘を受けた経験がある方

【手順】：

案件受注時または開始時に「納品ファイルの形式・解像度・カラープロファイル」をクライアントへメールで確認します（5分）。確認事項をFigmaのコメント機能またはメモアプリに記録し、書き出し設定のリファレンスとして参照できる状態にします（3分）。中間納品（ドラフト提出）を1回挟み、形式・品質がクライアントの期待と一致しているかを確認してから最終納品してください（案件中1回）。

【コツと理由】： 「開始時の形式確認 + 中間チェック」の2ステップを踏むことで最終納品後の差し戻しをほぼゼロにできます。差し戻しが発生すると修正時間だけでなくクライアントとのやり取りに追加で時間がかかるため、事前確認の数分は効果が高い投資です。

【注意点】： 印刷用途の案件では、FigmaがスクリーンRGB表示向けのツールであることをクライアントへ事前に伝えてください。印刷用のCMYK出力が求められる場合はIllustrator等の印刷対応ツールを使うことを検討してください。FigmaのデフォルトはsRGBカラープロファイルで出力されます。

Q：これらの設定はFigmaのコンポーネントに対しても同様に機能しますか？

A：はい、コンポーネントもフレームと同様の手順でエクスポート設定を追加できます。メインコンポーネントに設定を入れておくと、インスタンスにも設定が引き継がれます。

Figma画像書き出しを4ステップで完了させる：差し戻しゼロの実務習慣

Figmaの画像書き出しは「選択→設定追加→形式・倍率指定→エクスポート実行」の4ステップが基本です。PNG・JPG・SVG・PDFの使い分けは用途（透過の有無、解像度要件、納品目的）で判断でき、迷った場合は形式比較表を参照することで即決できます。一括書き出しはShift選択またはショートカットモーダルで対応でき、透過PNGはFillの「Show in exports」設定の確認が必須です。

フリーランスとして納品品質を安定させるためには、書き出し設定のルーティン化が最も効果的な投資です。5つのハックを今日から1つずつ取り入れることで、差し戻しや再書き出しの発生頻度を着実に減らせます。作業効率化のさらなる手段として、作業効率を上げる方法も参考にしてください。

あわせて読みたい

作業効率上げる方法|フリーランスが5つの仕組みで時間を30%削減 フリーランスが作業効率を30%削減する5つの仕組みを解説。タスク優先順位の明確化、無料ツール活用、環境整備で月3〜5時間を回収できます。

Figma 画像書き出しに関するよくある質問

Q：Figmaの書き出しでカラープロファイルはどのように設定できますか？

A：FigmaはsRGBカラープロファイルで出力されます。CMYKでの書き出しには対応していないため、印刷物が最終用途の場合はIllustratorなどの印刷対応ツールへのデータ移行を検討してください。

Q：書き出した画像がFigmaのプレビューと色が違って見えます。なぜですか？

A：モニターのキャリブレーション設定やOSの色管理設定の違いによって生じることが多いです。FigmaはsRGBで出力するため、閲覧環境がsRGBに対応していることを確認してください。

Q：書き出しにかかる時間を短縮する方法はありますか？

A：書き出し対象を必要な要素だけに絞ること、不必要に高い倍率（4x以上）を避けること、ファイル内の不要レイヤーを整理しておくことで処理時間を抑えられます。大量書き出しの前にファイルの整理を行うことが結果的に最速の方法です。

【出典・参照元】

Figmaからのエクスポート – Figma公式ヘルプ

Figmaのエクスポート(書き出し) 画像やPDFやSVGで書き出す – note

Figmaでの画像の書き出し方法 – vividsoul