1차 공개일 · 8월 18일1차 강의가 모두 공개됩니다
TECH 으로 돌아가기
TECH HACKER NEWS 2026.06.28 2분 읽기 177 READS

CSS만으로 난수를? 자바스크립트 없이 random() 실험하기

CSS Values 5에 등장한 random() 함수는 이제 자바스크립트 없이도 스타일에 무작위성을 넣을 수 있게 해줍니다. random(min, max, by step) 형태로 숫자뿐 아니라 색상, 각도, 위치 등 calc로 표현 가능한 거의 모든 값에 쓸 수 있고, 목록에서 하나를 고르는 random-item()도 함께 제공됩니다. 핵심은 값이 페이지 로드 시 한 번 계산되어 고정된다는 점입니다. 매 프레임 새로 뽑히지 않으므로 요소가 흔들리지 않고 안정적으로 흩뿌려집니다. 또 캐싱 키를 지정해 여러 요소가 같은 난수를 공유할지, 각자 다른 값을 가질지 제어할 수 있어 카드 흩뿌리기, 애니메이션 지연 분산, 제너러티브 아트 같은 효과를 순수 CSS로 구현할 수 있습니다. 다만 아직 실험적 기능으로 Safari·Chrome의 프리뷰 빌드에서 플래그를 켜야 동작하니, 실무 적용보다는 다가올 변화를 미리 익혀두는 차원에서 살펴볼 만합니다.

SOURCE · HACKER NEWS
원문 전체 보기 → https://polypane.app/blog/experimenting-with-random-in-css/
SHARE
NEXT · CHOOSE

변화를 읽었다면,
내가 만들 수익 구조를 고릅니다.

정보를 더 모으는 데서 멈추지 않고, 광고·외주·판매·중개·구독 중 내 상황에 맞는 출발점을 정해보세요.

21가지 수익 구조 살펴보기
처리 중...