Figma

Figmaは、チームでのWebサイトやアプリケーションのUI/UXのデザイン制作や開発でのコミュニケーションに特化した、オンラインコラボレーションツールです。パスや画像を使って制作したデザインやグラフィックアートをURLで簡単にシェアしたり、様々な形式のファイルにアウトプットできます。

claude-code-to-figma-memo-2026-04

Claude Code to Figmaの使い方メモ（2026年4月）

「Figmaでフレーム内の配置制御をする制約の使い方」のサムネイル画像

Figmaでフレーム内の配置制御をする制約の使い方

「Figmaのブール演算機能の使い方」のサムネイル画像

Figmaのブール演算機能の使い方

「2025年9月から東京工科大学で非常勤講師としてUIに関する授業を担当することになりました」のサムネイル画像

2025年9月から東京工科大学で非常勤講師としてUIに関する授業を担当することになりました

「Web Designing 2025年8月号でFigmaの活用事例を掲載いただきました」のサムネイル画像

Web Designing 2025年8月号でFigmaの活用事例を掲載いただきました

「Figma Config 2025 発表まとめ」のサムネイル画像

Figma Config 2025 発表まとめ

「プロダクトデザイナーが開発組織でどのようにFigmaを活用しているか」のサムネイル画像

プロダクトデザイナーが開発組織でどのようにFigmaを活用しているか

「Figmaのフォントスタイル内で部分的に太字や下線を適用するショートカット」のサムネイル画像

Figmaのフォントスタイル内で部分的に太字や下線を適用するショートカット

「Figma Config2024で発表された新機能・改善のダイジェスト」のサムネイル画像

Figma Config2024で発表された新機能・改善のダイジェスト

「Figmaでオブジェクトを画面下部に固定して追従させる（プロトタイプ）」のサムネイル画像

Figmaでオブジェクトを画面下部に固定して追従させる（プロトタイプ）

「Figmaのファイル管理がちょっと便利になるTips集」のサムネイル画像

Figmaのファイル管理がちょっと便利になるTips集

「Figmaのプレビューで画面サイズの縦横比を維持する方法」のサムネイル画像

Figmaのプレビューで画面サイズの縦横比を維持する方法

「Figmaでページを分ける区切り線を追加する方法」のサムネイル画像

Figmaでページを分ける区切り線を追加する方法

「Figmaで画面タブを分割して２画面表示する方法」のサムネイル画像

Figmaで画面タブを分割して２画面表示する方法

「FigmaやFigJamでカーソルを変更して遊ぶ」のサムネイル画像

FigmaやFigJamでカーソルを変更して遊ぶ

「Figmaで範囲指定してコメントをする方法」のサムネイル画像

Figmaで範囲指定してコメントをする方法

「Figmaでコメントのバッジを非表示にする方法」のサムネイル画像

Figmaでコメントのバッジを非表示にする方法

「Figmaで複数要素を一括選択して同時編集する方法」のサムネイル画像

Figmaで複数要素を一括選択して同時編集する方法

「Figmaの開発モード（Dev mode）のリリース情報のまとめ」のサムネイル画像

Figmaの開発モード（Dev mode）のリリース情報のまとめ

「Figmaでダイアログをオーバーレイで表示させる（プロトタイプ）」のサムネイル画像

Figmaでダイアログをオーバーレイで表示させる（プロトタイプ）

「Figmaでシ��ンプルなダイアログ・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなダイアログ・コンポーネントを作る方法

「Figmaのオートレイアウトで使える便利なテクニック集」のサムネイル画像

Figmaのオートレイアウトで使える便利なテクニック集

「FigJamのマインドマップの基本的な使い方」のサムネイル画像

FigJamのマインドマップの基本的な使い方

「FigmaとFigJamの生成AIに関する機能まとめ」のサムネイル画像

FigmaとFigJamの生成AIに関する機能まとめ

「Google Meetの参加者でFigJamを共同編集する方法」のサムネイル画像

