Tipografía
El sitio principal usa Poppins (títulos) + Inter (cuerpo). Nunito es exclusiva del universo app. Escalas, pesos y reglas.
La marca tiene dos contextos tipográficos. El principal es el del sitio (prouniversitas.cl); el de la app es un sub-universo.
Sitio principal: Poppins + Inter
| Rol | Familia | Pesos | Uso |
|---|---|---|---|
Títulos (font-heading) | Poppins | 500 · 600 · 700 · 800 | H1–H5, botones destacados, marquee. Siempre con tracking-tight |
Cuerpo (font-sans) | Inter | 400–700 | Párrafos, UI, formularios |
Preuniversitario PAES · El PRE que es PRO
Tu futuro empieza
con un paso
Preparamos tu PAES con una metodología comprobada: profesores PRO, programas PRO y un ecosistema digital pensado para ti.
Rasgos del sitio a respetar:
- Kicker de sección: mayúsculas,
tracking [0.2em], semibold, amarillo sobre navy (o navy sobre claro). - Los H1 del hero son Poppins bold, muy grandes, blancos, alineados con generosidad de espacio.
- El énfasis en texto claro se hace con
.mark-yellow(subrayado amarillo al 40% inferior): así se ve. - Cuerpo siempre Inter — nunca Poppins para párrafos largos.
Universo app: Nunito
La app de entrenamiento (preparalapaes.cl) usa una sola familia: Nunito (400/500/700/800) — redondeada y cálida, coherente con su carácter gamificado. No se usa en el sitio principal ni en comunicación institucional.
| Rol (app) | Tamaño / peso |
|---|---|
| Display (splash, XP) | 28 px / 800 |
| H1 | 22 px / 800 |
| H2 | 18 px / 700 |
| Body | 15 px / 500 |
| Caption | 12 px / 700 · MAYÚSCULAS · tracking 0.5px |
¡Muy bien! +10 XP · BONUS RACHA +5
Subiste de nivel: ahora estás en Medio. AaBbCc 0123456789
Reglas
Descargar / instalar
- CDN:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap'); - Nunito (app): self-host en
public/brand/fonts/(variable 200–1000 + estáticas 700/800, licencia OFL enLICENSES/). - En Next.js, el patrón del sitio real es
next/font/googlecon variables--font-heading/--font-sans(verpro-universitas-web/app/layout.tsx).