反馈组件

拟物化启发的反馈组件,具有仪表板的类似配色方案。设计简单、响应迅速,并支持使用 Tailwind CSS 的深色模式。利用 shadcn/ui 增强样式和组件。

预览

HTML 代码

<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>

相关组件

Feedback Components 组件

用于仪表板的复杂、响应式、支持深色主题的反馈组件组件,采用极简/扁平美学和柔和的配色方案设计。它显示各种反馈元素,例如进度条、状态指示器和最近的活动,仅将 HTML 与 Tailwind CSS 类结合使用。

打开

Vibrant_Dark_Mode_Feedback_Component

一个简单、充满活力的反馈组件,专为娱乐/媒体平台设计,具有深色模式 UI,可减轻眼睛疲劳。它具有醒目的标题、子描述和行动号召按钮,所有这些都是完全响应式的。

打开

反馈组件

一个反馈组件,具有评分刻度和评论文本区域,采用响应式设计,支持暗黑主题。

打开