Feedback-Komponente

Skeuomorphismus-inspirierte Feedback-Komponente mit einem analogen Farbschema für ein Dashboard. Entwickelt, um einfach und reaktionsschnell zu sein und den Dunkelmodus mit Tailwind CSS zu unterstützen. Verwendet shadcn/ui für verbesserte Formatierung und Komponenten.

Vorschau

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>

Verwandte Komponenten

Brutalistische Feedback-Komponente

Eine brutalistische Feedback-Komponente mit hohem Kontrast und plakativer Typografie.

Offen

Feedback-Komponente

Eine minimalistische Feedback-Komponente mit responsivem Design, Unterstützung für dunkle Themen und ohne JavaScript. Es enthält einen Avatar, einen Benutzerfeedback-Text und Bewertungen, die durch Sterne dargestellt werden.

Offen

Komponente "Feedback-Komponenten"

Minimalistische/flache Design-Feedback-Komponente für das Dashboard mit komplementärem Farbschema und moderater Komplexität, reaktionsschneller und dunkler Theme-Unterstützung. Verwendet HTML und Tailwind CSS. Kein JavaScript. Mit interaktiven Elementen. Bilder von picsum.photos und Avatare von randomuser.me.

Offen