Brutalistisch Zum Inhaltsverzeichnis springen Link (Wald/Grün)
Eine rohe, fette "Skip to Content"-Link-Komponente, die in einem brutalistischen Stil mit einer Wald-/Grün-Farbpalette gestaltet ist und für Buchungs-/Reservierungssysteme geeignet ist. Es ist reaktionsschnell und unterstützt den Dunkelmodus.
HTML-Code
<a href="#main-content" class="sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:z-50 focus:px-6 focus:py-3 focus:text-lg focus:font-extrabold focus:uppercase focus:tracking-wider focus:bg-emerald-600 focus:text-lime-50 focus:ring-4 focus:ring-lime-300 focus:ring-offset-4 focus:ring-offset-emerald-900 dark:focus:bg-emerald-800 dark:focus:text-lime-200 dark:focus:ring-lime-600 dark:focus:ring-offset-emerald-950 dark:focus:ring-offset-8 transition-all duration-300 ease-in-out">Skip to Main Content</a>
<main id="main-content" class="min-h-screen bg-lime-50 text-emerald-900 dark:bg-emerald-950 dark:text-lime-50 p-8 container mx-auto flex items-center justify-center">
<h1 class="text-4xl md:text-6xl font-black uppercase tracking-widest text-center leading-tight">Main Booking Content Starts Here</h1>
</main>Verwandte Komponenten
Zur Inhaltslink-Komponente springen
Glassmorphism Skip to Content Link mit Milchglaseffekt, Unschärfe, Reaktionsfähigkeit und Unterstützung für den Dunkelmodus mit Tailwind CSS ohne JavaScript.
Zum Content Link springen - Retro Monochromatic
Weiter zu Content Link Component mit Retro-/Vintage-Design, monochromatischem Farbschema und einfacher Komplexität.
Zur Inhaltslink-Komponente springen
Ein visuell ansprechender Link "Zum Inhalt springen" im 3D-Stil, der Benutzern hilft, Navigationsmenüs auf einer Social-Media-Oberfläche zu umgehen. Die Komponente verwendet ein komplementäres Farbschema (Blau und Orange) mit einem 3D-Effekt, der durch Schatten und Transformationen erzielt wird. Mit responsivem Design und Unterstützung für dunkle Themen. Der Link wird im fokussierten oder aktiven Zustand oben links im Ansichtsfenster fixiert angezeigt, sodass er für die Tastaturnavigation leicht zugänglich ist, während er bei Nichtgebrauch unauffällig bleibt.