Consistency — Design skill for Claude Code
Design consistency check.
How to install Consistency
Installs to ~/.claude/skills/maibach-systems-maibach-tweaks-consistency/SKILL.md
mkdir -p ~/.claude/skills/maibach-systems-maibach-tweaks-consistency && curl -fsSL https://raw.githubusercontent.com/maibach-systems/maibach-tweaks/HEAD/commands/consistency.md -o ~/.claude/skills/maibach-systems-maibach-tweaks-consistency/SKILL.md Restart Claude Code, or start a new session, for it to be picked up.
What Consistency does
description: "Design consistency check. Scan all components for inconsistencies in colors, spacing, typography, buttons, animations. Web projects only."
/consistency
Scans all components and styles for design inconsistencies. Flags hardcoded values that bypass the design system, inconsistent component patterns, and deviations from the established visual language. Web projects only.
Prerequisites
Before scanning, locate:
- Design token file (constants.ts, tokens.ts, theme.ts, or
Alternatives in Design
- Brand Guidelines — Apply Anthropic's official brand colors and typography to artifacts 94.1k ★
- Pair — Fuse two extracted designs into a single hybrid identity 3.6k ★
- Design UI UX — Design UI/UX systems with style guides, palettes, typography, and component specs 2.8k ★
Full documentation available on GitHub
View Source RepositoryRelated Skills
Style Guide
Generate comprehensive design system documentation including colors, typography, spacing, components, and usag
App Auditor Plugin Claude
Claude plugin for auditing live web apps: capture screenshots, generate demo videos, document components, extr
Site Design
Extract a website's design system into DESIGN.md using Firecrawl (colors, fonts, spacing, components)
Extract Design Tokens
Extract design tokens - colors, type, spacing, shadows - from a URL, screenshot, or CSS into CSS variables and
Brand Context
Load and validate brand assets before any design work — logo, colors, typography, voice
Rogue Brand Guidelines Skill
Apply Rogue Development brand colors and typography to artifacts (docs, slides, landing pages, social creative
Related Agents
Figma Interpreter
Use this agent to analyze Figma designs and extract technical specifications for development. This agent parse
Design Extractor
Extracts precise design specifications from Paper/Figma/Stitch MCPs or local reference images; produces struct
Ds Tokens
Use ONLY to extract design tokens (colors, spacing, radius, typography) from the Figma file's LOCAL variable c