버튼은 서비스 입장에서 사용자 주요 행동을 유도하는 역할을 하게 됩니다. 컬러, 크기, 모양 등 구성 시 고려해야 할 요소들도 많고요. 오늘은 에어비앤비, 메일침프, 쇼피파이, 트위치 등에서 사용되는 버튼 사례를 확인, CSS로 간단히 복사해 활용할 수 있는 서비스를 소개하고자 합니다.

구성은 정말 간단해요. 여러 버튼을 어떤 서비스에서 사용 되고 있는지에 따라 확인할 수 있습니다. 우리에게 꽤 익숙한 서비스가 많이 포함된 모습입니다.

원하는 모양의 버튼을 클릭하면 바로 ‘CSS’ 복사할 수 있어요. 제공되는 버튼 사례가 많아 원하는, 비슷한 모양의 버튼 사례를 찾아 어렵지 않게 활용할 수 있다는 점이 가장 큰 장점입니다.

아마존, 디스코드에서 사용중인 버튼 사례도 보이네요. 서비스가 여러개인만큼 버튼 구성도 다양하게 확인할 수 있습니다.

사이즈나 컬러값은 CSS 복사 후 쉽게 변경할 수 있으니, 원하는 모양을 먼저 찾아 세부 조건을 조금씩 바꿔가는 방법으로 사용할 수 있습니다. 버튼은 계속 추가 될 예정이라고 하니, 자세한 내용은 ‘이 곳’을 통해 확인해보세요!

함께 활용해보세요!

00:00, 뉴스레터 안내

6월 24일 목요일 발행된 뉴스레터는 ‘🤭 당황스러운 상황을 해결하는 404 페이지!‘에 대한 내용이었어요. 다음 뉴스레터는 7월 8일 목요일 오전 8시 발행 예정으로, 서비스 별 푸터 구성 방법과 사례를 다양하게 살펴볼 예정이에요. 구독 후, 격주 목요일 발행되는 뉴스레터를 더 편리하게 받아보세요!