버튼 hover처럼 시작과 끝 상태가 있는 변화에 적합합니다.
트랜지션·애니메이션 적용 기준
움직임은 상태 변화를 이해시키는 보조 장치입니다. hover 전환은 transition, 반복되거나 독립적인 움직임은 animation으로 나누어 선택합니다.
01상태
02시간
03속성
04접근성
로딩, 안내, 반복 강조처럼 중간 단계가 필요한 경우 사용합니다.
transform과 opacity 중심으로 움직이면 레이아웃 부담이 적습니다.
prefers-reduced-motion 사용자를 위해 불필요한 움직임을 줄입니다.