adapt

Adapts designs across screen sizes, devices, and platforms using breakpoints and fluid layouts.

Updated Jun 28, 2026

Search Tags:#responsive design #cross-device #mobile #breakpoints #fluid layout #viewport #touch targets

One-click install

npx skills add https://github.com/AO-HyS/aohys.com --skill adapt-ao-hys

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: adapt
Source: https://github.com/AO-HyS/aohys.com/tree/main/.agents/skills/adapt
Command: npx skills add https://github.com/AO-HyS/aohys.com --skill adapt-ao-hys

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Designs built for a single viewport break on other devices, forcing manual rework of layouts, spacing, and touch targets for every screen size and context. ## Core Features & Use Cases - Responsive Adaptation: Implements breakpoints and fluid layouts so interfaces work across mobile, tablet, and desktop viewports. - Touch Target Adjustment: Resizes interactive elements for touch-based contexts and alternative platforms like print. - Use Case: You have a desktop-first landing page and need it to render correctly on phones and tablets; invoke this Skill with the target context to restructure the layout accordingly. ## Quick Start Ask the AI to adapt the current design for mobile and tablet viewports using the adapt skill.

Frequently Asked Questions about adapt

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

FAQPage Schema

How do I make a design responsive across devices?▼

Invoke the adapt skill with a target context such as mobile or tablet. It applies breakpoints, fluid layouts, and adjusted touch targets so the design works across screen sizes and platforms.

What contexts does responsive design adaptation support?▼

The skill supports mobile, tablet, desktop, and print contexts, as indicated by its argument hint. You pass the target and context when invoking it to direct the adaptation.

Can I adapt a desktop layout for touch devices?▼

Yes. The skill adjusts touch targets and layout structure for touch-based contexts, converting pointer-oriented desktop designs into interfaces usable on phones and tablets.

When should I not use automated layout adaptation?▼

Avoid it when a platform requires a fundamentally different information architecture rather than a resized layout, such as native app navigation patterns, where a ground-up redesign is more appropriate.