SkeuomorphismChartsComponent
Skeuomorphic Charts Component for Social Media with Complementary Colors
HTML Code
<div class="p-6 bg-gradient-to-br from-gray-200 to-gray-300 rounded-lg shadow-xl dark:from-gray-700 dark:to-gray-800">
<h2 class="text-xl font-bold mb-4 text-gray-800 dark:text-white">Activity Chart</h2>
<div class="relative h-48">
<canvas id="myChart" class="w-full h-full"></canvas>
</div>
<div class="flex justify-around mt-4 text-gray-600 dark:text-gray-300 text-sm">
<span>Likes</span>
<span>Comments</span>
<span>Shares</span>
<span>Views</span>
</div>
</div>Related Components
Glassmorphism Sales Chart
A simple, responsive chart component with a Glassmorphism style, vibrant color scheme, and dark mode support, suitable for e-commerce dashboards.
Charts Component
A responsive dashboard component demonstrating skeuomorphic design with pastel colors and dark mode support, featuring simulated bar charts, line charts, and key performance indicators using pure HTML and Tailwind CSS. No JavaScript is included; charts are visual representations.
Charts Component
A responsive charts component designed in skeuomorphism style with a grayscale color scheme and dark mode support, ideal for e-commerce applications.