# Identidade da marca — bikedo.app > Guia de identidade visual do bikedo.app: logótipo, paleta, tipografia, voz e tom. Source: https://bikedo.app/pt/brand Locale: pt Como usar a marca bikedo.app. Um guia curto sobre o logótipo, a paleta, a tipografia e a forma como falamos do produto. Se estás a usar ativos BikeDo num site parceiro, num press kit ou num post de comunidade, esta é a fonte de verdade. --- ## Logótipo Duas cores, dois pesos, um acento Clay. Inter Black, espaçamento ligeiramente apertado. - O logótipo é sempre «bikedo.app» (minúsculas). O sufixo «.app» é sempre Clay. - Espaço livre à volta do logótipo pelo menos da altura do «b». Não o aperta. - Em texto corrente, escreve o produto como BikeDo (CamelCase) — nunca «BikeDo App» nem «BikeDo API». --- ## Ícones A marca da app — um «b» minúsculo em Clay sobre um mosaico escuro. A mesma marca funciona como ícone da app, favicon e ícone em rodapés ou assinaturas. ![bikedo.app](https://bikedo.app/brand/app-icon-512.png) - **Ícone da app** — Quadrado arredondado, «b» em Clay sobre Black/Charcoal. iOS e Android, App Store e Google Play. ([PNG 1024](https://bikedo.app/brand/app-icon-1024.png)) - **Favicon / pequeno** — Uma letra maior para legibilidade a 16–32 px. Separadores do navegador, marcadores e PWA. ([.ico](https://bikedo.app/brand/favicon.ico)) - **Fonte vetorial** — SVG mestre para grandes renderizações e impressão — escala sem perder qualidade. ([SVG](https://bikedo.app/brand/icon.svg)) - Não recolora, distorça nem rode a marca. Mantenha as proporções e o espaço livre. - O ícone já tem o fundo escuro incorporado — não o coloque noutro mosaico escuro sem espaçamento. --- ## Fundos de ecrã Fundos para computador na paleta da marca — a marca sobre charcoal, em 5K. Escolha só a marca ou a versão com slogan. ![bikedo.app wallpaper](https://bikedo.app/brand/wallpapers/wallpaper-plain.jpg) - **Apenas a marca** — A marca bikedo.app centrada sobre charcoal. Limpo, sem slogan. 5120×2880. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-plain-5120x2880.png)) - **Com o slogan · PL** — A marca com o slogan. 5120×2880 — escolha o seu idioma. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-pl-5120x2880.png)) - **Com o slogan · EN** — A marca com o slogan. 5120×2880 — escolha o seu idioma. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-en-5120x2880.png)) - **Ultrawide** — Um recorte panorâmico para ultrawide e duplo monitor. 5120×1008. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-ultrawide-5120x1008.png)) **Para telemóvel** - **Apenas a marca** — Apenas a marca, na metade inferior (segura para o ecrã de bloqueio). iPhone e Android. ([iPhone](https://bikedo.app/brand/wallpapers/wallpaper-plain-phone-iphone-1290x2796.png) · [Android](https://bikedo.app/brand/wallpapers/wallpaper-plain-phone-android-1080x2400.png)) - **Com o slogan · PL** — A marca com o slogan, na metade inferior. iPhone e Android. ([iPhone](https://bikedo.app/brand/wallpapers/wallpaper-pl-phone-iphone-1290x2796.png) · [Android](https://bikedo.app/brand/wallpapers/wallpaper-pl-phone-android-1080x2400.png)) - **Com o slogan · EN** — A marca com o slogan, na metade inferior. iPhone e Android. ([iPhone](https://bikedo.app/brand/wallpapers/wallpaper-en-phone-iphone-1290x2796.png) · [Android](https://bikedo.app/brand/wallpapers/wallpaper-en-phone-android-1080x2400.png)) **Social / partilha** Imagem Open Graph 1200×630 para partilhas e pré-visualizações sociais. - **Apenas a marca** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-plain-og-1200x630.png)) - **Com o slogan · PL** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-pl-og-1200x630.png)) - **Com o slogan · EN** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-en-og-1200x630.png)) --- ## Paleta de cores Inspirada em canyons. Um acento quente (Clay), dois escuros, dois neutros, dois tons de texto. Cada cor tem um papel — mantém-no. | Name | Hex | Role | |------|-----|------| | Clay | `#C45E3A` | Acento principal. CTAs, links, focus, estados ativos. Nunca como fundo da página. | | Black | `#1A1A1A` | Fundo de página (superfícies escuras). Canvas predefinido da app móvel e do web. | | Charcoal | `#2D2D2D` | Fundo de cards/painéis em superfícies escuras. Um tom mais claro que Black. | | Stone | `#4A4A4A` | Bordas, divisórias, linhas finas em superfícies escuras. Reduzir a 30–60% de opacidade para separadores subtis. | | Text light | `#F5F5F5` | Texto principal em superfícies escuras. Títulos e corpo sobre Black/Charcoal. | | Text muted | `#78716C` | Texto secundário, legendas, dicas, placeholders. Cumpre WCAG AA em Black para tamanhos body. | | Sand | `#E8DED5` | Borda em superfícies claras (marketing, mockups). Combina com Light bg. | | Light bg | `#F8F6F3` | Branco quebrado para tema claro e mockups. Nunca branco puro. | --- ## Tipografia Inter para produto e corpo. Playfair Display para títulos editoriais em páginas de marketing. Não misturar — um papel por superfície. - **Inter** — UI + corpo - **Playfair Display** — Títulos editoriais Hierarchy: - H1 — Playfair, 48–60px: _Uma casa mais simples para as tuas bicicletas._ - H2 — Playfair, 28–36px: _Histórico de manutenção sem folhas de cálculo._ - Body — Inter, 16–18px: Regista uma revisão em dois toques. Adiciona uma foto. Partilha com uma oficina. Todo o histórico viaja com a bicicleta quando muda de dono. - Caption — Inter, 12–13px: Última revisão há 14 dias · 1.240 km --- ## Voz e tom O BikeDo soa como um amigo calmo e competente que percebe de bicicletas. Confiante, concreto, sem hype. Não gritamos. ### Faz - **Usa o logótipo como «bikedo.app» com «.app» em Clay.** — Combina com Inter Black/Bold e deixa-o respirar — pelo menos a altura do «b» de espaço livre. - **Em texto corrente, escreve o produto como «BikeDo» (CamelCase).** — O CamelCase lê-se melhor numa frase do que as minúsculas do logótipo. - **Usa Clay com moderação — um único acento numa página Black/Charcoal.** — Se tudo é acento, nada é. O Clay deve guiar o olho à próxima ação. - **Usa sentence case em títulos e botões.** — Sentence case soa mais humano, menos corporativo. ### Não faz - **Não escrevas «BikeDo App», «BikeDo Mobile» nem «BikeDo API» em texto.** — É só BikeDo — app e API são detalhes de implementação, não parte do nome. - **Não alteres a divisão de cores do logótipo.** — «bikedo» sempre em Text light (fundos escuros) ou Charcoal (fundos claros); «.app» sempre em Clay. - **Não ponhas Clay sobre Clay nem recolorias o sufixo «.app».** — Perdes o sinal de reconhecimento que ancora a marca. - **Não uses branco puro como fundo.** — Usa Light bg (#F8F6F3). O branco puro fica clínico ao lado da paleta terrosa. - **Não juntes uma tagline ao logótipo.** — Se precisas de tagline, põe numa linha separada por baixo do logótipo em Text muted. --- Precisas de algo que não esteja aqui (logótipo vetorial, templates OG, badges de parceiro)? Escreve para hello@bikedo.app.