Figma

Figma:グリッドレイアウトにHugと分数単位を追加

2025.12.09編集部
Figma:グリッドレイアウトにHugと分数単位を追加

Figmaがグリッドレイアウト機能を強化し、「Hug」と「分数単位(Fractional Units)」のサポートを追加した。これにより、デザイナーはより柔軟で直感的なレイアウト設計が可能になる。

Hug機能は、グリッドの行や列がコンテンツのサイズに自動的に合わせて調整される機能である。従来の固定サイズ指定に加え、コンテンツ量に応じて動的にサイズが変化するため、テキストや画像の量が異なる複数のバリエーションを効率的に管理できる。特にカード型UIやリストレイアウトなど、コンテンツサイズが可変のデザインで威力を発揮する。

分数単位は、CSS Gridで使用される「fr」単位に相当する概念である。利用可能なスペースを比率で分割することで、レスポンシブなレイアウトをより簡潔に表現できる。例えば「1fr 2fr」と指定すれば、2つの列が1:2の比率でスペースを分け合う。ピクセル値やパーセンテージによる指定と組み合わせることも可能で、固定幅のサイドバーと可変幅のメインコンテンツエリアといった複雑なレイアウトも容易に実現できる。

これらの機能追加により、FigmaのAuto LayoutとGridの表現力が大幅に向上し、より実装に近いプロトタイプの作成が可能になった。開発者への引き継ぎもスムーズになることが期待される。

出典: Hug and fractional units for grid

最新のニュース

Latest News

  • Googleの新しいグラデーションアイコンデザインがさらに多くのアプリに展開
    AI2026.04.27
    Googleの新しいグラデーションアイコンデザインがさらに多くのアプリに展開
  • AI体験をデザインするためのルールブック
    AI2026.04.25
    AI体験をデザインするためのルールブック
  • NASAが衛星画像から作った書体「Your Name in Landsat」
    AI2026.04.24
    NASAが衛星画像から作った書体「Your Name in Landsat」
  • デザインは死なない。上流へシフトしているだけだ
    AI2026.04.21
    デザインは死なない。上流へシフトしているだけだ

デジタルデザインの最新情報をお届け!

unprintedのメールマガジンにご登録いただくと、デジタルデザインの最新情報をメールで受け取ることができます。今までに配信したバックナンバーも公開中!

※登録ボタンを押すと利用規約に同意されたものとします。