ページ構造やコンテンツ配置に関するレイアウトUI

→ まずページの骨格から

タブバー・ボトムナビ・ハンバーガーメニューなど、コンテンツ切り替えに使うナビゲーションUI

→ 画面間の導線を設計する

グラフやチャートなど、データを視覚的に表現するUI

→ メインコンテンツの見せ場を作る

チャットやフォームなど、データ入力に関するUI

→ ユーザーからの入力を受け取る

ツールチップやバッジなど、情報を補足・強調して表示するUIコンポーネント

→ 情報を補足・強調して伝える

ボタンやトグルなど、直感的に操作できるシンプルなUIコンポーネント

→ ボタン・トグルで細部を仕上げる

スワイプやドラッグなど、タッチ操作・ジェスチャーに特化したUIコンポーネント

→ インタラクションで体験を磨く

フェード・スライド・スプリングなど、Framer Motionで実装するアニメーションパターン

→ 動きで体験を豊かにする

HTMLの基本要素と構造に関するリファレンス。テキスト・リンク・メディア・フォーム・テーブル・メタ情報を網羅

JavaScriptによるDOM操作・イベント・アニメーション・通信・ストレージなど、ページの動作に関するリファレンス

CSSによる見た目・レイアウト・アニメーション・レスポンシブ・テキスト・画像・表示制御に関するリファレンス

楽しくインタラクティブな子供向けUI要素

日常生活で役立つ便利なツール集