Oklch Skill

O que ela faz

Ensina o Claude a trabalhar com OKLCH, um jeito de escrever cor no CSS em que os números batem com o que o olho vê: a mesma luminosidade parece igualmente clara em qualquer tom. Ele converte hex, rgb e hsl pra oklch() e aponta o que mudou.

Gera escalas de 50 a 950, no padrão do Tailwind, mantendo o mesmo tom do claro ao escuro, e monta paletas de várias cores com a mesma intensidade. Pro modo escuro, deriva as cores da paleta clara em vez de escolher na mão.

Checa contraste pelas regras APCA e WCAG e corrige mexendo só na luminosidade. Cuida da cor que monitor comum não mostra, com versão de reserva pra quem não tem tela P3, e escreve o tema no @theme do Tailwind v4. Toda mudança sai numa tabela de antes e depois.

Nas palavras de quem fez

Quando usar

• Montar a paleta de cores de um site ou app do zero
• Texto de botão que some em cima da cor da marca
• Passar um site pro Tailwind v4 com as cores certas
• Criar o modo escuro a partir das cores claras
• Corrigir paleta em que o azul vira roxo nos tons escuros

Depois de instalar, é só pedir assim

• Gera uma paleta de 50 a 950 a partir da cor da minha marca, #2F6BFF, já no formato do Tailwind v4
• Revisa as cores deste CSS, converte tudo pra oklch e me mostra numa tabela de antes e depois
• O texto branco nesse botão laranja passa no contraste? Se não passar, ajusta

Segurança

Gen Agent Trust Hub, Socket e Snyk leem o código da skill atrás de comando perigoso, dado vazando e instrução escondida. Alerta não é reprovação: quer dizer que vale ler o que a skill faz antes de instalar.

• Gen Agent Trust HubPassou
• SocketPassou
• SnykPassou

Perguntas