Polyfill para llevar la función CSS random() a todos los navegadores

Fuentes: Let's Use the Emergent CSS random() Function in all the Browsers

La comunidad web discute desde finales de 2025 una nueva función nativa de CSS llamada random(), pensada para introducir aleatoriedad controlada en el diseño sin depender de JavaScript. Safari fue el primer navegador en incorporarla, dentro de un conjunto de novedades enfocadas a «pavimentar los caminos» y reducir la necesidad de scripts externos o frameworks de terceros. Demostraciones como las de Schalk Neethling o Alvaro Montoro han mostrado su utilidad para efectos visuales como lluvia de confeti, campos de estrellas o distribuciones aleatorias de elementos, alineándose con la Rule of Least Power del W3C, que aboga por resolver cada problema con el lenguaje menos potente capaz de hacerlo.

Sin embargo, la función sigue sin fecha concreta de llegada a Chrome ni Firefox, aunque ambos motores trabajan en su implementación. La especificación forma parte de un editor's draft en «fase temprana de exploración», con cambios importantes aún esperados, y su sintaxis resulta sorprendentemente intricada por el sistema de caché, las claves y los intervalos aleatorios. Polyfillear una función CSS plantea además dificultades técnicas conocidas, como se vio con ::nth-letter.

Ante esta situación, el autor ha publicado un polyfill en npm (css-random-polyfill) que permite usar la sintaxis random() también en Chrome y Firefox. La pieza detalla cómo migrar los ejemplos oficiales de Safari —como un campo de 200 estrellas con ángulos y tonos aleatorios— a una versión multiplataforma mediante una clase marcadora y el script de polyfill, abriendo la puerta a experiências con aleatoriedad presentacional desde la capa de estilos.