Valentech — Design System
Guía de estilo para landing pages.
Colores
Azul Oscuro — Principal
#003A5D
Navbar, footer, headings, fondos oscuros
Azul Claro — Complementario
#B2E2F9
Badges, highlights, fondos suaves
Verde — Acento
#49BEAA
CTAs, íconos, hover states, barras de acento
Beige — Fondo
#F0F1EB
Fondo general de página y secciones claras
Blanco
#FFFFFF
Cards y textos sobre fondos oscuros
Texto
#003A5D
Color de texto por defecto
Tipografía
Valentech Pharma — Innovación para la vida
h1 · League Gothic · 72px · 400
Valentech Pharma — Innovación para la vida
h2 · League Gothic · 56px · 400
Valentech Pharma — Innovación para la vida
h3 · League Gothic · 40px · 400
Valentech Pharma — Innovación para la vida
h4 · League Gothic · 32px · 400
Valentech Pharma — Innovación para la vida
h5 · Helvetica Neue · 24px · 700
Valentech Pharma — Innovación para la vida
h6 · Helvetica Neue · 20px · 700
Valentech Pharma — Innovación para la vida
body · Helvetica Neue · 16px · 400
Valentech Pharma — Innovación para la vida
small · Helvetica Neue · 14px · 400
Botones
Pasa el cursor sobre cada botón para ver su estado hover.
Cards
Protoporfirina eritrocitaria
Prueba bioquímica clave para confirmar el diagnóstico de PPE, medida en sangre total como fracción libre y quelada con zinc.
Seguimiento multidisciplinario
Hematología, dermatología y hepatología trabajan en conjunto para el control de pacientes con porfirias cutáneas.
Badges
Navbar
Footer
Spacing
--spacing-section: 80px
Entre secciones de landing
--spacing-content: 48px
Entre bloques de contenido
--spacing-element: 24px
Entre elementos de un bloque
--max-width: 1200px