Table of Contents
Table of Contents Component with Microinteractions design, Analogous color scheme, Simple complexity, and Social Media purpose. Responsive with dark theme support. No JavaScript code.
HTML Code
<nav class="p-4 bg-gray-100 dark:bg-gray-800">
<ul class="space-y-2">
<li><a href="#section1" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 1</a></li>
<li><a href="#section2" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 2</a></li>
<li><a href="#section3" class="block py-2 px-4 text-gray-700 hover:bg-gray-200 dark:text-gray-300 dark:hover:bg-gray-700 transition duration-300 ease-in-out transform hover:scale-105">Section 3</a></li>
</ul>
</nav>Related Components
Table of Contents Component
Responsive Table of Contents component with Skeuomorphism design, Pastel color scheme, and dark mode support, suitable for portfolios.
Table of Contents Component
A responsive Table of Contents component designed with skeuomorphic elements and earth tones for a portfolio showcase, with dark mode support.
Table of Contents Component
A responsive Table of Contents component designed in Dark Mode UI style, featuring sections, titles, descriptions, and random images/avatars.