Componentes Barra de progreso Barra de progreso Earthy de Material Design

Barra de progreso Earthy de Material Design

Una barra de progreso inspirada en Material Design con tonos tierra, adecuada para interfaces de redes sociales. Es responsivo e incluye soporte para el modo oscuro usando Tailwind CSS.

Vista previa

Código HTML

<div class="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-2.5">
  <div class="bg-green-700 h-2.5 rounded-full dark:bg-green-500" style="width: 45%"></div>
</div>

Componentes relacionados

Barra de progreso neo-retro de Cyberpunk

Un componente de barra de progreso de complejidad moderada con una estética cyberpunk, neo-retro, fondos oscuros y colores de acento vintage apagados, diseñado para plataformas de entretenimiento/medios. Cuenta con una pantalla de progreso segmentada y es totalmente sensible con soporte para el modo oscuro.

Abrir

Componente de la barra de progreso

Un componente de barra de progreso receptivo diseñado para el modo oscuro con una combinación de colores pastel, adecuado para sitios web comerciales / corporativos.

Abrir

Barra de progreso del modo oscuro triádico

Un componente de barra de progreso simple y de color triádico para el modo oscuro, adecuado para blogs y consumo de contenido. Cuenta con un diseño responsivo con Tailwind CSS, utilizando el prefijo dark: para el soporte de temas oscuros sin JavaScript.

Abrir