SkillHey.
Skill einreichen

Tailwind Theme Builder

jezweb/claude-skills

Set up Tailwind v4 + shadcn/ui themed UI with dark mode. Install deps, configure CSS variables via @theme inline, wire dark mode toggle, verify. Use whenever the user mentions Tailwind v4, setting up Tailwind theming, shadcn/ui colours, dark mode, or troubleshooting colours not working, tw-animate-css errors, @theme inline conflicts, @apply breaking after upgrade, or v3 → v4 migration issues.

Inhalt aktualisiert:

Teil vonTanStack Start ↗
Auf GitHub ansehen
npx skills add jezweb/claude-skills --skill tailwind-theme-builder
1.114Sterne110ForksLetzter Repository-Push

Über diesen Skill

Set up Tailwind v4 + shadcn/ui themed UI with dark mode. Install deps, configure CSS variables via @theme inline, wire dark mode toggle, verify. Use whenever the user mentions Tailwind v4, setting up Tailwind theming, shadcn/ui colours, dark mode, or troubleshooting colours not working, tw-animate-css errors, @theme inline conflicts, @apply breaking after upgrade, or v3 → v4 migration issues.

Warum wir es empfehlen

Summarized from the original jezweb/claude-skills SKILL.md by Jezweb; the original upstream instructions were used.

Wobei es hilft

  • Use this workflow when the task matches the original Tailwind Theme Builder instructions.

Vor der Nutzung

  • Read the original SKILL.md and referenced files in jezweb/claude-skills.

Quellen und Referenzen

Die Originalquellen sind unten verlinkt. Praktische Einstiegsideen sind redaktionelle Vorschläge von SkillHey.

Redaktion: SkillHey
tailwinddesign systems

Ähnliche Skills

Component Family Consistency

Dembrandt

Buttons, inputs, badges and pills share radius, colour logic, shadow, border and spacing. Use when building or reviewing a component library.

  • design systems
  • ui design
193Sterne23Forks
Letzter Repository-Push

Extract Design System from Frontend Code

Google Stitch

Extract a comprehensive design system (DESIGN.md) directly from frontend source code — React, Vue, Svelte, Angular, plain HTML/CSS, or any web framework. Analyzes component files, stylesheets, Tailwind configs, theme definitions, and design tokens to produce a rich, Stitch-compatible design system document. Use this skill whenever the user wants to reverse-engineer a design system from an existing codebase, audit the visual language of a project, extract design tokens from source files, or understand the styling patterns in a frontend repo — even if they just say "what does this app look like?" or "pull out the design from this code."

  • design systems
  • documentation
8963Sterne1069Forks
Letzter Repository-Push

Create DESIGN.md

Julien Thibeaut

Create an evidence-based DESIGN.md from a product repository or a rendered public website.

  • design systems
  • documentation
11.066Sterne529Forks
Letzter Repository-Push

Extract Design System

Arvind Ram Singh Kishore

Extract a public website’s colors, typography and other design primitives into starter JSON and CSS tokens.

  • design systems
  • design tokens
287Sterne31Forks
Letzter Repository-Push