Manual de Marca · v1 · 2026
YA·DEV

Construimos sitios que parecen del futuro.

DISEÑO WEB · BRANDING · AUTOMATIZACIÓN

yadev.co

YA·DEV — Brand Guidelines
Contenido

Índice

YA·DEV — Brand Guidelines
02
01

La marca

Quiénes somos

YA·DEV es una agencia de desarrollo web, branding y automatización para empresas colombianas. Diseñamos y construimos cada sitio como una pieza única — calidad de agencia premium, lista para producción.

El nombre

YA·DEV une la inmediatez del español “ya” (ahora, sin demoras) con DEV (development). El punto medio · es la firma del sistema: separa, conecta y marca ritmo — el mismo punto que aparece en el lockup, los captions y la navegación.

Tagline

Construimos sitios que parecen del futuro.

Posicionamiento

Dark premium, monocromático con un solo acento — estilo Linear / Stripe / Vercel. Minimalismo sofisticado, profundidad por capas de vidrio y movimiento fluido. Cada proyecto se siente moderno, premium y elegante.

YA·DEV — La marca
03
03

Variantes & isotipo

Sobre fondo oscuro es la versión primaria. Existen versiones para fondo claro, sobre el gradiente y monocromática para usos de un solo color.

YA·DEV
PRIMARIA · sobre #08080A
YA·DEV
SOBRE CLARO · #F5F5F7
YA·DEV
SOBRE GRADIENTE · tinta oscura
YA·DEV
MONOCROMO · 1 tinta
Y·
Isotipo / monograma

Para avatares, favicons y app icons: el monograma Y· en una caja redondeada con el gradiente firma. Mínimo recomendado 32×32px.

YA·DEV — Variantes
05
04

Paleta de color

Monocromática sobre tinta casi-negra con un único acento: el gradiente firma. Disciplina de color = sensación premium.

Superficies & texto
Ink
#08080A
Fondo base
Ink 2
#0C0C0F
Superficie elevada
Glass
rgba(255,255,255,.03)
Panel vidrio +blur
FG
#F5F5F7
Texto principal
FG Dim
#A1A1AA
Texto secundario
FG Mute
#71717A
Captions / labels
Acento — gradiente firma
violet
Violet
#6E56F8
Inicio gradiente
cyan
Cyan
#22D3EE
Fin gradiente · punto medio
Firma (texto)
#9D8CFF → #5EEAD4
Gradiente aclarado p/ texto
YA·DEV — Color
06
05

Gradiente firma

El único acento de la marca. violeta → cian a 135°. Se usa con moderación: una pieza destacada por pantalla, no decoración constante.

#6E56F8 linear-gradient(135deg) #22D3EE

Dónde sí

  • Palabra clave dentro de un titular (clip de texto)
  • Botón primario / CTA único
  • Bordes de paneles destacados, reglas y subrayados
  • Cursor orbe, punto medio y micro-acentos

Dónde no

  • Bloques largos de texto de párrafo
  • Rellenar fondos completos a full opacidad
  • Mezclarlo con un segundo color de acento
  • Cambiar el ángulo o los hex del gradiente

Para texto sobre fondo oscuro se usa la versión aclarada #9D8CFF → #5EEAD4, que mantiene contraste AA. El gradiente sólido (#6E56F8 → #22D3EE) se reserva para fondos, botones y bordes.

YA·DEV — Gradiente firma
07
06

Tipografía

Sistema de tres voces: una display geométrica, una de lectura neutra y una monospace para datos y labels.

Display · titularesSpace Grotesk · 500–700 · tracking −3%
Construimos sitios
ABCDEFGHIJKLM abcdefghijklm 0123456789 · & @ #
Body · lecturaInter · 300–600
Diseño web, branding y automatización para empresas colombianas.
ABCDEFGHIJKLM abcdefghijklm 0123456789
Mono · labels & datosIBM Plex Mono · 400–600 · tracking +
DISEÑO · BRANDING · 2026
Display / H156–88px · 600/700
Heading / H230–40px · 600
Body15–18px · 400 · 1.6
Caption / label11–13px · UPPER · +tracking
YA·DEV — Tipografía
08
07

Uso correcto

Reglas para mantener consistente la marca en cualquier aplicación.

Sí hacer

  • Fondo oscuro como base por defecto
  • Un solo acento: el gradiente firma
  • Mucho aire — espaciado generoso
  • “DEV” con gradiente, punto medio en cian
  • Profundidad por capas de vidrio + blur
  • Movimiento fluido, sutil, con propósito

No hacer

  • Deformar, rotar o re-espaciar el lockup
  • Cambiar las fuentes de la marca
  • Añadir un segundo color de acento
  • Sombras duras / degradados ajenos
  • Saturar la pantalla de gradiente
  • Poner el lockup sobre fotos sin contraste
Recordatorio

Cada sitio que produce YA·DEV es visualmente único — pero la marca YA·DEV (esta identidad) es siempre consistente. No confundir el diseño del cliente con la identidad de la agencia.

YA·DEV — Uso correcto
09
08

Tono & voz

Confiada, clara y técnica sin ser fría. Hablamos como ingenieros que también diseñan: precisos, directos, con criterio.

Somos

Directos · seguros · modernos · cercanos · meticulosos

No somos

Recargados · genéricos · corporativos huecos · exagerados

Atributos de marca
PREMIUMMINIMALISTAFUTURISTA PRECISOÚNICOFLUIDOCONFIABLE
Ejemplos de copy

Así

  • “Construimos sitios que parecen del futuro.”
  • “Tu sitio, listo para producción.”
  • “Diseño único, no plantillas.”

Así no

  • “La mejor agencia #1 del mundo!!!”
  • “Soluciones 360° de sinergia integral.”
  • “Webs baratas y rápidas ya.”
YA·DEV — Tono & voz
10
09

Componentes

Aplicación del sistema en piezas de interfaz reales del sitio.

Botones
Pill / badge
Disponible para proyectos ASTROSVELTETAILWIND
Panel de vidrio (overlap)

Desarrollo web corporativo

Paneles translúcidos con backdrop-blur que se montan unos sobre otros — la composición de profundidad del sistema.

YA·DEV

Construimos sitios que parecen del futuro.

yadevsistem@gmail.com

WhatsApp +57 300 477 3174

yadev.co · Barrancabermeja, Colombia

YA·DEV — Componentes
11