[CSS] 16가지 버튼 애니메이션 효과

 

See the Pen Candy Color Button Animation by Yuhomyan (@yuhomyan) on CodePen.

 

웹사이트를 퍼블리싱할 경우 기획을 바탕으로 디자인한 시안을 그대로 따라서 제작하게 된다.

하지만 기획이나 시안 단계에서는 주로 레이아웃과 컨텐츠 배치에 신경 쓰고, 마우스오버시 어떻게 나타나달라, 클릭시 이런 효과가 있으면 좋겠다라는 요구는 잘 없다. (아예 없진 않다.)

그래서 퍼블리셔의 재량에 따라 버튼 같은 요소에 효과를 추가할 수 있는데 나는 가급적이면 사이트를 새로 제작할 때마다 조금씩 새로운 기능이나 효과를 사용하려고 노력한다.

다음에는 이 codepen에 있는 버튼을 사용해 볼 생각이다.