skills.rest
bughq
bughqOFFICIAL
Explore all skills by this author →
GitHub

stacks-ui

Develop reactive accessible Stacks UI components with Crosswind CSS.

2|Updated Jul 8, 2026
Search Tags:#ui#accessibility#components#reactivity#stacksjs#crosswind
One-click install
npx skills add https://github.com/bughq/bughq --skill stacks-ui-bughq
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: stacks-ui
Source: https://github.com/bughq/bughq/tree/main/.claude/skills/stacks-ui
Command: npx skills add https://github.com/bughq/bughq --skill stacks-ui-bughq

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the complexity of building consistent, accessible, and reactive user interfaces within the Stacks ecosystem, reducing the friction between design and implementation.

Core Features & Use Cases

  • Component Library: Provides a suite of headless and Craft native components for rapid UI development.
  • Reactivity & State: Offers a custom reactive system with refs, computed properties, and lifecycle hooks.
  • Styling & Accessibility: Integrates Crosswind CSS for utility-first styling and built-in accessibility scanning and auto-fixing.
  • Use Case: Use this skill to build a complex, accessible modal or a reactive dashboard component that requires custom state management and specific styling constraints.

Quick Start

Use the stacks-ui skill to generate a new accessible modal component using the Craft native dialog implementation.

Frequently Asked Questions about stacks-ui

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

FAQPage Schema
How do I build accessible UI components in a Stacks application?▼

To build accessible UI components in a Stacks application, use the stacks-ui skill to leverage built-in accessibility scanning, auto-fixing, and headless component libraries for consistent interfaces.

What is the best way to manage state reactivity for Stacks user interfaces?▼

State reactivity for Stacks user interfaces is managed through a custom reactive system offering refs, computed properties, and lifecycle hooks to handle component state changes dynamically.

How does Crosswind CSS integrate with Stacks for utility-first styling?▼

Crosswind CSS integrates with Stacks to generate utility-first styles, automatically applying specific styling constraints to reactive components within the ecosystem.

Can I use STX templating engine standards for complex modal components?▼

Yes, you can use STX templating engine standards to build complex, accessible modal components by adhering to the Stacks component architecture and Craft native dialog implementations.

Do I need specific component architecture knowledge to build reactive dashboards?▼

Building reactive dashboards requires adherence to the Stacks component architecture and STX templating standards to properly utilize the custom state management and lifecycle hooks.

Related Skills

Explore More Software Engineering Skills→
bughqbughq
2

stacks-stx

Create STX components with reactive state and SSR configuration in Stacks applications.

Official
Advanced
bughqbughq
2

stacks-design-taste

Enforce Stacks UI, Crosswind, and CSS design standards for interfaces.

Official
Advanced
KurrawongKurrawong
1

reka-ui

Provide headless Vue 3 component primitives with WAI-ARIA compliance.

Official
Advanced
TNHoang2708TNHoang2708
1

ck:ui-styling

Integrate shadcn/ui components and Tailwind CSS for accessible responsive interfaces.

Community
Advanced