Tab — Tab UI Component Reference#

Quick-reference skill for tab component design, accessibility patterns, and implementation.

When to Use#

• Implementing tabbed content panels in web applications
• Designing tab navigation for sections of related content
• Making tabs accessible with proper ARIA roles and keyboard support
• Choosing between tabs, accordions, and other navigation patterns
• Building responsive tab components that work on mobile

Commands#

intro#

bash

scripts/script.sh intro

Tab component overview — when to use tabs, types, alternatives.

anatomy#

bash

scripts/script.sh anatomy

Tab anatomy — tab list, tab buttons, tab panels, indicators, badges.

patterns#

bash

scripts/script.sh patterns

Design patterns — horizontal, vertical, scrollable, closeable, draggable tabs.

accessibility#

bash

scripts/script.sh accessibility

Accessibility — ARIA roles, keyboard navigation, focus management, screen readers.

state#

bash

scripts/script.sh state

State management — controlled vs uncontrolled, lazy loading, URL sync, persistence.

responsive#

bash

scripts/script.sh responsive

Responsive strategies — scrollable tabs, dropdown conversion, priority tabs, swipe.

css#

bash

scripts/script.sh css

CSS implementation — indicator animations, theming, variants, transitions.

checklist#

bash

scripts/script.sh checklist

Tab component design and implementation checklist.

help#

bash

scripts/script.sh help

version#

bash

scripts/script.sh version

---

Powered by BytesAgain | bytesagain.com | hello@bytesagain.com