'/%3e%3crect%20x='13.1'%20y='10'%20width='5.8'%20height='5.8'%20rx='1.2'%20transform='rotate(45%2016%2012.9)'%20fill='url(%23synqela-symbol-g)'/%3e%3cpath%20d='M%2022.15%2015.2%20V%2026.85%20H%2018.55%20V%2028.65%20H%2022.15%20V%2032%20H%2023.95%20V%2028.65%20H%2027.55%20V%2026.85%20H%2023.95%20V%2015.2%20H%2022.15%20Z'%20fill='url(%23synqela-symbol-g)'/%3e%3c/svg%3e)
SYNQELA / Administração / Design system
Design system
Referência viva dos tokens, da tipografia e dos estados de tela reutilizados por todos os módulos.
Paleta de marca
Todas as cores são tokens semânticos definidos em src/styles.css. Componentes nunca usam valores crus.
Night
#080A0F
Carbon
#111620
Slate
#18212E
Synqela Violet
#6C5CFF
Information Blue
#3978FF
Signal Cyan
#19C6FF
Growth Mint
#20D9A0
Warning
#F5B84B
Critical
#FF5B72
Intelligence gradient · #6C5CFF → #3978FF → #19C6FF
Tipografia
Sora para display, Inter para interface e IBM Plex Mono para identificadores técnicos e números selecionados.
Toda a operação. Uma inteligência.
Inter conduz todo o texto de interface: rótulos, descrições, tabelas densas e formulários do command center.
opp_2f91c4 · MRR R$ 184.320,00 · conv. 4,7%
Superfícies e controles
Profundidade sutil, vidro contido e microinterações discretas. Nenhum controle aparenta ação sem ter ação.
Estados obrigatórios de tela
Todo módulo cobre carregamento, vazio, erro, sucesso, permissão negada e falha parcial de integração.
Nenhuma oportunidade neste estágio
Não foi possível carregar o pipeline
Proposta enviada
Acesso não permitido
WhatsApp desconectado