Google Meetの参加者でFigJamを共同編集する方法

「Figmaの「Little Big Updates」で公開された機能（2023年11月分）」のサムネイル画像

Figmaの「Little Big Updates」で公開された機能（2023年11月分）

「Figmaで補色やグラデーションを自動補完で作成できるカラーパレットの使い方」のサムネイル画像

Figmaで補色やグラデーションを自動補完で作成できるカラーパレットの使い方

「Figmaのテキストを階層のある箇条書きリストにする方法」のサムネイル画像

Figmaのテキストを階層のある箇条書きリストにする方法

「Figmaでオートレイアウト上の要素の重なり順を逆転する方法」のサムネイル画像

Figmaでオートレイアウト上の要素の重なり順を逆転する方法

「Figmaの「Little Big Updates」で公開された機能（2023年10月分）」のサムネイル画像

Figmaの「Little Big Updates」で公開された機能（2023年10月分）

「Figmaでオートレイアウトを無視して要素を自由に配置する方法」のサムネイル画像

Figmaでオートレイアウトを無視して要素を自由に配置する方法

「Figmaの「Little Big Updates」で公開された機能（2023年9月分）」のサムネイル画像

Figmaの「Little Big Updates」で公開された機能（2023年9月分）

「Figmaでオブジェクトを整列・均等配置する方法」のサムネイル画像

Figmaでオブジェクトを整列・均等配置する方法

「Figmaの画面レイアウトや配置に関する機能のまとめ」のサムネイル画像

Figmaの画面レイアウトや配置に関する機能のまとめ

「Figma・FigJamで使える「Mindmap(Beta)」ウィジェットの紹介」のサムネイル画像

Figma・FigJamで使える「Mindmap(Beta)」ウィジェットの紹介

「Figmaでモックアップ付きのプロトタイプを作成する方法」のサムネイル画像

Figmaでモックアップ付きのプロトタイプを作成する方法

「FigmaのデザインデータからSTUDIOのサイトを作成する方法」のサムネイル画像

FigmaのデザインデータからSTUDIOのサイトを作成する方法

「Figmaのコンポーネント機能の使い方まとめ」のサムネイル画像

Figmaのコンポーネント機能の使い方まとめ

「Figmaでテキストから画像生成できるプラグイン「AI image generator」」のサムネイル画像

Figmaでテキストから画像生成できるプラグイン「AI image generator」

「Figmaのプロトタイプのスクロール制御に関する設定」のサムネイル画像

Figmaのプロトタイプのスクロール制御に関する設定

「Figmaでテキストを使った便利なテクニック集」のサムネイル画像

Figmaでテキストを使った便利なテクニック集

「Figmaでクリックするとメニューが開くプルダウンボタン」のサムネイル画像

Figmaでクリックするとメニューが開くプルダウンボタン

「Figmaでテキストを行数で自動的に省略表示（…）する方法」のサムネイル画像

Figmaでテキストを行数で自動的に省略表示（…）する方法

「Figmaのオートレイアウトで折り返しできる「Wrap」の使い方」のサムネイル画像

Figmaのオートレイアウトで折り返しできる「Wrap」の使い方

「Config 2023で発表されたFigmaの新機能まとめ」のサムネイル画像

Config 2023で発表されたFigmaの新機能まとめ

「FigmaでiOS 17・iPadOS 17のUIキットを利用する方法」のサムネイル画像

FigmaでiOS 17・iPadOS 17のUIキットを利用する方法

「Figmaでヘッダーを画面上部に固定して追従させる（プロトタイプ）」のサムネイル画像

Figmaでヘッダーを画面上部に固定して追従させる（プロトタイプ）

「Figmaで作成したアニメーションをLottieFilesに書き出す方法」のサムネイル画像

Figmaで作成したアニメーションをLottieFilesに書き出す方法

「Figma・FigJamでシンプルなグラフを生成するプラグイン集」のサムネイル画像

