CSS 버튼 이쁘게 꾸미기

Study·2021년 7월 26일
12

only css

목록 보기
1/1

다음에도 쉽게 사용할 수 있도록 생각나는 버튼들을 직접 만들어 보았다.

  • 일반 버튼
    • 적당한 래디우스
    • 호버 시 글자 너비 조금 넓히고 스케일 키우기
    • 클릭 시 스케일 조금 키우기
    • 약간의 그림자
    • 그라데이션, 네온, 아웃 라인도 일반 버튼에 기반함
  • 그라데이션
    • 애니메이션 그라데이션 버튼도 추가
  • 네온
    • 호버 시 동그란 물결 추가
  • 아웃 라인
    • 호버 시 아웃 라인의 색감으로 백그라운드 색 채움
profile
Study

3개의 댓글

comment-user-thumbnail
2022년 2월 2일

와..너무 예뻐요!!

1개의 답글
comment-user-thumbnail
2023년 8월 8일

감사합니다! 좀 헤맸지만 잘 적용했어요 (아직 공부중입니다^^)

답글 달기