Componentes Navegación de migas de pan Componente de navegación de ruta de navegación

Componente de navegación de ruta de navegación

Componente de navegación de migas de pan con diseño retro / vintage, combinación de colores vibrantes y nivel de complejidad simple, para fines de blog / contenido.

Vista previa

Código HTML

<nav class="flex" aria-label="Breadcrumb">
  <ol class="inline-flex items-center space-x-1 md:space-x-3">
    <li class="inline-flex items-center">
      <a href="#" class="text-sm font-medium text-purple-700 hover:text-purple-900 dark:text-purple-400 dark:hover:text-white">
        Home
      </a>
    </li>
    <li>
      <div class="flex items-center">
        <svg class="w-4 h-4 text-purple-500" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10l-3.293-3.293a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
        <a href="#" class="ml-1 text-sm font-medium text-purple-700 hover:text-purple-900 md:ml-2 dark:text-purple-400 dark:hover:text-white">Articles</a>
      </div>
    </li>
    <li aria-current="page">
      <div class="flex items-center">
        <svg class="w-4 h-4 text-purple-500" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10l-3.293-3.293a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
        <span class="ml-1 text-sm font-medium text-purple-500 md:ml-2 dark:text-gray-500">This Article</span>
      </div>
    </li>
  </ol>
</nav>

Componentes relacionados

Bauhaus_Music_Breadcrumb

Un sencillo componente de navegación de migas de pan inspirado en la Bauhaus para plataformas de música/audio, con tonos azules corporativos y capacidad de respuesta total con soporte para modo oscuro.

Abrir

Migas de pan deportivas neumórficas

Un componente de navegación de migas de pan complejo y neumórfico diseñado para aplicaciones deportivas / fitness, con ricos tonos joya y capacidad de respuesta total con soporte para modo oscuro.

Abrir

Earth_Tones_Gradient_Breadcrumb_Navigation

Un componente de navegación de migas de pan complejo y receptivo diseñado para sitios web de noticias/periodismo, con transiciones de degradado terroso y soporte completo para el modo oscuro.

Abrir