Figma・FigJamでシンプルなグラフを生成するプラグイン集

「Figmaでシンプルな多角形グラフ（レーダーチャート）を作成する方法」のサムネイル画像

Figmaでシンプルな多角形グラフ（レーダーチャート）を作成する方法

「Figmaでシンプルな線グラフを生成するプラグインの紹介」のサムネイル画像

Figmaでシンプルな線グラフを生成するプラグインの紹介

「Figmaで作れるインタラクション付きコンポーネント集」のサムネイル画像

Figmaで作れるインタラクション付きコンポーネント集

「Figmaでシンプルな棒グラフを生成するプラグインの紹介」のサムネイル画像

Figmaでシンプルな棒グラフを生成するプラグインの紹介

「Figmaの「Little Big Updates」で公開された32の機能（2023年3月）」のサムネイル画像

Figmaの「Little Big Updates」で公開された32の機能（2023年3月）

「FigJamで表形式のテーブル（CSV）を追加・編集する方法」のサムネイル画像

FigJamで表形式のテーブル（CSV）を追加・編集する方法

「Figmaとの連携で便利な外部ツールの使い方」のサムネイル画像

Figmaとの連携で便利な外部ツールの使い方

「「ちいさくはじめるデザインシステム」の執筆に共著で参加しました」のサムネイル画像

「ちいさくはじめるデザインシステム」の執筆に共著で参加しました

「Figmaでシンプルな円グラフを生成するプラグインの紹介」のサムネイル画像

Figmaでシンプルな円グラフを生成するプラグインの紹介

「Figmaでテキスト内にアイコンを挿入する方法」のサムネイル画像

Figmaでテキスト内にアイコンを挿入する方法

「Figmaのオートレイアウトの基本的な使い方」のサムネイル画像

Figmaのオートレイアウトの基本的な使い方

「Figmaで簡単にメッシュ・グラデーションをランダム生成する方法」のサムネイル画像

Figmaで簡単にメッシュ・グラデーションをランダム生成する方法

「Figmaのコンポーネント化を解除・削除する方法」のサムネイル画像

Figmaのコンポーネント化を解除・削除する方法

「Figmaで複数の画像素材から一括で背景を透過する方法」のサムネイル画像

Figmaで複数の画像素材から一括で背景を透過する方法

「Figmaで幅が4096pxより大きい画像を高解像度で取り込む方法」のサムネイル画像

Figmaで幅が4096pxより大きい画像を高解像度で取り込む方法

「NotionでFigma/FigJamを連携する方法」のサムネイル画像

NotionでFigma/FigJamを連携する方法

「GoogleカレンダーのイベントにFigma/FigJamのリンクを同期する方法」のサムネイル画像

GoogleカレンダーのイベントにFigma/FigJamのリンクを同期する方法

「FigmaとNotionで会議をなめらかに進行するための議事録Tips」のサムネイル画像

FigmaとNotionで会議をなめらかに進行するための議事録Tips

「Figmaのデザインデータを外部ツール上でプレビューする方法」のサムネイル画像

Figmaのデザインデータを外部ツール上でプレビューする方法

「Schema2022で公開した登壇資料のまとめ」のサムネイル画像

Schema2022で公開した登壇資料のまとめ

「Figmaで効率的にオブジェクトモデルを設計する方法」のサムネイル画像

Figmaで効率的にオブジェクトモデルを設計する方法

「Schema by Figma 2022の登壇の振り返り」のサムネイル画像

Schema by Figma 2022の登壇の振り返り

「Figmaで作成したスライドをkeynoteやpowerpoint形式で出力する方法」のサムネイル画像

Figmaで作成したスライドをkeynoteやpowerpoint形式で出力する方法

「シンプルなコンポーネントシリーズの人気ランキング」のサムネイル画像

シンプルなコンポーネントシリーズの人気ランキング

「Schema by Figma 2022で登壇します」のサムネイル画像

Schema by Figma 2022で登壇します

