Aller au composant de lien de contenu
Un composant Skip to Content Link conçu avec des éléments 3D, des tons de terre et adapté aux interfaces de tableau de bord. Il comprend des styles pour les thèmes clairs et sombres.
HTML Code
<div class="flex flex-col gap-4 p-4 bg-gray-100 dark:bg-gray-800 rounded-lg shadow-lg transform transition-all duration-300 hover:scale-105">
<a href="#content" class="flex items-center justify-center h-12 px-4 font-medium text-white bg-brown-700 rounded-full shadow-md dark:bg-green-600 hover:bg-brown-600 dark:hover:bg-green-500 transition duration-300">
Skip to Content
</a>
<p class="text-gray-800 dark:text-gray-300">
Use this link to quickly navigate to the main content of the dashboard.
</p>
<img src="https://picsum.photos/200/100" alt="Dashboard Image" class="rounded-lg shadow-md" />
<div class="flex items-center gap-4">
<img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar" class="w-12 h-12 rounded-full border-2 border-gray-300 dark:border-gray-600" />
<span class="text-gray-800 dark:text-gray-300">User: John Doe</span>
</div>
</div>
Composants associés
SkipToContentLink
Passer à Composant de lien de contenu avec interface utilisateur en mode sombre, schéma de couleurs triadique et complexité simple pour le commerce électronique.
Glassmorphism Aller au lien vers le contenu
Glassmorphism Aller au contenu Lier le composant avec Earth Tones pour le tableau de bord.
Skeuomorphic_Autumn_Skip_to_Content_Link
Un composant de lien simple et skeuomorphe « Passer au contenu » conçu avec une palette de couleurs d’automne, adapté aux plateformes éducatives, offrant accessibilité et réactivité avec la prise en charge du mode sombre.