Composants de visualisation de données
Composants de visualisation de données de style Neumorphism pour un portefeuille avec prise en charge du thème sombre
HTML Code
<div class="bg-gray-300 dark:bg-gray-800 p-6 rounded-lg shadow-md">
<h2 class="text-gray-800 dark:text-gray-200 text-2xl font-semibold mb-4">Data Visualization</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<!-- Chart Component -->
<div class="bg-white dark:bg-gray-700 p-4 rounded-lg shadow-lg transition-shadow hover:shadow-xl">
<h3 class="text-gray-900 dark:text-gray-100 font-bold mb-2">Sales Analytics</h3>
<img src="https://picsum.photos/400/200?random=1" alt="Sales Chart" class="rounded-md" />
<p class="text-gray-600 dark:text-gray-400 mt-2">An overview of sales performance over the last year.</p>
</div>
<!-- Chart Component -->
<div class="bg-white dark:bg-gray-700 p-4 rounded-lg shadow-lg transition-shadow hover:shadow-xl">
<h3 class="text-gray-900 dark:text-gray-100 font-bold mb-2">User Engagement</h3>
<img src="https://picsum.photos/400/200?random=2" alt="User Engagement Chart" class="rounded-md" />
<p class="text-gray-600 dark:text-gray-400 mt-2">Statistics related to user interaction across different platforms.</p>
</div>
<!-- Profile Component -->
<div class="bg-white dark:bg-gray-700 p-4 rounded-lg shadow-lg transition-shadow hover:shadow-xl col-span-1 md:col-span-2">
<h3 class="text-gray-900 dark:text-gray-100 font-bold mb-2">Team Profile</h3>
<div class="flex items-center mb-3">
<img src="https://randomuser.me/api/portraits/women/44.jpg" alt="Team Member" class="w-12 h-12 rounded-full mr-3" />
<div class="text-gray-900 dark:text-gray-100">
<p class="font-semibold">Jane Doe</p>
<p class="text-gray-600 dark:text-gray-400">Data Scientist</p>
</div>
</div>
<p class="text-gray-600 dark:text-gray-400">Jane specializes in data analysis and machine learning, with over 5 years of experience.</p>
</div>
</div>
</div>Composants associés
Composant de visualisation des données (néon/lueur)
Un composant complexe de visualisation de données pour les applications SaaS avec des effets de néon/lueur, des couleurs neutres chaudes et une réactivité totale avec prise en charge du mode sombre.
Composante Visualisation de Données - Agriculture Industrielle
Un composant de visualisation de données à l’esthétique industrielle et brute, utilisant une palette de couleurs violet/violet, adapté à l’agriculture et aux sites Web agricoles. Il affiche les indicateurs clés dans une mise en page réactive avec prise en charge du mode sombre.
Composants de visualisation de données
Composant Web pour la visualisation de données à l’aide du style Material Design avec Tailwind CSS, avec des mises en page réactives, la prise en charge des thèmes sombres et des images d’espace réservé.