Implement modern responsive layouts using container queries, fluid typography, CSS Grid, and mobile-first breakpoint strategies. Use when building adaptive interfaces, implementing fluid layouts, or creating component-level responsive behavior.
Master modern responsive design techniques to create interfaces that adapt seamlessly across all screen sizes and device contexts.
Detailed pattern documentation lives in references/details.md. Read that file when the navigation tier above is insufficient.
Copy a source-pinned command for your client. You run it yourself.
Destination: .claude/skills/responsive-design · pinned to the source commit
# Run from your project root
git clone https://github.com/wshobson/agents.git .skillboard-tmp
git -C .skillboard-tmp checkout 38e19c20d2b154510b0e624a2e3e186b19b5c527
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/plugins/ui-design/skills/responsive-design" ".claude/skills/"
rm -rf .skillboard-tmpReview the source before running. This copies files into your project; it is not a one-click install and does not verify runtime safety.
sudo apt update && sudo apt install -y gitnpm install -g @anthropic-ai/claude-code# Run from your project root
git clone https://github.com/wshobson/agents.git .skillboard-tmp
git -C .skillboard-tmp checkout 38e19c20d2b154510b0e624a2e3e186b19b5c527
mkdir -p ".claude/skills"
cp -r ".skillboard-tmp/plugins/ui-design/skills/responsive-design" ".claude/skills/"
rm -rf .skillboard-tmpDestination: .claude/skills/responsive-design
Scanner static-checks@0.1.0 · commit 38e19c20d2b1. Static checks cannot prove runtime safety – review the source and the exact diff before installing. How checks work.
No static rules matched. This is not a safety guarantee.