Feedback Component

Skeuomorphism-inspired feedback component featuring an analogous color scheme for a dashboard. Designed to be simple, responsive, and supports dark mode using Tailwind CSS. Utilizes shadcn/ui for enhanced styling and components.

Preview

HTML Code

<div class="bg-gray-200 dark:bg-gray-800 p-6 rounded-lg shadow-xl">
  <div class="flex items-center mb-4">
    <img class="w-12 h-12 rounded-full mr-4" src="https://randomuser.me/api/portraits/men/32.jpg" alt="User Avatar">
    <div>
      <h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">John Doe</h3>
      <p class="text-sm text-gray-600 dark:text-gray-400">Financial Analyst</p>
    </div>
  </div>
  <p class="text-gray-700 dark:text-gray-300 mb-4">
    The new dashboard features are excellent! The data visualization is clear and concisely presented, making it much easier to track key metrics. The performance has also improved significantly.
  </p>
  <div class="flex items-center text-yellow-500">
    <svg class="w-5 h-5 mr-1" fill="currentColor" viewBox="0 0 20 20">
      <path d="M10 15l-5.878 3.09 1.123-6.545L.489 6.309l6.572-.955L10 0l2.939 5.354 6.572.955-4.756 4.936 1.123 6.545z"/>
    </svg>
    <span>4.5</span>
  </div>
</div>

Related Components

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.

Open

Feedback Components Component

A brutalist-style feedback component with a pastel color scheme, moderate complexity, and responsive design with dark theme support. Designed for a portfolio to showcase feedback or testimonials.

Open

Feedback Component

A responsive feedback component designed for dark mode with vibrant colors, ideal for blog and content consumption.

Open