Feedback Component
A minimalist feedback component featuring responsive design, dark theme support, and no JavaScript. It includes an avatar, user feedback text, and ratings represented by stars.
HTML Code
<div class="max-w-md mx-auto p-6 bg-white rounded-lg shadow-md dark:bg-gray-800 transition-shadow duration-300 ease-in-out">
<div class="flex items-center mb-4">
<img class="w-12 h-12 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar">
<div class="ml-4">
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
<span class="text-gray-500 dark:text-gray-400 text-sm">2 hours ago</span>
</div>
</div>
<div class="mb-4">
<div class="flex items-center">
<span class="text-yellow-500">
📍📍📍📍📍
</span>
<span class="text-gray-500 dark:text-gray-400 ml-2">Rating: 4.5/5</span>
</div>
</div>
<p class="text-gray-700 dark:text-gray-300">
This is a sample feedback message from the user. It highlights the positive aspects and any areas for improvement.
</p>
<div class="mt-4">
<img class="rounded-md" src="https://picsum.photos/400/200" alt="Feedback Image">
</div>
</div>Related Components
Feedback Component
A responsive feedback component designed for social networking interfaces, incorporating 3D design elements in a grayscale color scheme with dark mode support, tailored for medium complexity and interactivity.
Feedback Component
A feedback component designed for social media interfaces, incorporating microinteractions and a grayscale color scheme, with dark theme support.
Feedback Component
A responsive feedback component designed with Material Design principles, incorporating earth tones and equipped for dark mode support. This component is specifically designed for dashboards and features various interactive elements.