responsive-design

レスポンシブWebデザインのベストプラクティスを提供する専門スキル。モバイルファースト、フルードグリッド、メディアクエリ、ブレークポイント設計、画像最適化、タイポグラフィのスケーリング、タッチターゲット設計を包括的にサポートする。プロジェクト固有のTailwind CSS設計システム、8pxグリッド、Electron対応を含む。Anchors:• Responsive Web Design (Ethan Marcotte) / 適用: フルードグリッド・メディアクエリ設計 / 目的: デバイス横断的なUI設計の基礎• Mobile First (Luke Wroblewski) / 適用: モバイルファースト設計手法 / 目的: 制約駆動設計とプログレッシブエンハンスメント• 16-ui-ux-guidelines.md / 適用: プロジェクト固有のデザインシステム / 目的: Tailwind CSS・Electron対応・WCAG準拠Trigger:Use when implementing responsive layouts, designing breakpoints, creating mobile-first styles, optimizing images for multiple viewports, or ensuring cross-device compatibility.breakpoint, media query, mobile first, fluid grid, viewport, responsive layout, adaptive design, flexible images, srcset, clamp, レスポンシブ, ブレークポイント, Tailwind

$ Installer

git clone https://github.com/daishiman/AIWorkflowOrchestrator /tmp/AIWorkflowOrchestrator && cp -r /tmp/AIWorkflowOrchestrator/.claude/skills/responsive-design ~/.claude/skills/AIWorkflowOrchestrator

// tip: Run this command in your terminal to install the skill