Motion Primitives：文字やボタンに、なめらかな動きを足せるReact向けのモーション部品集

用途

• 文章の手直し
• AIコーディング

何ができるか

Motion（旧Framer Motion）とTailwind CSSを前提に、ふわっと現れる文字・スライドするパネル・ホバー演出など、よく使うUIアニメーションを部品として揃えたライブラリ。ドキュメントサイトからコピーして組み込める形で配布されており、コーディングエージェントに「この演出を当てて」と指示するときの共通語彙にもなりやすい。

向いている用途

• LPやダッシュボードの見出し・ボタンに、手書きせずに動きを足したいとき
• Claude CodeやCodexにUIを作らせるとき、動きの指定を部品名で揃えたいとき
• React／Next.jsの画面に、軽いマイクロインタラクションを足したいとき

実際の使われ方（活用事例）

事例未収集：出典を確認できる活用事例をまだ集められていません。見つかり次第追加します。

導入の手軽さ

●●●●○ 手軽 — npmで入れ、ドキュメントの部品をコピーしてTailwindクラスと組み合わせる。ReactとMotionの知識があると速い。

npm i motion motion-primitives

※ 代表的な導入コマンドの例です。最新の手順は公式ドキュメントを確認してください。

ライセンス

MIT License（SPDX: MIT）。利用・改変・再配布が自由（著作権表示とライセンス文の同梱が必要）。

ライセンスの説明は要点のみです。利用前にリポジトリのLICENSEファイル原文を確認してください。

リポジトリ情報