ブルータリズム トップに戻る
グレースケールの色と Tailwind CSS を使用したブルータリズムの Back to Top ボタン コンポーネント。応答性が高く、ダークモードをサポートしています。
HTMLコード
<button class="fixed bottom-4 right-4 bg-black text-white border-2 border-black group dark:bg-white dark:text-black dark:border-white">
<span class="block px-6 py-3 text-xl font-bold group-hover:-translate-x-2 group-hover:-translate-y-2 transition-all">
⬆️
</span>
</button>関連コンポーネント
トップに戻るボタン
ダークモードをサポートする、最小限で応答性の高い「Back to Top」ボタンコンポーネント。下にスクロールした後に表示され、スムーズスクロールを使用して、クリックするとユーザーをページの上部に戻します。スクロールにはJavaScriptは使用せず、CSSのみを使用します。
トップに戻るボタンコンポーネント
Tailwind CSS を使用したブルータリズム スタイルの Back to Top Button コンポーネント。このコンポーネントは、大胆でコントラストの高いデザインで、レスポンシブ効果とダークテーマをサポートしています。