Figmaでは Option / Alt ホバーで要素間の余白を数字で確認する
目視の「だいたい」をやめ、実装前に余白を数値で答え合わせする。
どんな問題を解決するか / いつ使うか
オートレイアウトやスペーシングトークンを使っているのに、実装とのズレが起きるとき。レビューで「もう少し空けて」と言われがちで、根拠となる数値をすぐ出したいとき。
やり方
- Figmaで対象フレームを開く。
- Mac: Option / Windows: Alt を押しながら、基準にしたいオブジェクトの上へホバーする。
- 隣接要素との距離がピクセル（または現在の単位）で表示されるので、DESIGN.md やトークン表の値と照合する。
- ズレていれば、オートレイアウトの gap / padding をトークン値に直してから開発へ渡す。
注意点・対応状況
- ネストが深いと「どの間を測っているか」を取り違えやすい。測りたい2要素を意識して選ぶ。
- 絶対配置の要素ではオートレイアウトの gap と数字が一致しないことがある。実装仕様（絶対かフローか）とセットで伝える。
出典
- 投稿者: @wokobo_net
- 投稿: @wokobo_net · 2026-10-10
- 収集日: 2026-10-11（JST）