mobile

Render responsive mobile tables and UI components with CSS breakpoints.

1|Updated Dec 30, 2025

Search Tags:#CSS #responsive #UI components #design-system #mobile UI #table patterns

Ready to run

npx skills add https://github.com/minhcopilot/antigravity --skill mobile

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: mobile
Source: https://github.com/minhcopilot/antigravity/tree/main/skills/mobile
Command: npx skills add https://github.com/minhcopilot/antigravity --skill mobile

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams design responsive mobile interfaces that present data in tables clearly on small screens, reducing horizontal scrolling and readability issues.

Core Features & Use Cases

Responsive table patterns for mobile screens: collapsible rows, horizontal-to-vertical data presentation.
Standard UI component styling guidance: consistent typography, spacing, and interactions across devices.
Use Case: Turn a large on-device data table into a compact mobile-friendly view without losing data fidelity.

Quick Start

Use the mobile skill to adapt a dataset to a responsive mobile table, or reference the patterns in docs/solutions/patterns/individual/pattern-18-mobile-table-responsiveness.md

Frequently Asked Questions about mobile

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

FAQPage Schema

How do I make responsive tables for mobile screens without horizontal scrolling?▼

You can create responsive tables for mobile screens by applying mobile-first CSS breakpoints and using collapsible rows to shift horizontal data into a vertical presentation. This pattern reduces scrolling and keeps data legible on small screens.

What are the best UI component patterns for displaying data lists on small screens?▼

The best UI component patterns for small screens include compact cards, lists, and collapsible table rows. These patterns apply consistent typography and spacing to keep data legible without losing fidelity.

Can I use standard CSS breakpoints to adapt large data tables for mobile devices?▼

Yes, you can use mobile-first CSS breakpoints to adapt large data tables for mobile devices. This approach relies on standard UI component patterns to render responsive layouts, ensuring data remains legible on small screens.

How do I convert horizontal table data into a vertical layout for mobile UIs?▼

To convert horizontal table data into a vertical layout for mobile UIs, apply horizontal-to-vertical data presentation patterns. This technique uses collapsible rows to restructure wide datasets into a compact, readable mobile-friendly view.

Does this mobile UI skill require external dependencies to render responsive components?▼

No, this mobile UI skill requires no external dependencies to render responsive components. It relies solely on mobile-first CSS breakpoints and standard UI component patterns defined internally to guide the implementation.