Composant Graphiques
Un composant de graphiques simple et minimaliste avec des effets réactifs et une prise en charge du thème sombre.
HTML Code
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-4">
<h2 class="text-lg font-semibold mb-4 text-gray-800 dark:text-white">Sales Performance</h2>
<div class="flex justify-between items-center mb-4">
<div class="text-sm text-gray-500 dark:text-gray-400">Last 30 Days</div>
<select class="text-sm text-gray-500 dark:text-gray-400 bg-transparent border-none">
<option>Monthly</option>
<option>Weekly</option>
<option>Daily</option>
</select>
</div>
<div class="h-40">
<!-- Placeholder for chart -->
<div class="flex items-end h-full">
<div class="w-1/6 bg-blue-500 h-3/4 rounded-t dark:bg-blue-600"></div>
<div class="w-1/6 bg-blue-500 h-2/4 rounded-t dark:bg-blue-600 ml-1"></div>
<div class="w-1/6 bg-blue-500 h-1/4 rounded-t dark:bg-blue-600 ml-1"></div>
<div class="w-1/6 bg-blue-500 h-full rounded-t dark:bg-blue-600 ml-1"></div>
<div class="w-1/6 bg-blue-500 h-3/4 rounded-t dark:bg-blue-600 ml-1"></div>
<div class="w-1/6 bg-blue-500 h-2/4 rounded-t dark:bg-blue-600 ml-1"></div>
</div>
</div>
</div>Composants associés
Composant Graphiques
Un composant de graphiques complexe conçu pour les sites Web d’entreprise et d’entreprise, avec une conception 3D, une palette de couleurs complémentaire et une structure réactive avec prise en charge du mode sombre.
Composant Graphiques
Un composant de graphique simple et réactif avec des couleurs pastel et la prise en charge du mode sombre, conçu pour la consommation de blogs/contenus avec des micro-interactions subtiles via des effets de survol. Pas de JavaScript.
Composant Cartes neumorphes
Il s’agit d’un composant de graphiques complexe et réactif avec un style de conception neumorphique et une palette de couleurs analogue, adapté à un portfolio pour présenter des travaux ou des produits. Inclut la prise en charge du mode sombre.