本文までスキップする
0

読みもの
Journal

【初心者向け】Figmaのローカルスタイルの使い方
Date :
Category :
コラム
Share :

こんにちは。
ウィルスタイルの近久です。

社会人になってもうすぐ1年。
デスクワークがメインなので運動不足が気になり、今年からジムに通い始めました。週2回を目標に、身体を動かす習慣を身につけようとしています。
やはり、身体は何よりも大事な資本。健康のためには運動だけでなく、食事や睡眠も欠かせませんよね。やると決めたらしっかり取り組みたいタイプなので、毎食アプリに記録し、栄養バランスをチェックしています。(いつまで続くのかはまた別のお話)
アプリでは、1日の食事内容と運動量をもとに点数が出るのですが、最近は高得点を目指すのがちょっとした楽しみになっています。

さて、今回はFigmaの便利な機能であるローカルスタイルのご紹介です。
デザインをしていると、「この色、さっき使っていた色と違う気がする」ということがあるのではないでしょうか。そんなときに役立つのが、Figmaのローカルスタイル機能です。これを使うと、デザインの一貫性を保ちつつ、作業効率をぐっと向上させることができます。

今回は、ローカルスタイル初心者の方に向けて基本的な使い方や設定方法をわかりやすく解説していきます。まだ使ったことがない方はぜひ参考にしてみてください。

目次

Figmaのローカルスタイルとは?

そもそも「ローカルスタイルって何?」という方に向けて、一言で説明すると「使用する色、フォント、エフェクトなどのデザイン設定を一元管理し、プロジェクト全体で統一感を保ちながら効率よく作業できる機能」のことです。 たとえば、色やフォントを1つずつ手動で変更するのではなく、スタイルとして保存しておけば、どこでも一括で変更できます。

ローカルスタイルを活用するメリット

ローカルスタイルを使うことで、デザイン作業がぐっとスムーズになります。ここでは、具体的なメリットを紹介します。

  • デザインの統一性を維持
  • 作業の効率化
  • デザイン変更時の手間削減

ローカルスタイルの設定方法

それでは、ローカルスタイルを実際に設定する方法を説明します。
設定はたったの2ステップ。色、フォント、エフェクトのいずれも同じ手順で設定可能です。
先にスタイルを設定する方法、作成したデザインからローカルスタイルを設定する方法の2パターンがあります。

先にスタイルを設定する方法

  1. 設定するスタイルの種類を選ぶ
  2. スタイルの詳細を設定する

ローカルスタイルの編集・適用

スタイルを作成した後、必要に応じて変更することもできます。例えば、色やフォントの種類やサイズを変更したいときには、スタイルを編集するだけで、すべての関連要素が一括で変更されます。
また、スタイルを適用したい要素を選んで、該当するスタイルをクリックすれば簡単に適用できます。

スタイル変更前
スタイル変更後

おわりに

今回はFigmaのローカルスタイルについて、初心者向けに基本的な使い方を解説しました。 ローカルスタイルを活用することで、デザインの統一感を保ちながら作業を効率化でき、時間の節約にも繋がります。
Figmaには他にもたくさん便利な機能があるので、ぜひ色々試していただけたらと思います。
最後まで読んでいただきありがとうございました。

  • Author
    Mizuka Chikahisa