버튼 모션 모음

버튼에 붙일 만한 움직임만 모았어요. 카드마다 실제로 움직이고, CSS 보기에서 그대로 복사해 쓸 수 있어요. 조합도 돼요(예: 아이콘만 통통 + 광택 스윕).

버튼 색

성격

모션 최소화(접근성) 설정을 켠 사람에겐 실제 페이지에서 반복 모션을 끄는 게 원칙이에요 — 복사한 CSS에 아래 한 줄을 같이 넣으세요.
@media (prefers-reduced-motion: reduce) { .btn, .btn * , .btn::before, .btn::after { animation: none !important; } }