test-estilos-astra · verificador en vivo
Design system — leído del sitio, no incrustado
Esta página no lleva colores ni fuentes del diseño metidos en el código: todo se pinta con la configuración REAL de Astra (sus variables CSS y la herencia del tema). Cada «computado» se mide en vivo con JavaScript y se compara con el «objetivo» del manifest.
midiendo…
Tipografía del tema · titulares y cuerpo
H1 · Encabezado de nivel 1
H2 · Encabezado de nivel 2
H3 · Encabezado de nivel 3
H4 · Encabezado de nivel 4
H5 · Encabezado de nivel 5
H6 · Encabezado de nivel 6
Párrafo de cuerpo con la tipografía y el color del tema. Contiene negrita y cursiva de ejemplo.
| midiendo… |
Enlaces
Enlace en reposo — muestra fija, no reacciona al ratón
Enlace en hover — estado pintado desde la regla a:hover real
Enlace en funcionamiento — pasa el ratón para ver la transición real
| midiendo… |
Fuentes detectadas
Paleta global de Astra · pintada con var(–ast-global-color-N) · clic para copiar
Botón primario · markup nativo, sin estilo propio
| midiendo… |
«Inicio» y «Final (hover)» son muestras FIJAS (no reaccionan al ratón) con los estados de reposo y hover leídos del CSS servido; solo el tercer botón es interactivo, con la transición real del tema.
Botón secundario (outline) · markup nativo, sin estilo propio
| midiendo… |
«Inicio» y «Final (hover)» son muestras FIJAS (no reaccionan al ratón) con los estados de reposo y hover leídos del CSS servido; solo el tercer botón es interactivo, con la transición real del tema.
Contenedor, fondo y breakpoints
| midiendo… |
| Breakpoint (referencia del manifest) | Padding lateral | Ancho |
|---|---|---|
| Móvil · 0–767px | 15px | 100% |
| Tablet · 768–1024px | 50px | 100% |
| PC · 1025–1499px | 50px | 100% |
| PC · ≥1500px | — | 1400px (centrado) |
Cobertura del manifest
midiendo…
| midiendo… |
Componentes base del tema
«Cita de ejemplo con los estilos del tema.»
- Elemento de lista uno
- Elemento de lista dos
