HTML 코드
<button class="bg-red-600 dark:bg-purple-600 text-white dark:text-black font-bold py-2 px-4 rounded border-4 border-black dark:border-white hover:bg-red-700 dark:hover:bg-purple-700 focus:outline-none focus:ring-2 focus:ring-black dark:focus:ring-white transition duration-300 ease-in-out">
Add to Cart
</button>
관련 구성 요소
Add to Cart Button 컴포넌트
여행/관광 웹사이트를 위한 반응형 '장바구니에 담기' 버튼 구성 요소로, 따뜻한 일몰 톤의 종이/인쇄 디자인에서 영감을 받았습니다. 다크 모드 지원과 미묘한 인터랙티브 효과가 포함되어 있습니다.
Add to Cart Button 컴포넌트
전자 상거래 애플리케이션을 위한 레트로/빈티지 스타일의 '장바구니에 추가' 버튼 구성 요소입니다. 이 버튼은 80년대와 90년대에서 영감을 받은 향수를 불러일으키는 디자인을 가지고 있으며, 유사한 색 구성표를 사용하고 상호 작용 효과를 제공합니다. 반응형이며 어두운 테마를 지원합니다.
Add to Cart Button 컴포넌트
장바구니에 추가 버튼: 어스 톤, 색상 구성표 및 복잡한 복잡성 수준이 있는 다크 모드 UI용으로 설계된 포트폴리오 목적입니다. 이 구성 요소는 반응형이며 Tailwind의 dark: 접두사를 사용하여 어두운 테마를 지원합니다.