Aller au lien de contenu

Un composant de lien réactif « Skip to Content » stylisé avec Glassmorphism, mettant en œuvre un schéma de couleurs complémentaire, une complexité modérée et une prise en charge du mode sombre adapté aux sites Web d’entreprise. Ce composant est implémenté uniquement en HTML avec les classes CSS Tailwind, ne nécessitant aucun JavaScript.

Aperçu

HTML Code

<a href="#content" class="sr-only focus:not-sr-only focus:absolute focus:top-4 focus:left-4 focus:z-50 focus:px-4 focus:py-2 focus:rounded-md focus:text-white focus:bg-black focus:bg-opacity-30 focus:backdrop-filter focus:backdrop-blur-lg focus:shadow-lg dark:focus:text-black dark:focus:bg-white dark:focus:bg-opacity-30 dark:focus:backdrop-filter dark:focus:backdrop-blur-lg dark:focus:shadow-lg">Skip to content</a>

Composants associés

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.

Ouvrir

Aller au lien de contenu - Rétro monochromatique

Aller au composant de lien de contenu avec un design rétro/vintage, une palette de couleurs monochromatique et une complexité simple.

Ouvrir

Aller au lien de contenu

Un composant de lien « Aller au contenu » pour l’accessibilité, conçu pour les tableaux de bord en mode sombre avec une palette de couleurs en niveaux de gris. Il est modérément complexe en raison du style réactif et du mode sombre. Aucun JavaScript n’est utilisé. Utilise Tailwind CSS avec les préfixes dark : pour la prise en charge du thème sombre.

Ouvrir