장바구니에 추가 버튼

마이크로 인터랙션에서 영감을 받은 호버 효과가 있는 심플한 흙색 장바구니에 담기 버튼은 반응형 디자인과 다크 모드 지원을 특징으로 합니다.

미리 보기

HTML 코드

<button class="bg-brown-600 hover:bg-brown-700 text-white font-bold py-2 px-4 rounded-lg focus:outline-none focus:shadow-outline transition duration-300 ease-in-out transform hover:scale-105
                       dark:bg-brown-700 dark:hover:bg-brown-800">
  <span class="text-sm">Add to Cart</span>
</button>

관련 구성 요소

Add to Cart Button 컴포넌트

자연에서 영감을 받은 캔디 색상의 '장바구니에 담기' 버튼 구성 요소는 포럼/커뮤니티 플랫폼을 위해 설계되었으며, 유려하고 유기적인 스타일을 특징으로 합니다. 반응이 빠르고 다크 모드를 지원합니다.

열다

Add to Cart Button 컴포넌트

게임 인터페이스용으로 설계된 복잡한 스큐어모픽 '장바구니에 추가' 버튼 구성 요소로, 유사한 색 구성표와 다크 모드 지원으로 완전한 응답성을 특징으로 합니다.

열다

장바구니에 추가 버튼

Tailwind CSS를 사용하여 머티리얼 디자인 원칙에 따라 스타일링된 반응형 장바구니에 담기 버튼으로, 다크 모드 테마를 지원합니다.

열다