Composant d’affichage des prix
Un composant d’affichage du prix minimaliste/plat pour une utilisation sur le tableau de bord, avec un design réactif et une prise en charge du mode sombre.
HTML Code
<div class="bg-white dark:bg-gray-800 shadow-md rounded-lg p-6 max-w-xs mx-auto">
<h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-4">Price Overview</h2>
<div class="flex items-center justify-between mb-4">
<span class="text-lg font-semibold text-gray-700 dark:text-gray-300">Current Price</span>
<span class="text-2xl font-extrabold text-blue-500 dark:text-blue-300">$99.99</span>
</div>
<div class="flex items-center justify-between">
<img src="https://picsum.photos/50/50?random=1" alt="Product Image" class="rounded-full">
<div>
<span class="text-sm text-gray-600 dark:text-gray-400">Last updated: 2 hours ago</span>
</div>
</div>
<button class="mt-4 w-full bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline dark:bg-blue-600 dark:hover:bg-blue-500">View Details</button>
</div>Composants associés
Composant d’affichage des prix
Un composant d’affichage des prix inspiré de la 3D avec une palette de couleurs monochromatiques, conçu pour les interfaces de médias sociaux. Il s’agit d’un composant complexe et réactif avec prise en charge du mode sombre, construit à l’aide de Tailwind CSS. Aucun JavaScript n’est inclus.
Composant d’affichage des prix
Un composant d’affichage de prix minimal avec prise en charge du mode réactif et sombre
Cyberpunk Composant d’affichage des prix
Un composant d’affichage de prix réactif pour le conseil/les services avec une esthétique néon cyberpunk et futuriste. Dispose d’arrière-plans sombres, de couleurs d’accentuation analogues lumineuses et prend en charge le mode sombre.