LogoClawIndex
CasesSkillsAbout
LogoClawIndex

tailwind-design-system - Build scalable Tailwind CSS design systems

Build design systems with Tailwind CSS using design tokens, component variants, responsive patterns, and accessibility practices.

Tags

Updated: 2026-10-04
Tailwind CSSdesign systemsdesign tokenscomponent librariesresponsive designaccessibilitydark mode

Capabilities

Define design token hierarchiesCreate component librariesImplement component variantsBuild responsive components

Typical Inputs

UI requirementsExisting codebaseTailwind configuration

Typical Outputs

Design tokensTailwind configurationReusable components

What this skill does

  • Define design token hierarchies
  • Create component libraries
  • Implement component variants
  • Build responsive components
  • Standardize UI patterns
  • Configure dark mode
  • Apply accessibility patterns

Inputs

  • UI requirements
  • Existing codebase
  • Tailwind configuration
  • Component specifications

Outputs

  • Design tokens
  • Tailwind configuration
  • Reusable components
  • Responsive UI patterns
  • Accessible form components
  • Standardized UI patterns

Requirements

  • Tailwind CSS

Source

  • Spec: SKILL.md

ClawIndex

OpenClaw Skills & Use Case Index

ClawIndex is an ecosystem-driven index of OpenClaw skills and real-world use cases.

Index

Skills·
Cases

Meta

About·
Disclaimer·
Email·
GitHub
© 2026 ClawIndex All Rights Reserved.