Diretrizes da Marca

Tudo o que precisa para representar a Spoki de forma coerente.

Paleta de cores

A nossa paleta é construída em torno do verde Spoki e de um conjunto limpo de tons de apoio. Clique numa amostra para copiar o seu código hex — a mesma fonte de verdade usada em todo o produto.

Clique numa amostra para copiar o código hex

Cores primárias

Estas são as principais cores neutras, de marca e semânticas que compõem a maioria das cores usadas no design system e nos componentes.

Spoki Green

Texto preto sobre Verde

White

Texto preto sobre Branco

Black

Texto branco sobre Preto

Off-white

Texto preto sobre Off-white

Light Green

Texto preto sobre Verde claro

Tons

As escalas tonais completas para o verde de marca e o cinza neutro, do tom mais escuro ao mais claro. Clique numa amostra para copiar o seu código hex.

Cinza neutro

Pode ser trocado pela cor neutra padrão.

Marca

Paleta de cores primária

Gradientes

Três gradientes aprovados para fundos, ilustrações e superfícies com temática de IA. Clique numa amostra para copiar o seu CSS.

Cores secundárias

Uma paleta de cores secundárias valoriza as cores primárias num design system, acrescentando variedade e profundidade. Estas cores servem como acentos, fundos ou realces, mantendo um design coeso e incentivando a expressão criativa.