adapt

Plan responsive adaptations for designs across mobile, tablet, and desktop contexts.

7|Updated Mar 4, 2026

Search Tags:#design #accessibility #mobile #responsive #breakpoints #desktop

Ready to run

npx skills add https://github.com/Davie521/claude-skills --skill adapt-davie521

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: adapt
Source: https://github.com/Davie521/claude-skills/tree/main/plugins/design/skills/adapt
Command: npx skills add https://github.com/Davie521/claude-skills --skill adapt-davie521

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designs often fail to render effectively across devices and contexts; this skill provides a structured approach to adapt layouts, interactions, and content for mobile, tablet, desktop, and beyond.

Core Features & Use Cases

Responsive breakpoints planning across mobile, tablet, and desktop
Touch-target sizing, accessible interactions, and progressive enhancement
Context-specific patterns for navigation, content prioritization, and typography
Use Case: Prepare a single design system that can adapt to smartphone portrait, tablet landscape, and desktop workflows.

Quick Start

Provide a responsive adaptation plan for a given design across a specified target context.

Frequently Asked Questions about adapt

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I make my design responsive across mobile, tablet, and desktop?▼

A responsive adaptation plan specifies breakpoint strategies, touch-target sizing, and progressive enhancement for target contexts. It guides applying layout and interaction patterns from mobile to desktop with clear accessibility considerations.

What's the best way to plan responsive breakpoints for a design system?▼

Planning responsive breakpoints involves defining adaptive layout strategies for smartphone portrait, tablet landscape, and desktop workflows. You specify context-specific patterns for typography, content prioritization, and navigation across each breakpoint.

How do I ensure accessible interactions and touch-target sizing on mobile devices?▼

Accessible interactions on mobile require proper touch-target sizing and progressive enhancement. You specify adaptive interaction strategies that maintain clear accessibility considerations across smartphone, tablet, and desktop contexts.

Does this approach work for adapting a single design system to multiple device contexts?▼

Yes, adapting a single design system to multiple device contexts involves specifying responsive layouts and content strategies for smartphone portrait, tablet landscape, and desktop workflows. It provides a structured approach to ensure effective rendering across all contexts.

When do I need to specify adaptive content and layout strategies for different screen sizes?▼

You need adaptive content and layout strategies when designs fail to render effectively across varying screen sizes and contexts. It involves applying context-specific patterns for navigation, content prioritization, and typography from mobile to desktop and beyond.