Composant de la table des matières
Un composant de table des matières réactif conçu avec des éléments skeuomorphes et des tons de terre pour une vitrine de portfolio, avec prise en charge du mode sombre.
HTML Code
<div class="bg-gray-100 dark:bg-gray-800 p-6 rounded-lg shadow-md">
<h2 class="text-2xl font-semibold text-green-800 dark:text-green-200 mb-4">Table of Contents</h2>
<ul class="space-y-4">
<li class="bg-white dark:bg-gray-700 rounded-lg p-4 shadow-md transition duration-300 hover:shadow-lg">
<a href="#section1" class="text-gray-800 dark:text-gray-200 font-semibold">Section 1</a>
</li>
<li class="bg-white dark:bg-gray-700 rounded-lg p-4 shadow-md transition duration-300 hover:shadow-lg">
<a href="#section2" class="text-gray-800 dark:text-gray-200 font-semibold">Section 2</a>
</li>
<li class="bg-white dark:bg-gray-700 rounded-lg p-4 shadow-md transition duration-300 hover:shadow-lg">
<a href="#section3" class="text-gray-800 dark:text-gray-200 font-semibold">Section 3</a>
</li>
<li class="bg-white dark:bg-gray-700 rounded-lg p-4 shadow-md transition duration-300 hover:shadow-lg">
<a href="#section4" class="text-gray-800 dark:text-gray-200 font-semibold">Section 4</a>
</li>
</ul>
</div>Composants associés
Composant de la table des matières
Un composant de table des matières minimaliste et réactif doté d’un style CSS Tailwind, prenant en charge le mode sombre et présentant des éléments de conception épurés.
Composant de la table des matières
Un composant de table des matières réactif conçu dans le style Glassmorphism, avec des éléments translucides givrés ressemblant à du verre avec des effets de flou, prenant en charge les thèmes clairs et sombres avec Tailwind CSS.
Composant de la table des matières
Un composant de table des matières réactif avec un design glassmorphism et une palette de couleurs pastel, adapté aux tableaux de bord avec visualisation de données et panneaux de contrôle.