「Figmaでファイル内のテキストを検索・一括置換する方法」のサムネイル画像

Figmaでファイル内のテキストを検索・一括置換する方法

「Figmaで使える画像生成AIプラグイン「Text2Image」」のサムネイル画像

Figmaで使える画像生成AIプラグイン「Text2Image」

「Figmaでコンポーネントに内包されたインスタンスのプロパティを効率的に変更する方法」のサムネイル画像

Figmaでコンポーネントに内包されたインスタンスのプロパティを効率的に変更する方法

「Figmaの使いやすさを向上する設定のヒント」のサムネイル画像

Figmaの使いやすさを向上する設定のヒント

「Figma・FigJamのファイルをローカルに保存する方法」のサムネイル画像

Figma・FigJamのファイルをローカルに保存する方法

「マウスオーバー・クリックすると�罫線スタイルが変わるテーブル（プロトタイプ）」のサムネイル画像

マウスオーバー・クリックすると罫線スタイルが変わるテーブル（プロトタイプ）

SmartHRのプロダクトデザイングループのFigmaの運用を大公開！第1弾：デザインデータに対する考え方

SmartHRのプロダクトデザイングループのFigmaの運用を大公開！第1弾：デザインデータに対する考え方

「FigmaとFigJamを日本語に言語設定する方法」のサムネイル画像

FigmaとFigJamを日本語に言語設定する方法

「Figmaで汎用的なUIコンポーネントを作る方法」のサムネイル画像

Figmaで汎用的なUIコンポーネントを作る方法

「Figmaを使って複数人で円滑にコラボするためのTips」のサムネイル画像

Figmaを使って複数人で円滑にコラボするためのTips

「FigmaのPaddingやカーソル移動のデフォルト値を設定する方法」のサムネイル画像

FigmaのPaddingやカーソル移動のデフォルト値を設定する方法

「FigmaやFigJamで使えるウィジェット機能の使い方」のサムネイル画像

FigmaやFigJamで使えるウィジェット機能の使い方

「Figmaのファイルのサムネイルを設定・解除する方法」のサムネイル画像

Figmaのファイルのサムネイルを設定・解除する方法

「Figmaファイルをローカルに書き出し・保存する方法」のサムネイル画像

Figmaファイルをローカルに書き出し・保存する方法

「Figmaでオブジェクトを上下左右に反転する方法」のサムネイル画像

Figmaでオブジェクトを上下左右に反転する方法

「FigmaでWindows・Macのローカルフォントを使う方法」のサムネイル画像

FigmaでWindows・Macのローカルフォントを使う方法

「Figmaで枠線（Stroke）を部分的に適用する方法」のサムネイル画像

Figmaで枠線（Stroke）を部分的に適用する方法

「FigmaのComponent propertiesとVariantsの使い分けの考察」のサムネイル画像

FigmaのComponent propertiesとVariantsの使い分けの考察

「FigmaのTokyo Config Watch Party2022の参加レポート」のサムネイル画像

FigmaのTokyo Config Watch Party2022の参加レポート

「Figmaでテキストごとオブジェクトを拡大・縮小する方法」のサムネイル画像

Figmaでテキストごとオブジェクトを拡大・縮小する方法

「FigmaでColor Stylesをカスタマイズする方法」のサムネイル画像

FigmaでColor Stylesをカスタマイズする方法

「Figmaでレイヤーやグループを自動整理できる「Clean Document」の使い方」のサムネイル画像

Figmaでレイヤーやグループを自動整理できる「Clean Document」の使い方

「スライドするアニメーション付きのスイッチ（プロトタイプ）」のサムネイル画像

スライドするアニメーション付きのスイッチ（プロトタイプ）

「Slackの特定チャンネルにFigmaのコメントを通知する方法」のサムネイル画像

Slackの特定チャンネルにFigmaのコメントを通知する方法

「Figmaでシンプルなツールチップ・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなツールチップ・コンポーネントを作る方法

