thkt/tailwind-patterns
skills/tailwind-patterns/SKILL.md
Tailwind CSS v4 design decisions. Use when: Tailwind, utility-first, container query, design tokens, dark mode strategy.
$ install --global
skillsauthnpx skillsauth add thkt/dotclaude tailwind-patternsInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 20, 2026, 9:28 AM4.7s2 files scanned
SKILL.md
- name:
- tailwind-patterns
- description:
- >
- Tailwind CSS v4 design decisions. Use when:
- Tailwind, utility-first,
- allowed-tools:
- [Read, Grep, Glob]
- user-invocable:
- false
Tailwind Patterns
Design-level decisions that linters cannot catch.
Topic Index
| Topic | Key Point |
| -------------------- | -------------------------------------------------------------- |
| Container Query | Reusable component → @container, page layout → viewport |
| Color Token | Primitive + Semantic minimum. Arbitrary values = missing token |
| Dark Mode | v4: @custom-variant in CSS, no darkMode config key |
| Layout Selection | flex (1-axis), grid (2D), grid+spans (Bento) |
| Component Extraction | Same class combo 3+ times → extract. No @apply in v4 |
| Anti-Patterns | No dynamic class strings, no !important, no arbitrary values |
| v4 CSS-First Config | @theme in CSS replaces tailwind.config.js |
→ Details: Container Query, Color Token, Dark Mode, Layout, Component Extraction, Anti-Patterns, v4 Config
Related Skills
thkt/use-cli-herdr
tools
VerifiedTrustedCommunity
Delegate implementation to codex (coder) via the herdr-agentchat plugin and drive a two-pane conversation to completion.
11SKILL.mdUpdated Jul 27, 2026
thkt/scribe
development
VerifiedTrustedCommunity
Extract recurring patterns from past closed PRs/issues and the research findings in workspace/research/, verify them against the latest code, and propose them to docs/wiki/ via PR.
11SKILL.mdUpdated Jul 20, 2026
thkt/dr
development
VerifiedTrustedCommunity
Create Decision Records (DR) in MADR v4 format with auto-numbering.
11SKILL.mdUpdated Jul 15, 2026
thkt/shake
development
VerifiedTrustedCommunity
Detect flaky tests by shaking them — repeated runs under varied order, parallelism, and seed — plus a static smell scan that flags latent flakiness in tests that currently pass. Classify each target as confirmed-flaky, latent-flaky, or stable and fix the root cause without weakening the test. Do NOT use to fix a confirmed single bug (use /fix) or for static-only code review (use /audit).
11SKILL.mdUpdated Jul 13, 2026