ts-shadcn-ui

Installation
SKILL.md

When to Use This Skill

Use when you need to:

  • Set up shadcn/ui in a new or existing project (components.json, CLI, base color)
  • Add or customize a component (Button, Dialog, Select, ...) and need to know it's copied source, not a black-box dependency
  • Decide between Base UI (default) and Radix as the primitive layer
  • Build a variant system (size, variant, state) with cva the way shadcn/ui does
  • Wire up light/dark mode via CSS variable tokens instead of hardcoded Tailwind colors

Trigger keywords: shadcn/ui, shadcn add, components.json, Base UI, Radix UI, cn() utility, class-variance-authority, cva, Tailwind theming, CSS variables, --background, --primary, dark mode, headless components, copy-paste components, golden ratio, type scale, text overflow, text truncation, text hell, line length, i18n text expansion, translated string overflow.

Installs
5
GitHub Stars
1
First Seen
Aug 10, 2026
ts-shadcn-ui — ronjunevaldoz/ts-agent-skills