Botões
Os botões do situationnormal.co
O botão principal do situationnormal.co é #a3a3a34d com texto #0000ee, cantos de 9999px e 42px de altura. Abaixo: cada variante de botão que o site usa, seus estados de hover e foco, e o CSS para deixar os seus iguais.
Medido no situationnormal.co há 4 dias.
Botão secondary
- Hover
- background #a3a3a34d → #e3e3e3, transforms
- Transição
- all, 0s
O CSS
Uma classe por variante, com os valores medidos. A fonte é a que o situationnormal.co define nos botões.
.btn-secondary {
display: inline-flex;
align-items: center;
justify-content: center;
height: 42px;
padding: 10px 10px;
background: #a3a3a34d;
color: #0000ee;
border: none;
border-radius: 9999px;
font-size: 12px;
font-weight: 400;
font-family: "EB Garamond", sans-serif;
cursor: pointer;
}Para agentes de IA
O pacote é texto puro, sem chave: busque o DESIGN.md ou entregue o pacote inteiro ao Claude Code, Cursor ou Copilot pelo servidor MCP.
curl -s https://stylepack.ai/packs/situationnormal.co/DESIGN.mdPerguntas
Como fazer botões iguais aos do situationnormal.co?
Use o CSS desta página: o botão principal é #a3a3a34d com texto #0000ee, cantos de 9999px, 42px de altura. Adicione as regras de hover e foco listadas em cada variante e defina a fonte do botão como a que o situationnormal.co usa.
De que cor são os botões do situationnormal.co?
O botão principal do situationnormal.co é #a3a3a34d com texto #0000ee. O site usa 1 variantes de botão no total; cada uma está listada nesta página com fundo, borda, raio e tamanho.
Um agente de código com IA consegue copiar os botões do situationnormal.co?
Sim. O pacote de design do situationnormal.co no Stylepack traz cada variante de botão com seus estados, as fontes, as cores e capturas de tela, para que Claude Code, Cursor ou Copilot construam botões iguais.