MCP.so
登录

adapt

pbakaus / impeccable

关于 adapt

Adapt designs to work across different screen sizes, devices, contexts, or platforms. Implements breakpoints, fluid layouts, and touch targets. Use when the user mentions responsive design, mobile layouts, breakpoints, viewport adaptation, or cross-device compatibility.

安装 adapt

npx skills add https://github.com/pbakaus/impeccable --skill adapt

基本信息

分类

设计与 UI

代码仓库

pbakaus / impeccable

Skill

adapt

功能与用途

  • Assess source and target contexts (device type, input method, screen size, connection speed, usage patterns) to identify what won't fit or work across platforms

  • Apply context-specific strategies: single-column layouts and touch targets for mobile, two-column hybrid layouts for tablet, multi-column and hover states for desktop, narrow widths and inline CSS for email

  • Use responsive techniques including CSS Grid/Flexbox, media queries, container queries, and clamp() for fluid sizing; increase touch targets to 44x44px minimum and remove hover dependencies on touch devices

  • Test on real devices across orientations, browsers, and input methods rather than relying solely on browser emulation

设计与 UI分类下的其他 Skills