Hacker News Digest

21 августа 2025 г. в 20:43 • webkit.org • ⭐ 127 • 💬 21

OriginalHN

#css#random#webkit#safari#css-values-5

Rolling the dice with CSS random()

CSS random()
Новая функция random(min, max, step) генерирует случайные значения без JS. Все аргументы должны быть одного типа; step опционален и округляет результат.

Пример: звёздное поле

body{background:#000}
.star{
  position:fixed;
  top:random(0%,100%);
  left:random(0%,100%);
  width:random(2px,10px,1px);
  background:#fff;
  border-radius:50%;
}

Каждый .star получает случайные координаты и размер, создавая естественное распределение.

Дополнительные эффекты
Используйте CSS-переменные и слои box-shadow для свечения, а random() для прозрачности и цвета, усиливая атмосферу.