# Identidad de marca — bikedo.app > Guía de identidad visual de bikedo.app: logotipo, paleta de colores, tipografía y voz y tono. Source: https://bikedo.app/es/brand Locale: es Cómo usar la marca bikedo.app. Una guía breve del logotipo, la paleta, la tipografía y cómo hablamos del producto. Si usas materiales de BikeDo en una web de partners, un kit de prensa o un post de comunidad, esta es la fuente de la verdad. --- ## Logotipo Dos colores, dos pesos, un acento Clay. Inter Black, interletraje ajustado. - El logotipo es siempre «bikedo.app» (minúsculas). El sufijo «.app» va siempre en Clay. - Espacio libre alrededor del logotipo al menos la altura de la «b». No lo aprietes. - En texto corrido, escribe el producto como BikeDo (CamelCase) — nunca «BikeDo App» ni «BikeDo API». --- ## Iconos La marca de la app — una «b» minúscula en Clay sobre un mosaico oscuro. La misma marca funciona como icono de la app, favicon e icono en pies de página o firmas. ![bikedo.app](https://bikedo.app/brand/app-icon-512.png) - **Icono de la app** — Cuadrado redondeado, «b» en Clay sobre Black/Charcoal. iOS y Android, App Store y Google Play. ([PNG 1024](https://bikedo.app/brand/app-icon-1024.png)) - **Favicon / pequeño** — Una letra más grande para la legibilidad a 16–32 px. Pestañas del navegador, marcadores y PWA. ([.ico](https://bikedo.app/brand/favicon.ico)) - **Fuente vectorial** — SVG maestro para renders grandes e impresión — escala sin perder calidad. ([SVG](https://bikedo.app/brand/icon.svg)) - No recolorees, deformes ni gires la marca. Conserva sus proporciones y su espacio libre. - El icono lleva su fondo oscuro incorporado — no lo coloques sobre otro mosaico oscuro sin separación. --- ## Fondos de pantalla Fondos de escritorio en la paleta de la marca — la marca sobre charcoal, en 5K. Elige la marca sola o con el eslogan. ![bikedo.app wallpaper](https://bikedo.app/brand/wallpapers/wallpaper-plain.jpg) - **Solo la marca** — La marca bikedo.app centrada sobre charcoal. Limpio, sin eslogan. 5120×2880. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-plain-5120x2880.png)) - **Con el eslogan · PL** — La marca con el eslogan. 5120×2880 — elige tu idioma. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-pl-5120x2880.png)) - **Con el eslogan · EN** — La marca con el eslogan. 5120×2880 — elige tu idioma. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-en-5120x2880.png)) - **Ultrapanorámico** — Un recorte panorámico para ultrawide y doble monitor. 5120×1008. ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-ultrawide-5120x1008.png)) **Para el móvil** - **Solo la marca** — Solo la marca, en la mitad inferior (segura para la pantalla de bloqueo). iPhone y 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)) - **Con el eslogan · PL** — La marca con el eslogan, en la mitad inferior. iPhone y 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)) - **Con el eslogan · EN** — La marca con el eslogan, en la mitad inferior. iPhone y 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)) **Redes / compartir** Imagen Open Graph 1200×630 para compartir y vistas previas en redes. - **Solo la marca** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-plain-og-1200x630.png)) - **Con el eslogan · PL** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-pl-og-1200x630.png)) - **Con el eslogan · EN** ([PNG](https://bikedo.app/brand/wallpapers/wallpaper-en-og-1200x630.png)) --- ## Paleta de colores Inspirada en los cañones. Un acento cálido (Clay), dos oscuros, dos neutros, dos tonos de texto. Cada color tiene un rol — mantenlo. | Name | Hex | Role | |------|-----|------| | Clay | `#C45E3A` | Acento principal. CTA, enlaces, focus, estados activos. Nunca de fondo de página. | | Black | `#1A1A1A` | Fondo de página (superficies oscuras). Canvas por defecto de la app móvil y web. | | Charcoal | `#2D2D2D` | Fondo de tarjetas/paneles sobre superficies oscuras. Un tono más claro que Black. | | Stone | `#4A4A4A` | Bordes, divisores, líneas finas sobre superficies oscuras. Reducir a 30–60% de opacidad para separadores sutiles. | | Text light | `#F5F5F5` | Texto principal sobre superficies oscuras. Títulos y cuerpo sobre Black/Charcoal. | | Text muted | `#78716C` | Texto secundario, captions, ayudas, placeholders. Cumple WCAG AA en Black para tamaños de body. | | Sand | `#E8DED5` | Borde en superficies claras (marketing, mockups). Combina con Light bg. | | Light bg | `#F8F6F3` | Blanco roto para el tema claro y mockups. Nunca blanco puro. | --- ## Tipografía Inter para producto y body. Playfair Display para títulos editoriales en marketing. No mezcles — un rol por superficie. - **Inter** — UI + body - **Playfair Display** — Títulos editoriales Hierarchy: - H1 — Playfair, 48–60px: _Un hogar más simple para tus bicis._ - H2 — Playfair, 28–36px: _Historial de servicio sin hojas de cálculo._ - Body — Inter, 16–18px: Registra un servicio en dos taps. Añade una foto. Compártelo con un taller. Todo el historial viaja con la bici cuando cambia de dueño. - Caption — Inter, 12–13px: Último servicio hace 14 días · 1.240 km --- ## Voz y tono BikeDo suena como un amigo tranquilo y competente que sabe de bicis. Seguro, concreto, sin hype. No gritamos. ### Sí - **Usa el logotipo como «bikedo.app» con «.app» en Clay.** — Combínalo con Inter Black/Bold y deja que respire — al menos la altura de la «b» como espacio libre. - **En texto corrido, escribe el producto como «BikeDo» (CamelCase).** — El CamelCase se lee mejor en una frase que las minúsculas del logotipo. - **Usa Clay con moderación — un solo acento por página Black/Charcoal.** — Si todo es acento, nada lo es. Clay debe llevar la mirada a la siguiente acción. - **Usa sentence case en títulos y botones.** — Sentence case suena más humano, menos corporativo. ### No - **No escribas «BikeDo App», «BikeDo Mobile» ni «BikeDo API» en texto.** — Es solo BikeDo — la app y la API son detalles de implementación, no parte del nombre. - **No cambies la división de color del logotipo.** — «bikedo» siempre en Text light (fondos oscuros) o Charcoal (fondos claros); «.app» siempre en Clay. - **No pongas Clay sobre Clay ni recolorees el sufijo «.app».** — Pierdes la señal de reconocimiento que ancla la marca. - **No uses blanco puro como fondo.** — Usa Light bg (#F8F6F3). El blanco puro queda clínico junto a la paleta terrosa. - **No añadas un tagline pegado al logotipo.** — Si necesitas tagline, ponlo en línea separada bajo el logotipo en Text muted. --- ¿Necesitas algo que no esté aquí (logo vectorial, plantillas OG, badges de partner)? Escribe a hello@bikedo.app.