// marca
Três barras, uma cor e nenhum enfeite.
A marca da flye.win nasceu do terminal: contraste alto, cantos retos e um único acento. Aqui estão os arquivos e as regras para usá-la direito.
01
Logos
Arquivos SVG com o texto convertido em curvas, então funcionam sem a fonte instalada. Use a versão principal sempre que o fundo permitir.
símbolo
mascote
O pato
O colega de trabalho da flye.win: ouve todos os bugs antes de eles virarem correção (o famoso rubber duck debugging). Aparece em detalhes pequenos e nunca no lugar do logo.
SVG
02
Construção
Um F feito de três barras que encurtam e perdem força, como um sinal saindo em alta velocidade. A altura da barra, x, é a unidade de todas as medidas.
área de respiro
Deixe pelo menos 2x livres em todos os lados.
tamanho mínimo
16 px
16 px de altura
Abaixo disso, a terceira barra some.
03
Cores
Clique em uma amostra para copiar o hexadecimal. O contraste indicado é sobre o fundo da página, Ink 950.
proporção de uso
Volt
A cor da marca. Pouca quantidade: ação principal, foco e dado em destaque.
Ink
A escala neutra levemente fria. Fundos, bordas e todo o texto.
Sinais
Reservadas para estado e sintaxe de código. Nunca decorativas, e sempre com ícone ou texto.
04
Tipografia
Duas famílias da Vercel, gratuitas e abertas: a Geist fala com pessoas, a Geist Mono fala de máquinas.
geist · títulos e texto
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 áãçéõ
pesos 400 · 500 · 600 · 700
geist mono · código e dados
{ }
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 /_-:=
pesos 400 · 500
05
Ícones
Desenhados para a flye.win: grade de 24 px, traço de 1,5 px, pontas retas e sem preenchimento. Herdam a cor do texto ao redor.
- alert
- arrow-right
- arrow-up-right
- bolt
- book
- card
- check
- chevron
- clock
- code
- copy
- cube
- download
- external
- eye
- eye-off
- folder
- gauge
- gear
- globe
- grid
- image
- key
- layers
- list
- lock
- logout
- menu
- pix
- plus
- pulse
- search
- shield
- sticker
- terminal
- trash
- upload
- user
- x
06
Como falamos
De desenvolvedor para desenvolvedor. Direto, específico e sem promessa vazia.
Assim
- "Chave revogada. Requisições com ela passam a receber 401."
- "100 mil requisições por mês, 300 por minuto."
- "Você atingiu a quota. Ela volta a zero em 1º de novembro."
Assim não
- "Oops! Algo inesperado aconteceu 😕"
- "A solução revolucionária de última geração."
- "Performance incrível e escalabilidade sem limites!"
07
Uso incorreto
Em caso de dúvida, use a versão principal sobre fundo escuro, sem nenhum ajuste.