Skills
.Work. You
Rest

chakra-design-system

Official

Build consistent UI with Chakra tokens and repo rules.

Software Engineering#accessibility#frontend#components#chakra#tokens#design-system#semantic-tokens
AuthorStacked-Labs
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill standardizes UI development in the project by enforcing Chakra UI usage, semantic tokens, and consistent design patterns to reduce visual drift and duplication.

Core Features & Use Cases

  • Token-driven theming: Use semanticTokens and brand colors from app/theme.ts to ensure consistent visuals.
  • Pattern-driven components: Follow repo patterns for layout, spacing, accessibility, and responsive behavior.
  • Documentation guidance: Refer to references/theme-and-tokens.md and references/component-patterns.md for ongoing guidance.

Quick Start

Create a Chakra UI component that follows the repo's design system tokens and patterns.

Dependency Matrix

Required Modules

None required

Components

referencesassets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: chakra-design-system
Download link: https://github.com/Stacked-Labs/poker-game/archive/main.zip#chakra-design-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.