01 / Projeto profissional
NEO — CERTI × Lenovo
Em desenvolvimento Next.js · React · TypeScript · NestJS · TypeORM · PostgreSQL · Cake UI · Docker
Ferigolo / identidade visual v1.0
Uma marca.
Muitas camadas.
O sistema visual que conecta engenharia, expressão e clareza. Uma referência viva para a marca Ferigolo.
01 /Marca & direção
Editorial experimental.
Tipografia como protagonista. Papel, tinta e um ponto de laranja. Composição expressiva, linhas finas e informação organizada em camadas. Preserve espaço ao redor da marca; não distorça, contorne ou aplique efeitos ao arquivo original.
02 /Cores
Clique para copiar. O laranja vivo orienta o olhar; a versão escura mantém a leitura em textos pequenos.
Selecione uma cor para copiar o código.
03 /Tipografia
Software com
profundidade.
Inter Variable · 100–900 · fonte hospedada localmente. Títulos expressivos, corpo confortável e metadados discretos.
| Uso | Tamanho | Peso |
|---|---|---|
| Hero | 48–112 px, fluido | 800 |
| Título de projeto | 30–68 px, fluido | 750 |
| Seção | 32–56 px | 650 |
| Corpo | 18–24 px | 400 |
| Metadados | 14–16 px | 500 |
04 /Componentes & estados
Botão primário, link com seta e estado desabilitado. Passe o cursor e navegue com Tab para conferir os estados. Links externos abrem em uma nova aba.
05 /Espaço, interação & voz
Espaço com intenção.
Escala de 4, 8, 12, 16, 24, 32, 48, 64, 96 e 128 px. Grade de duas colunas no desktop; uma coluna nos cases em telas menores. Superfícies planas e bordas de 1 px.
Movimento discreto.
160 ms em controles, 280 ms no menu, 340 ms entre páginas e 620 ms nas entradas por rolagem. Nos diagramas, os nós entram em sequência com intervalo de 45 ms. Movimento reduzido elimina essas animações; o foco de teclado interrompe a entrada do bloco.
O cursor combina um ponto de tinta e uma moldura quadrada laranja. Links expandem a moldura; cliques a comprimem. Toque, campos de texto e movimento reduzido mantêm o cursor nativo.
Clareza com personalidade.
Fale de contribuição, decisões e evidências. Frases diretas. Sem promessas vagas ou números sem comprovação. A tipografia carrega a expressão; o conteúdo carrega a confiança.