HTML, CSS 버튼 디자인 | 민민의 하드디스크 - 티스토리

CodePen을 보다 귀여운 스타일이나, 가지고 있으면 도움이 될 것 같은 버튼 리스트를 모아봤다.

호불호가 갈릴 수도 있지만 귀여운 스타일 위주이다.

 

1. Candy Color Button Animation

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

 

 

2. Bubbly Button

See the Pen Bubbly Button by Nour Saud (@nourabusoud) on CodePen.

 

 

3. Magic Card

See the Pen Magic Card by Gayane Gasparyan (@gayane-gasparyan) on CodePen.

 

 

4. Button hover effects with box-shadow

See the Pen Button hover effects with box-shadow by Giana (@giana) on CodePen.

 

 

5. Face Button

See the Pen Face Button by Katherine Kato (@kathykato) on CodePen.

 

 

 

6. Liquid Button

See the Pen Liquid button by Waaark (@waaark) on CodePen.

 

 

7. Pure CSS Toggle Buttons | ON - OFF Switches

See the Pen Pure CSS Toggle Buttons | ON-OFF Switches by Himalaya Singh (@himalayasingh) on CodePen.

 

 

8. Confetti Button

See the Pen Confetti Button by Cooper Goeke (@coopergoeke) on CodePen.

 

더 많았지만 글이 너무 길어질까봐 다음 글에서 올리려고 한다.

버튼 스타일이 모두 부드럽고  세련되어서 어디에 사용해도 잘 어울릴 것 같다.