カートに入れるボタン
ミニマリスト/フラットデザイン、グレースケールの配色、複雑な複雑さのレベル、ダッシュボードの目的、レスポンシブデザインとダークテーマのサポートを備えたカートボタンコンポーネントに追加します。
HTMLコード
<button class="flex items-center justify-center w-40 h-10 bg-gray-800 text-white rounded-md shadow-md hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-600 focus:ring-opacity-50 dark:bg-gray-200 dark:text-gray-800 dark:hover:bg-gray-300 dark:focus:ring-gray-400"> <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6" /> </svg> Add to Cart </button>関連コンポーネント
カートに加える Glassmorphism アーストーンボタン
アースカラーを使用したglassmorphismスタイルでデザインされたシンプルな「カートに入れる」ボタンは、天気や気候をテーマにしたアプリケーションに適しています。完全にレスポンシブで、ダークモードをサポートしています。
カートに入れるボタンコンポーネント
自然にインスパイアされたパステルカラーの「カートに入れる」ボタンコンポーネントは、ヘルスケア/医療アプリケーション向けに設計されており、流れるようなラインとダークモードをサポートするレスポンシブデザインが特徴です。