【Figma】エクスポート(書き出し)でサイズが変わってしまう理由

Figma-exportのサムネイル

WEBサイトへ画像を設置したはいいものの、画像がぼやけて見える…。そんな時に原因となっているのは、ほとんどの場合が画像サイズに端数が出ていることだと思います。(たまに端数がないのに特定の画面サイズで若干ぼやけることもありますが…)

▼端数が出ている(144.5)

この状態で画像を設置すると、画像がぼやけてしまいます。


…はい。これは割とすぐに辿り着く情報なので、それは知ってるよ!な方が多いと思います。

そうではなくて、しっかり整数でエクスポートしているのに端数が出るんですよね?
安心してください。それは要素自体がピクセルグリッドにスナップできていないことが原因です。

Figma導入の際にピクセルにスナップする設定にしている方が多いと思いますが、たまーにスナップされていないコンテンツが見受けられます。

この場合エクスポートの設定時には整数になっていても、書き出されたファイルが端数になってしまいます。

一度最大までオブジェクトを拡大し、ピクセルグリッドに沿って配置されているか確認してみましょう。

▼拡大すると見えるグリッド(ガイドグリッドではありません)

エクスポートの関する効率的な方法など、まとめ記事を作成してますので、合わせて読んでみてください。新しい発見があるかもしれません。

最新記事
  • カテゴリー
  • 月別
  • Twitter

    ココナラでデザインを依頼する

    7000本の授業が見放題!社会人向けオンライン学習動画【Schoo(スクー)】

    Webデザイン業界特化のレバテック

    定額制で質問し放題【Web食いオンラインスクール】

    関連記事

    最新記事NEW

    CONTACTCONTACT CONTACTCONTACT

    お問い合わせ

    ご意見やお仕事のご依頼などは以下よりご連絡ください。

    情報入力

    内容確認

    完了

      お名前必須

      フリガナ必須

      メールアドレス必須

      お問い合わせ内容