Changelog

10 de junio de 2026

Salida CSS con nesting

Se ha añadido un selector en el bloque de código CSS para alternar entre la salida sin nesting, por defecto, y la salida con CSS nesting en los labs con varios selectores.

8 de junio de 2026

Nuevos labs de selectores CSS

Se han añadido nuevos labs de CSS para probar pseudoelementos y pseudoclases de forma visual:

• Labs de CSS para pseudoelementos: ::search-text y ::selection.
• Labs de CSS para pseudoclases: :current, :empty, :hover, :active, :link, :visited y :any-link.

4 de junio de 2026

Nuevo lab de espaciado

Se ha añadido un nuevo lab de CSS para gap decorations, disponible desde Chrome y Edge 149. Permite probar decoraciones en los gaps de grid y flex sin añadir bordes, pseudo-elementos ni markup extra.

El lab incluye controles para aplicar reglas en columnas, filas o ambos ejes, ajustar row-rule, column-rule, rule-inset, rule-break, rule-visibility-items y rule-overlap, además de generar el HTML y CSS listo para copiar.

27 de mayo de 2026

Nuevos labs de HTML

Se han añadido 3 nuevos labs de HTML:

• Lab del elemento <select>, el cual servirá como base para un próximo custom select en CSS.
• Labs de <geolocation> y <install>, dos nuevos elementos que nos permites controlar permisos de forma declarativa desde HTML.

19 de mayo de 2026

Nuevos labs de pseudoclases, pseudoelementos y HTML

Se han añadido nuevos labs para seguir explorando funcionalidades modernas del navegador:

• Labs de CSS para pseudoclases: :open y :popover-open.
• Labs de CSS para pseudoelementos: ::backdrop y ::details-content.

Nuevo web component color-input

Los controles de color de BaselineLab ahora usan el web component color-input, creado por Adam Argyle, para ofrecer una experiencia más completa y moderna al trabajar con inputs de tipo color.

8 de mayo de 2026

Asistente de IA en los labs

Se ha añadido un asistente de IA en cada lab para resolver preguntas sobre la funcionalidad que se está probando, explicar el código generado y revisar posibles riesgos de compatibilidad o accesibilidad.

El asistente utiliza Vercel AI Gateway y está acotado al contexto de cada lab. También se han incorporado medidas básicas de seguridad y control de uso: validación del lab en servidor, límite de longitud para las preguntas, renderizado Markdown sanitizado y preparación para rate limiting desde el Firewall de Vercel.

5 de mayo de 2026

Nuevo lab de filtros

Se ha añadido un nuevo lab de CSS para filtros: mix-blend-mode.

Mejoras en las salidas de código

Se han refinado las salidas HTML y CSS de varios labs para que funcionen mejor al copiar y pegar el código en un documento independiente:

• Labs de colores: mejoras en accent-color, color-mix() y contrast-color().
• Labs de fondos: salida más completa para background-color.
• Labs de bordes: tamaños base más útiles para visualizar border, border-radius, outline y corner-shape.
• Labs de filtros: tamaños base y composición más clara en filter, backdrop-filter y mix-blend-mode.
• Lab de formularios: salida más clara y acotada para field-sizing.
• Labs de espaciado: salidas más visuales para margin y padding.
• Lab de textos: salida y previsualización mejoradas para text-align, con un texto más largo para apreciar mejor justify.

1 de mayo de 2026

Nuevos labs de filtros

Se han añadido los siguientes labs:

• Labs de CSS para filtros: backdrop-filter y filter.

Además se han mejoras de estilos y correcciones de errores.

29 de abril de 2026

Primeros labs de BaselineLab

BaselineLab nace como un laboratorio interactivo para probar funcionalidades modernas de HTML y CSS de forma visual, ajustar sus configuraciones y llevarte código reutilizable para tus proyectos.

En esta primera versión ya puedes explorar labs organizados por tecnología, categoría y funcionalidad. Cada lab combina controles visuales, previsualización en tiempo real y salida de código para que puedas experimentar sin cambiar de herramienta.

Funcionalidades añadidas:

• Labs de CSS para colores: accent-color, color-mix() y contrast-color().
• Labs de CSS para fondos: background-color y background-image.
• Labs de CSS para bordes: border, border-radius, outline y corner-shape.
• Labs de CSS para espaciados: margin y padding.
• Lab de CSS para formularios: field-sizing.
• Labs de CSS para scroll y textos: scrollbar y text-align.
• Labs de HTML para elementos nativos: details, dialog y meter.

Qué puedes hacer en los labs:

• Ajustar valores con selectores, campos, rangos, colores y controles específicos de cada propiedad.
• Cambiar entre propiedades físicas y propiedades lógicas cuando el lab lo permite.
• Probar distintas unidades y direcciones de texto para validar cómo responde el resultado.
• Ver la previsualización al instante.
• Copiar el HTML, CSS o JavaScript generado según la funcionalidad.
• Compartir un lab con los ajustes actuales mediante una URL.
• Consultar el estado Baseline de compatibilidad cuando está disponible.

También se ha preparado la base visual de BaselineLab con modo claro y oscuro, navegación por categorías, páginas localizadas en español e inglés, soporte como PWA instalable y una experiencia centrada en usar el navegador como espacio de prueba.

Este lanzamiento deja preparada una base viva para seguir incorporando nuevos labs y refinando la experiencia con el tiempo.

Si tienes alguna sugerencia de mejora, un lab que te gustaría ver implementado, un error que reportar o simplemente quieres contactarme, puedes abrir un issue en GitHub o escribirme un correo electrónico.