:doodle {
@grid: 30 / 100%;
background: #0a0a12;
}
--hue: calc(@row * 8 + @col * 5 + @n * 0.1);
--size: @r(6px, 12px);
:after {
content: '';
display: block;
width: var(--size);
height: var(--size);
border-radius: @pick('50%', '30%', '10%');
background: hsla(
calc(var(--hue) + @r(-10, 10)),
@r(60, 80)%,
@r(40, 70)%,
@r(0.3, 0.9)
);
transform: rotate(@r(0, 360)deg) scale(@r(0.5, 1.2));
box-shadow: @m2(0 0 @r(4px, 12px) hsla(var(--hue), 70%, 50%, 0.3));
}
TYPE
generative type machine
grid 30×30 · css-doodle · variable font