Skip to content
Boost CRM

Identidad Visual Web Boost CRM

Objetivo

Section titled “Objetivo”

Aplicar el canon visual de Boost CRM en Next.js con tokens semánticos de Tailwind v4.

Tokens críticos

Section titled “Tokens críticos”
  • Fondos: bg-main-bg, bg-nav-bg, bg-card.
  • Marca: brand-blue, brand-blue-dark, whatsapp-green.
  • Bordes: border-border-primary, border-border-secondary.
  • Texto: text-text-secondary, text-text-muted.

Tipografía

Section titled “Tipografía”
  • Poppins 400-700.
  • Jerarquía: text-xs a text-xl según contexto.

Spacing y radios

Section titled “Spacing y radios”
  • Tarjetas: rounded-2xl.
  • Inputs: rounded-xl.
  • Pills: rounded-full.

Motion permitido

Section titled “Motion permitido”
  • shimmer para loading.
  • micro-transitions de hover/focus.
  • evitar animaciones largas o distractoras.

Anti-patrones

Section titled “Anti-patrones”
  • Hex hardcodeados en TSX.
  • Nueva escala de radios fuera del canon.
  • Hover inconsistente en iconos de acción.