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.

Aperçu

HTML Code

<template>
  <a href="#main-content" class="sr-only focus:not-sr-only focus:absolute focus:top-0 focus:left-0 focus:z-50 focus:bg-purple-900 focus:text-lime-300 focus:p-3 focus:border-b-4 focus:border-cyan-400 dark:focus:bg-purple-900 dark:focus:text-lime-300 dark:focus:border-cyan-400">Skip to main content</a>
</template>

Composants associés

Aller au lien de contenu

Un composant de lien minimaliste pour le commerce électronique, avec des couleurs vives, un design réactif et une prise en charge du mode sombre.

Ouvrir

Aller au composant de lien de contenu

Un lien Skip to Content de style 3D visuellement attrayant qui aide les utilisateurs à contourner les menus de navigation sur une interface de réseau social. Le composant utilise une palette de couleurs complémentaires (bleu et orange) avec un effet 3D obtenu par des ombres et des transformations. Dispose d’un design réactif et d’un support de thème sombre. Le lien apparaît fixe en haut à gauche de la fenêtre d’affichage lorsqu’il est activé ou actif, ce qui le rend facilement accessible pour la navigation au clavier tout en restant discret lorsqu’il n’est pas utilisé.

Ouvrir

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.

Ouvrir