Skip to content

Identidade visual

victor-kauan-coder edited this page Sep 28, 2026 · 2 revisions

Identidade visual

Hi-fi analógico. Grafite quente, como o alumínio anodizado de um aparelho de som, e um único laranja-sinal reservado para o que é ação ou estado ativo. A capa do álbum é a protagonista; a letra é legenda de cinema.

A referência completa, com todos os tokens, está no DESIGN.md do repositório.

O logo

Ícone do SongV

Um V em fita laranja que também é uma nota: o braço esquerdo, largo, dobra no vértice e sobe como a haste de uma colcheia, terminando na bandeirola curva. Três barras de som à esquerda dão o ritmo, e a dobra da fita tem uma sombra vermelho-escura que dá volume. O nome vem com "Song" em branco-gelo (azul-marinho em fundo claro) e o V no mesmo laranja em degradê.

SongV — versão horizontal

Cor
🟧 #F26B38 laranja principal
🟧 #FF8A3D laranja secundário
⬛ #121826 azul-marinho (fundo do ícone)
⬜ #F7F4EE off-white

Os arquivos do app são recortados direto da arte original (identidade.png) — mesmas formas, sombras e cores. Com outra cor de destaque, a marca dentro do app acompanha a cor escolhida mantendo as sombras.


Cores do app

Cor Uso
🟧 #FF6B1A laranja-sinal botão de play, faixa tocando, "LEDs", seleção
⬛ #1C130E tinta texto e ícones sobre o laranja
⬛ #141211 grafite fundo do tema escuro
⬜ #F4F1EE papel fundo do tema claro (cinza quente, não creme)
⬛ #110E0D palco fundo do player, sempre escuro
  • Contraste calculado: qualquer cor de destaque — inclusive a do seletor livre — é clareada ou escurecida até ter 4,5:1 com o fundo. Por isso o laranja fica mais escuro nos textos do tema claro.
  • O player é um palco: sempre escuro, tingido pela capa e escurecido até o texto branco ter contraste.

Tipografia

Archivo (SIL OFL 1.1) em três larguras:

Largura Onde
Expandida Black marca "SongV", números do ranking
Normal toda a interface
Condensada Bold linhas da letra — cabem mais palavras por linha

Tempos usam algarismos tabulares para não "dançarem".

Detalhes de assinatura

  • LED de modo — um ponto laranja sob o ícone quando aleatório/repetir estão ligados.
  • Painel rotulado no player — Letra · Fila · Timer · Equalizador como teclas de aparelho.
  • Letra-legenda — original, pronúncia e tradução empilhadas; pontos nas pausas instrumentais.
  • Capas geradas — faixas sem imagem ganham capa com cor, iniciais e sulcos de vinil.

Modo claro

Tema claro

Clone this wiki locally