「Figmaでネタ画像を作るためのTips」のサムネイル画像

Figmaでネタ画像を作るためのTips

「Figmaで塗りが円形に広がるアニメーションのボタン（プロトタイプ）」のサムネイル画像

Figmaで塗りが円形に広がるアニメーションのボタン（プロトタイプ）

「Figmaでシンプルなサイドメニュー・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなサイドメニュー・コンポーネントを作る方法

「Figmaでアウトラインをパスに変換・復元する方法」のサムネイル画像

Figmaでアウトラインをパスに変換・復元する方法

「Figmaのコメント機能の使い方」のサムネイル画像

Figmaのコメント機能の使い方

「Figmaでおすすめの直線・曲線パスを使ったTipsまとめ」のサムネイル画像

Figmaでおすすめの直線・曲線パスを使ったTipsまとめ

「Figmaでシンプルなラジオボタン・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなラジオボタン・コンポーネントを作る方法

「Figmaでシンプルなチェックボックス・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなチェックボックス・コンポーネントを作る方法

「Figma��でグリッドやガイド（ルーラー）を表示・非表示する方法」のサムネイル画像

Figmaでグリッドやガイド（ルーラー）を表示・非表示する方法

「Figmaでフォントのプレビューを表示する方法」のサムネイル画像

Figmaでフォントのプレビューを表示する方法

「Figmaのコンポーネント機能の基本的な使い方」のサムネイル画像

Figmaのコンポーネント機能の基本的な使い方

「Figmaでおすすめの写真・画像加工のTipsまとめ」のサムネイル画像

Figmaでおすすめの写真・画像加工のTipsまとめ

「Figmaで紙吹雪（パーティクル）を均等に散らす方法」のサムネイル画像

Figmaで紙吹雪（パーティクル）を均等に散らす方法

「Figmaで画像を圧縮したりwebp形式で保存する方法」のサムネイル画像

Figmaで画像を圧縮したりwebp形式で保存する方法

「Figmaでシンプルなフォーム・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなフォーム・コンポーネントを作る方法

「Figmaで企業ロゴなどのブランド・アセットを検索できる「Brandfetch」の使い方」のサムネイル画像

Figmaで企業ロゴなどのブランド・アセットを検索できる「Brandfetch」の使い方

「Figmaのプラグイン「Filter」でPhotoshopのようなエフェクトを使う方法」のサムネイル画像

Figmaのプラグイン「Filter」でPhotoshopのようなエフェクトを使う方法

「Figmaでシンプルなヘッダー・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなヘッダー・コンポーネントを作る方法

「FigJamの作業が捗る便利なウィジェットの使い方」のサムネイル画像

FigJamの作業が捗る便利なウィジェットの使い方

「Figmaでシンプルなタブ・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなタブ・コンポーネントを作る方法

「Figmaで画像をドット絵のようなモザイクに変換する方法」のサムネイル画像

Figmaで画像をドット絵のようなモザイクに変換する方法

「Figmaで簡単にコントラスト比を調べる方法」のサムネイル画像

Figmaで簡単にコントラスト比を調べる方法

「Figmaで無料のアイコン素材集を利用する方法」のサムネイル画像

Figmaで無料のアイコン素材集を利用する方法

「Figmaでシンプルなボタン・コンポーネントを作る方法」のサムネイル画像

Figmaでシンプルなボタン・コンポーネントを作る方法

「Figmaで簡単にテキストや図形を斜めに変形する方法」のサムネイル画像

Figmaで簡単にテキストや図形を斜めに変形する方法

「Figmaでシンプルなテーブル（表）を作る方法」のサムネイル画像

Figmaでシンプルなテーブル（表）を作る方法

「Figmaで簡単にフローチャートや画面遷移図をつくる方法」のサムネイル画像

Figmaで簡単にフローチャートや画面遷移図をつくる方法

「Figmaでネオンやガラスの質感を手軽に使えるプラグイン「Morph」の紹介」のサムネイル画像

