Seu espaçoClaro
Ideias em andamento
Guarde o que vale construir.
Pronto para começar.
Uma base para
o que vem.
A identidade rnqs.app, em uma escala que cabe na interface.
Cor
Um amarelo mais claro, o mesmo fundo profundo. O contraste define o papel de cada tom.
Amarelo manteiga
#f1d992Azul quase preto
#0b0e13Evolução do dourado #e3c994 da página inicial.
Tipo
Duas famílias, pesos diferentes. A personalidade fica nos títulos; a interface ganha espaço.
Bricolage Grotesque 800
Marca e títulos de destaque.
Geist 400–600Leitura, navegação e controles.
Mono do sistema para código e valores.
Textura
A textura ocupa toda a largura da seção, além do padding. O centro da luz acompanha o conteúdo. Ao sair da área útil, a textura já começa a se dissolver.
Para pessoas.
E para agentes.
Uma referência pequena, pronta para acompanhar o próximo projeto.
A mesma base.
Dois modos.
O amarelo continua no botão. O texto de destaque muda com o fundo. Alterne o tema no topo para experimentar a página inteira.
Rascunho v0.1 · exemplos de interface
Seu espaçoEscuro
Ideias em andamento
Guarde o que vale construir.
Pronto para começar.
Cor com função.
O accent identifica a marca. Verde, vermelho e azul comunicam estados, sempre acompanhados de texto.
✓ Salvo! Falha ao salvari Informação
Texto sobre amareloEscuro nos dois temas
12,51:1Destaque no claro#715317 sobre #f8f7f3
6,64:1Destaque no escuro#f1d992 sobre #0b0e13
13,88:1Razões WCAG calculadas para estes pares sólidos. Meta de 4,5:1 para texto comum e 3:1 para contornos essenciais. Reavalie ao mudar o fundo.
Pequeno por escolha.
Comece pela identidade e por poucos padrões. Extraia componentes compartilhados quando o uso real se repetir.
EspaçoBase de 4 px
4 · 8 · 12 · 16 · 24 · 32 · 48 · 64FormaCantos discretos
8 px / 16 pxMovimentoFeedback curto
160 ms / 0 ms com reduçãoTexturaLocal e decorativa
0–20% em interfacesDe onde partimos.
Referências para evoluir essa base sem montar uma infraestrutura maior que os projetos.