react-native-styling
Use when styling React Native components with StyleSheet, Flexbox layout, responsive design, and theming. Covers platform-specific styling and design systems.
175 repo starsObserved in 3 repos
Design
Design skills
Browse reusable Agent Skills, each with a clear purpose and practical guidance.
atomic-design-atoms
Use when creating atomic-level UI components like buttons, inputs, labels, and icons. The smallest building blocks of a design system.
175 repo starsObserved in 2 repos
Design
atomic-design-molecules
Use when composing atoms into molecule components like form fields, search bars, and card headers. Molecules are functional groups of atoms.
175 repo starsObserved in 2 repos
Design
atomic-design-organisms
Use when building complex organisms from molecules and atoms like headers, footers, product cards, and sidebars. Organisms are distinct UI sections.
175 repo starsObserved in 2 repos
Design
atomic-design-quarks
Use when working with design tokens, CSS custom properties, and primitive values that form the foundation below atoms. Quarks are the sub-atomic building blocks.
175 repo starsObserved in 2 repos
Design
figma-extract-tokens
Extract design tokens and variables from a Figma file to create or update a design system
175 repo starsObserved in 2 repos
Design
gluestack-accessibility
Use when ensuring accessible gluestack-ui implementations. Covers WAI-ARIA patterns, screen reader support, keyboard navigation, focus management, and WCAG 2.1 AA compliance.
175 repo starsObserved in 2 repos
Design
gluestack-theming
Use when customizing gluestack-ui themes and design tokens. Covers theme provider setup, design tokens, dark mode, NativeWind integration, and extending themes.
175 repo starsObserved in 2 repos
Design
ui-first-principles
First-principles UI/IA reasoning: turns a `<scenario>` + API field set into JTBD analysis, principle-anchored field-priority decisions, anti-pattern findings, and a bidirectional UI↔API gap report. Trigger: UI、UX、資訊架構、IA、scenario-driven UI、欄位優先級、information hierarchy. Not for: visual/CSS work (use `/frontend-design`), post-build critique (use `/critique`), or simplifying existing layouts (use `/distill`).
175 repo starsObserved in 2 repos
Design
codex-architect
Codex architecture consulting. Use when: designing features, evaluating architecture, getting second opinion on design. Not for: implementation (use codex-implement), code review (use codex-code-review). Output: architecture advice + design recommendations.
175 repo starsObserved in 1 repos
Design