Figmaでネオンやガラスの質感を手軽に使えるプラグイン「Morph」の紹介

「Figmaでマスクを適用・解除する方法」のサムネイル画像

Figmaでマスクを適用・解除する方法

「Figmaで曲線パスに沿って文字やシェイプをはわせる方法」のサムネイル画像

Figmaで曲線パスに沿って文字やシェイプをはわせる方法

「Figmaで角丸を使った便利なテクニック集」のサムネイル画像

Figmaで角丸を使った便利なテクニック集

「Figmaのコメント通知をSlackで受け取る方法」のサムネイル画像

Figmaのコメント通知をSlackで受け取る方法

「Figmaで様々なドロップシャドウ（影）を適用する方法」のサムネイル画像

Figmaで様々なドロップシャドウ（影）を適用する方法

「Figmaのプラグインのインストール方法と使い方」のサムネイル画像

Figmaのプラグインのインストール方法と使い方

「Figmaでオブジェクトや画像にぼかしを入れる方法�」のサムネイル画像

Figmaでオブジェクトや画像にぼかしを入れる方法

「Figmaで簡単に円グラフや棒グラフを作る方法」のサムネイル画像

Figmaで簡単に円グラフや棒グラフを作る方法

「Figmaでテキストや図形を編集できない時に試すこと」のサムネイル画像

Figmaでテキストや図形を編集できない時に試すこと

「Figmaでテキストを縦書きに対応する方法」のサムネイル画像

Figmaでテキストを縦書きに対応する方法

「Figmaで画像を○や□などの好きな形に切り抜く方法」のサムネイル画像

Figmaで画像を○や□などの好きな形に切り抜く方法

「Figmaで簡単にスマホやPCのモックアップに画像をはめ込む方法」のサムネイル画像

Figmaで簡単にスマホやPCのモックアップに画像をはめ込む方法

「Figmaで図形やテキストのべた塗りとグラデーションの使用方法」のサムネイル画像

Figmaで図形やテキストのべた塗りとグラデーションの使用方法

「Figmaで破線・点線や矢印がついたパスを作る方法」のサムネイル画像

Figmaで破線・点線や矢印がついたパスを作る方法

「FigJamの機能と使い方の解説（動画付き）」のサムネイル画像

FigJamの機能と使い方の解説（動画付き）

「Figmaでファイル形式を指定して画像に書き出す方法」のサムネイル画像

Figmaでファイル形式を指定して画像に書き出す方法

「Figmaで写真やイラストの背景を簡単に切り抜き・透過する方法」のサムネイル画像

Figmaで写真やイラストの背景を簡単に切り抜き・透過する方法

「Figma初心者が使い方に困った時に試してほしいTips」のサムネイル画像

Figma初心者が使い方に困った時に試してほしいTips

「Figmaの「Noise」でざらざらした質感を表現する方法」のサムネイル画像

Figmaの「Noise」でざらざらした質感を表現する方法

「Figmaで簡単にコンテンツマーケティング用のバナー画像を作ってみよう」のサムネイル画像

Figmaで簡単にコンテンツマーケティング用のバナー画像を作ってみよう

「Figmaで簡単に波線・ジグザグのパスを作る方法」のサムネイル画像

Figmaで簡単に波線・ジグザグのパスを作る方法

「Figmaで模様や柄などの繰り返しタイルパターンを作る方法」のサムネイル画像

Figmaで模様や柄などの繰り返しタイルパターンを作る方法

「Figmaで簡単になめらかな角丸の「スーパー楕円」を作る方法」のサムネイル画像

Figmaで簡単になめらかな角丸の「スーパー楕円」を作る方法

「Figmaで画像の色をセピアや単色のモノクロに変換する方法」のサムネイル画像

Figmaで画像の色をセピアや単色のモノクロに変換する方法

「UIデザインの作業を加速するFigmaプラグイン10選」のサムネイル画像

UIデザインの作業を加速するFigmaプラグイン10選