Saltar al componente de enlace de contenido
Un componente de enlace Saltar al contenido diseñado con elementos 3D, tonos tierra y adaptado a las interfaces del panel de control. Incluye estilos para temas claros y oscuros.
Código HTML
<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>
Componentes relacionados
Saltar al componente de enlace de contenido
Un componente web que proporciona un enlace para saltar al contenido principal, con estilo Material Design con un esquema de color pastel, adecuado para sitios web de comercio electrónico. Cuenta con un diseño responsivo con soporte para temas oscuros.
Saltar al componente de enlace de contenido
Un componente de enlace limpio y minimalista de "saltar al contenido" para aplicaciones de deportes/fitness, diseñado con un esquema de color en escala de grises. Es responsivo y admite el modo oscuro, enfatizando la tipografía y la accesibilidad.
Saltar al componente de enlace de contenido
Un componente de enlace simple y receptivo 'Saltar al contenido' con un estilo artístico / acuarela, un esquema de color triádico y elementos temáticos de agricultura / ganadería, que admite el modo oscuro.