Frontend & UI
redesign-existing-projects
Audita um site existente e o atualiza sem quebrar funcionalidade.
O que é
Um fluxo de varredura, diagnóstico e correção para projetos existentes. Audita tipografia, cor, layout, estados, conteúdo, ícones e qualidade de código, e depois aplica melhorias pontuais dentro da stack atual.
Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla
Por que isso importa para design
- Gradientes roxo-azul de IA e três fileiras iguais de cards são trocados por alternativas mais pensadas.
- Botões em grupos de cards se alinham numa única linha inferior, mesmo com conteúdo variado.
- Estados ausentes de hover, foco, carregamento, vazio e erro são preenchidos.
O que cobre
- How this works
- Design audit
- Upgrade techniques
- Fix priority
- Rules
Como instalar
redesign-existing-projects
-
Clone o repositório.
git clone https://github.com/Leonxlnx/taste-skill -
Aponte o Codex para o arquivo da skill.
skills/redesign-skill/SKILL.md -
Depois descreva a UI que você quer. O Codex segue a skill.
Como rodar com o Codex
-
Primeiro ela varre o código para identificar o framework e o método de estilização.
-
Lista todo padrão genérico e ponto fraco antes de mudar qualquer coisa.
-
As correções entram em ordem de prioridade: fontes, cor, estados, layout, componentes, acabamento tipográfico.
Todo plugin aqui é gratuito, open source e leva até a sua fonte original.
Mais na lista codex-design ↗Mais plugins de design para o Codex
Frontend & UI O que ele faz gpt-taste Cria landing pages estilo premiado com movimento de scroll em GSAP e grids bento sem falhas. 
Design Systems O que ele faz Stitch Design Taste Escreve um DESIGN.md que guia o Google Stitch para telas que fogem do genérico. 
Frontend & UI O que ele faz image-to-code Gera imagens de design primeiro, analisa cada uma e só depois constrói o código de frontend correspondente. 
Frontend & UI O que ele faz imagegen-frontend-mobile Gera fluxos de telas de app mobile em nível premium, como imagens, não como código. Próximo passo
Projete com o Open Design, sem a configuração
Instale este plugin por conta própria ou rode uma camada de design curada em volta do Codex com o Open Design. Use sua própria chave e seja dono do resultado.