casa hacker
design system
Sistema de design da Casa Hacker · forkado do IBM Carbon e reskinned com nossa identidade visual. Princípios, tokens, componentes, submarcas e diretrizes para materiais impressos.
// missãoFazer das tecnologias e a inovação social um lugar para todos.
foundations
paleta + tokens semânticos
11 cores brand mapeadas para tokens Carbon. Light + dark theme, com a cor PURPLE do PerifaImpacto.
explorar colorplex mono · roboto flex · vt323
Três famílias self-hosted. Roboto Flex com 13 eixos variáveis e playground interativo.
explorar typographyescala 01-13 baseada em bits
O BIT (8px) é a unidade base. Toda a escala de spacing são múltiplos ou frações dele.
explorar spacingcomponents
5 variantes · 4 tamanhos
Primary, secondary, tertiary, ghost, danger. Hover, focus, disabled, loading e contraste AA garantido.
explorar buttonbiblioteca completa
Tag, Tile, Form, Notification, Tabs, Modal, Data Table, Dropdown — todos os componentes do sistema.
ver overviewbit modular system
O DNA visual: como o BIT primitivo gera símbolos, padrões, enquadramentos e identidades de submarcas.
explorar bitbrand
família de marcas
Hackerclubes, Inclusão Tech, Internet Segura, Minas em Tech, Mão na Massa, PerifaImpacto — cada uma com identidade própria.
ver todaspapelaria · eventos · loja
Diretrizes para materiais físicos: cartões, sinalização de eventos, brindes, t-shirts e merchandise.
explorar impressosbiblioteca de padrões
Patterns geométricos derivados do BIT: tessellations isométricas, padrões pixel, ornamentos modulares.
ver bibliotecausar em um projeto
Importe o CSS base, use os tokens via CSS custom properties, e componha com as classes utilitárias.