Communitygithub.com

gbechtold/Hi-Fidelity-Design

Habilidade Claude Code para auditorias de alta fidelidade entre design e implementação (deltas numéricos por elemento, não pixel-diff). Núcleo invariante + adaptadores intercambiáveis (IDML/Figma/PDF/PNG ↔ DOM).

O que é Hi-Fidelity-Design?

Esta habilidade para Claude Code realiza auditorias de alta fidelidade entre design e implementação, fornecendo deltas numéricos por elemento — em vez de comparações baseadas em pixel-diff. Ela utiliza um núcleo invariante que define a lógica central de comparação, suportando adaptadores intercambiáveis para diferentes formatos de design, como IDML, Figma, PDF e PNG, mapeando-os para o DOM. É útil para desenvolvedores que precisam verificar se a implementação corresponde fielmente ao design aprovado, com métricas precisas para cada componente. A habilidade é projetada para ambientes de CI/CD e uso local com Claude Code, oferecendo relatórios detalhados que facilitam a identificação de discrepâncias entre design e código.

Funciona com✓Claude Code~Codex CLI~Cursor
npx skills add gbechtold/Hi-Fidelity-Design

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que Hi-Fidelity-Design faz?

Habilidade Claude Code: auditorias de alta fidelidade entre design e implementação (deltas numéricos por elemento, não pixel-diff). Núcleo invariante + adaptadores intercambiáveis (IDML/Figma/PDF/PNG ↔ DOM).

Habilidades Relacionadas