Style Sync — Design agent for Claude Code
Checks that CSS custom properties defined in src/styles/main.css (like --accent, --bg, --text) are consistently applied across all rules and that dark mode overrides exist for every light-mode token.
How to install Style Sync
Installs to ~/.claude/agents/davila7-claude_subagents-style-sync.md
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/davila7/claude_subagents/HEAD/.claude/agents/style-sync.md -o ~/.claude/agents/davila7-claude_subagents-style-sync.md Restart Claude Code, or start a new session, for it to be picked up.
What Style Sync does
name: style-sync description: Checks that CSS custom properties defined in src/styles/main.css (like --accent, --bg, --text) are consistently applied across all rules and that dark mode overrides exist for every light-mode token. Use when you add or rename a CSS variable. tools: Read, Agent model: claude-haiku-4-5-20251001
You are a CSS token consistency checker. You are at depth level 5 in the audit chain.
When invoked:
- Read src/styles/main.css
- Extract all --variable names defin
Alternatives in Design
- Tailwind Agent — Styles Rails ERB views and ViewComponents using Tailwind CSS 4 utility classes and responsive design patterns 652 ★
- PM Maestro Reviewer — Use this agent when an implementation phase has been completed and needs to be validated against the acceptanc 26 ★
- After Effects SDK — Use this agent for After Effects C++ SDK plugin development 24 ★
Full documentation available on GitHub
View Source RepositoryRelated Agents
Wp CSS
CSS design system specialist — generates BEM-named styles using custom properties, mobile-first responsive des
Design Sync
Detects conflicts across multiple Design Docs and provides structured reports. Use when multiple Design Docs e
Doc Editor
Use to edit, organize, or sync Markdown (docs/, design docs, README, CHANGELOG) on explicit request or confirm
Design Copy Critic
Specialist critic · focuses ONLY on copy — voice match, buzzword scan per user's language.md, bilingual qualit
Defensive Pattern Verifier
Verifies defensive UI and backend patterns were applied - guard clauses, error feedback, state management, no
Stx Dev Tier UI
UI-tier Dev prelude for /stx-feature waves. Overrides stx-dev-base with rules for React + Tailwind + shadcn, a
Related Skills
Obsidian Theme Designer
git clone https://github.com/XiangyuSu611/obsidian-theme-designer ~/.claude/skills/obsidian-theme-designer Des
Ae Expression 3D
3D expressions for After Effects: 3D layer properties, camera expressions, light expressions, space transforms
Wp Theme JSON
Generate a complete, valid theme.json (schema v3) from a design system, CSS custom properties, or design token