Ícones
Os ícones da Spaceship traduzem ações e ideias complexas em símbolos instantaneamente reconhecíveis, ajudando-te a navegar e interagir com facilidade.
Universais mas distintas, as nossas ícones são os menores blocos de construção da marca, desenhadas para serem reconhecidas instantaneamente enquanto mantêm claramente a identidade Spaceship.
Versões
Todos os ícones Spaceship estão disponíveis em duas versões: contorno (primário) e preenchido (secundário).
Construção
Os ícones são desenhados de acordo com regras definidas — desde a grelha base até aos parâmetros do traço — garantindo resultados consistentes e equilibrados.
Tamanho
Escaláveis por design, os ícones devem ser usados em cinco tamanhos para preservar a clareza e a harmonia visual em todo o sistema.
Cores
A cor é um elemento essencial que ajuda os utilizadores a identificar os seus produtos mais facilmente numa determinada interface. Para garantir consistência nestes contextos de interface, os ícones usam as cores do Spaceship Design System.
Cores da marca
Sendo as cores principais da Spaceship, estas devem ser a escolha prioritária para ícones — seja em contextos funcionais como a interface da plataforma ou em utilizações mais ilustrativas, como a representação de funcionalidades nas páginas de produto. Consulta a página de cores para mais detalhes.
Cores do produto
As cores principais de um produto devem ser aplicadas aos respetivos ícones. Isto é fundamental para o reconhecimento e notoriedade do produto em todo o ecossistema Spaceship.
Cores de notificação
Utiliza as cores de notificação para reforçar mensagens de alerta. Devem ser aplicadas apenas aos ícones de alerta, com exceções ocasionais em que outro ícone também representa estados de sucesso, erro ou aviso.
Orientações
Aqui tens alguns exemplos do que deves evitar ao usar ícones.
Não deformes, rodes ou inverta os ícones. Redimensiona sempre proporcionalmente.
Não utilizes ícones maiores que 40x40px. Procura o equilíbrio entre os elementos.
Não utilizes tons nem sombras.