CSS — язык декларативный и детерминированный. Ты говоришь браузеру что нарисовать, а не как — и результат всегда предсказуем. Это делает его надёжным, но совершенно непригодным для естественных вариаций: случайный фон, разные цвета при каждом заходе, конфетти, которое выглядит живым, а не механическим.
Разработчики хотели этого с самого начала — и шли к решению долгим, извилистым путём.
Паттерны и псевдослучайность
Первый трюк — имитировать случайность через CSS-паттерны: селекторы :nth-child(), анимации с хитрыми задержками. Технически это не рандом: машина легко предскажет следующее значение, а человек рано или поздно заметит повторение. Хак, не решение.
Препроцессоры
Следующий шаг — инструменты: Sass, SCSS, Less и другие. Их математические модули умеют генерировать случайные значения. Загвоздка — всё это происходит в момент компиляции. Значения действительно случайные, но затем замирают навсегда, как муха в янтаре. Каждый посетитель страницы видит одни и те же «случайные» числа до следующей пересборки стилей.
Серверная сторона
Логичный следующий уровень — генерировать значения на сервере (PHP, Java, ASP и другие) и передавать их в CSS через HTML. Это уже ощутимо лучше: при каждом запросе страницы пользователь получает свежие числа. Но динамически добавленный контент застревал со значениями первой загрузки — особенно болезненно с приходом SPA и клиентских JavaScript-архитектур.
JavaScript
JavaScript решил задачу по-настоящему. Стили наконец могли вести себя с реальной вариативностью: случайные при создании элемента, при обновлении страницы и даже при мутациях DOM. Реализаций — море: фреймворки, CSS-in-JS библиотеки, ванильный JS.
Но это всё равно обходной путь: рандомизация живёт за пределами CSS, её нужно тащить извне.
Нативные функции рандома в CSS
Теперь CSS получает собственные функции для случайных значений — встроенные в сам язык, без препроцессоров, серверного кода и JavaScript-прослоек. Вариации становятся частью стека, а не костылём поверх него.
Это важно не только как фича, но и как смена парадигмы: детерминированный язык впервые получает инструмент для описания непредсказуемости — нативно, декларативно, без лишних зависимостей. 🦆