【2025年最新】Figmaのガイド機能完全解説

【2025年最新】Figmaのガイド機能完全解説

投稿者の画像

h.koyama

2025.06.09

この記事を共有する

この記事を共有する

Close

Figmaのガイドは、オブジェクトの整列や余白の統一に役立つ基本機能です。
この記事では、ガイドの表示方法・引き方・調整・削除までの全手順をわかりやすく解説します。
ショートカットやよくあるミスも紹介しているので、初心者〜中級者まで参考にしてください。

Figmaの「ガイド」とは?

  • ガイドは、キャンバス上に引ける垂直・水平の補助線です
  • 配置のズレを防ぎ、整ったデザインを作るのに役立ちます
  • デフォルトでは非表示ですが、必要なタイミングで自由に使えます
フレーム内の赤い線がガイド線で青い線が選択中のガイド線になります

ガイドの表示方法

Figmaのガイドは、初期状態では非表示になっています。ガイドを引くには、まず「定規(ルーラー)」を表示する必要があります。

  • メニュー【表示】【定規】
  • ショートカット:
     - Mac:⌘+R
     - Windows:Ctrl+R
こちらはメニューからガイドを表示させています
こちらはショートカットでガイドを表示させています

ガイドを引く・追加する方法

キャンバスにガイドを引く

  • 定規(キャンバスの上部・左側)からドラッグしてガイドを追加
  • 水平・垂直どちらも自由に引けます

フレーム内にガイドを引く

  • 定規からドラッグしフレームにカーソルを合わせると自動的にフレーム内のガイドに切り替わります
  • 他のフレームやキャンバスには影響しないため、基本的にこの方法で使用します

ガイドの位置を調整する

ガイドは選択すると青くなり、ドラッグで移動可能です。より正確に配置したい場合は、画面上部に表示されるX/Y座標を参考にカーソルで微調整できます。

ガイドを選択してドラッグし大まかに調整できます
ガイドを選択してカーソルで1px単位で調整できます

ガイドを複製する

「option」を押しながら複製したいガイドをドラッグすると複製することができます。


フレームやキャンバスを複製すると、その中に引いたガイドも一緒にコピーされます。特定のレイアウトを他のアートボードに展開する際に便利です。

ガイドをロックする方法

2025年6月現在、Figmaにはガイドをロックする機能は実装されていません。ガイドは非表示にすると自動的にロックされます。

ガイド・定規を非表示にする方法

定規を非表示にすると、ガイドもあわせて非表示になります。

  • メニュー【表示】【定規】
  • ショートカット:
     - Mac:⌘+R
     - Windows:Ctrl+R

ガイドを削除する方法

不要になったガイドは、個別削除または一括削除が可能です。

1本ずつ削除

  • ガイド線を右クリック→【ガイドを削除】
  • ガイドを選択してバックスペースキーを押す
一つ目が右クリック、二つ目がバックスペースでガイドを削除しています

垂直/水平ガイドをすべて削除

  • 垂直ガイド上で右クリック→【すべての垂直ガイドを削除】
  • 水平ガイド上で右クリック→【すべての水平ガイドを削除】
定規の上部にカーソルを合わせて右クリックしすべての垂直ガイドを削除を選択
定規の左部分にカーソルを合わせて右クリックしすべての水平ガイドを削除を選択

まとめ

Figmaのガイド機能は、整ったUI設計を行ううえで欠かせない補助ツールです。
定規を表示してガイドを引くことで、要素の配置や余白を視覚的に調整できます。
ガイドの表示方法・引き方・調整・削除までの全手順を知っておくことでデザイン作業に活かせます。