PTIdioma
Baixar grátisDisponível no AndroidiOS em breve

Design system · vivo

Guia de Marca

Tudo aqui é renderizado a partir dos mesmos tokens do site e dos mesmos arquivos que você baixa. Se um valor mudar na fonte, muda nesta página — não existe versão desatualizada. Clique em qualquer valor para copiar.

A marca

Arquivo baixável
PadsAmbiente
Render do site

A grade é a marca. Não é ornamento: são pads formando uma cruz, e é a mesma grade de 24 tons que estrutura o produto e o layout do site.

  • AssimUsar o símbolo sozinho quando o contexto já diz o nome.
  • AssimPintar de azul ou de branco sobre fundo escuro.
  • AssimUsar a versão de fundo claro quando o fundo for claro — ela existe para isso.
  • NuncaAlterar o arredondamento dos slots — são quase quadrados.
  • NuncaSeparar as duas palavras da assinatura em uma linha só.
  • NuncaEngrossar o traço dos slots vazados para eles aparecerem em tamanho pequeno — use o arquivo pequeno, que já traz só a cruz.
  • NuncaRecolorir fora da paleta desta página.

Baixar

Gerados por script a partir do vetor e dos tokens. O app não tem vetor da marca — este é o único que existe, então é daqui que sai qualquer peça.

Kit completoTodos os arquivos abaixo, mais as regras de uso em texto.832 KB

Símbolo

Assinatura horizontal

Assinatura vertical

Ícones de loja

Uso

Área de respiroUm passo da própria grade em todos os lados. A marca respira na medida dela, não num número solto.25.4%
100px +< 100px
Tamanho mínimoAbaixo de 100px o traço dos slots vazados fica sub-pixel e vira borrão cinza. Nesses tamanhos o arquivo já traz só a cruz — não engrosse o traço para compensar.

O que não fazer

  • NuncaEsticar ou espremer
  • NuncaGirar
  • NuncaRecolorir fora da paleta
  • NuncaSobre fundo sem contraste

Cores

Lidas direto da fonte do design system em tempo de build — esta lista não pode divergir do site.

Fundo

Texto

Azul — a cor da marca

Tonalidade — herdado do app

Estado

Tipografia

Fraunces

Display. Herói, títulos e citações — os momentos humanos.

Archivo

Texto e interface. Corpo, navegação, botões.

IBM Plex Mono

Técnico. Rótulos, dados, tabelas de tom.

Poppins

Assinatura. Só na marca — é a fonte do app.

Escala

Fluida com clamp() — não há breakpoint de tamanho de fonte.

  • Aa--step-6Herói da home
  • Aa--step-5Título de página
  • Aa--step-4Título de seção
  • Aa--step-3Subtítulo
  • Aa--step-2Nome de card
  • Aa--step-1Texto de destaque
  • Aa--step-0Corpo
  • Aa--step--1Apoio

Raio, elevação e movimento

O resto do design system, na mesma fonte.

Raio

Elevação

Movimento

  • --dur-fast
  • --dur-base
  • --dur-slow
  • --ease-out

Assinatura de e-mail

Clique em “Copiar assinatura” e cole direto no campo de assinatura do Gmail, Outlook ou Proton — cola formatada, não como código.

Pads Ambiente 
Seu Nome
Cargo · Pads Ambiente
Crescimento do Reino Software e Tecnologia LTDA · CNPJ 65.301.296/0001-26

Marca registrada

“Pads Ambiente” e o símbolo da grade são marcas de Crescimento do Reino Software e Tecnologia LTDA. Os arquivos desta página são disponibilizados para facilitar o uso correto da marca — não transferem sua titularidade.

  • AssimUsar a marca para se referir ao produto — em matéria, tutorial, resenha, aula ou integração.
  • AssimUsar os arquivos desta página como estão, sem alteração.
  • NuncaSugerir parceria, patrocínio ou endosso que não exista.
  • NuncaIncorporar a marca ao logo, ao nome ou à identidade de outro produto.
  • NuncaUsar a marca em nome de domínio, de aplicativo ou de empresa.
  • NuncaAlterar o desenho, as proporções ou as cores dos arquivos.

Para qualquer uso fora disso, ou em caso de dúvida, escreva para contato@padsambiente.com.br

Usamos medição de audiência para entender como o site é encontrado e melhorar o conteúdo. Nada é coletado sem o seu aceite.Como funciona →