Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
学ぶ Figmaのタイプツール:UI/UXデザインのためのテキスト追加とスタイリング | Figmaでのオブジェクトの作成と整理
figmaによるUI/UXデザイン

Figmaのタイプツール:UI/UXデザインのためのテキスト追加とスタイリング

メニューを表示するにはスワイプしてください

テキストツールの使用方法:

  • ポイントテキスト: 1行のみのテキスト;
  • エリアテキスト: 指定したエリア内に収められたテキスト。

タイポグラフィ設定

  • フォント名/書体: すべてのフォントまたは特定のコレクション(例:Google Fonts)から選択;
  • フォントウェイト: フォントの太さを調整;
  • フォントスタイル: イタリックなどのスタイルを適用;
  • フォントサイズ: テキストのサイズを変更;
  • 行間(リーディング): テキスト行間のスペースを調整;
  • 文字間隔(トラッキング): 文字同士の間隔を調整。

段落の整列オプション(左揃え、中央揃え、右揃えなど)も利用可能。

詳細テキスト設定

一部の詳細テキスト設定は、プレビューボックス付きのポップアップウィンドウからアクセス可能。ウィンドウには通常3つのタブがあります:

  • 基本タブ: 追加のフォント変更を適用。箇条書きや番号付きリストのオプションも利用可能;
  • 詳細タブ: 文字や数字などの高度な設定を提供;
  • バリアブルタブ: 傾斜、イタリックスタイル、フォントウェイトの手動調整が可能(フォントによって利用可否が異なる)。
Note
注意

フォントの変更を適用する際は、必ずテキストをハイライトするか、レイヤーパネルから選択してください。

すべて明確でしたか?

どのように改善できますか?

フィードバックありがとうございます!

セクション 2.  7

AIに質問する

expand

AIに質問する

ChatGPT

何でも質問するか、提案された質問の1つを試してチャットを始めてください

セクション 2.  7
some-alt