Zurück-nach-oben-Schaltfläche
Eine Back-to-Top-Button-Komponente mit Mikrointeraktionen, Farbschema in Erdtönen, einfachem Layout für Geschäfts-/Unternehmenswebsites; Responsives Design mit Unterstützung des Dunkelmodus unter Verwendung von Tailwind CSS
HTML-Code
<!-- Back to Top Button Component -->
<a href="#top" class="fixed bottom-6 right-6 flex items-center justify-center w-12 h-12 bg-emerald-700 text-white rounded-full shadow-lg transform transition-transform duration-200 hover:scale-110 hover:bg-emerald-600 dark:bg-emerald-600 dark:hover:bg-emerald-500" aria-label="Back to Top">
<span class="sr-only">Back to Top</span>
<svg class="w-6 h-6" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 15l7-7 7 7"/>
</svg>
</a>
<!-- To enable smooth scrolling behavior across the page, add the `scroll-smooth` class to your `<html>` element: -->
<!-- <html class="scroll-smooth"> -->Verwandte Komponenten
Zurück zum Anfang Schaltflächenkomponente
Eine minimalistische und flache Back to Top Button-Komponente für Dashboards mit einem monochromen Farbschema. Es ist mäßig komplex mit interaktiven Funktionen, einem responsiven Design und Unterstützung für dunkle Themen, die ausschließlich mit HTML und Tailwind CSS erstellt wurden.
Zurück zum Anfang Schaltflächenkomponente
Eine reaktionsschnelle "Zurück zum Anfang"-Schaltflächenkomponente für Dokumentations-/Wiki-Seiten, inspiriert von Memphis Design mit einem lila/violetten Farbschema. Enthält Unterstützung für den Dunkelmodus und ein komplexes, interaktives Erscheinungsbild.
Skeuomorphe Schaltfläche "Zurück zum Anfang"
Ein skeuomorpher "Zurück zum Anfang"-Button mit warmen Neutraltönen für Business-/Unternehmenswebsites mit responsivem Design und Unterstützung für den Dunkelmodus. Der Knopf hat einen 3D-Druckeffekt.