CCHub Logo CCHub Tailwind Collection
구성 요소 피드백 구성 요소 Feedback Components 구성 요소

Feedback Components 구성 요소

그레이스케일 색상, 다크 모드 지원 및 반응형 디자인을 갖춘 간단한 브루탈리스트 피드백 구성 요소입니다.

미리 보기

HTML 코드 

<div class="max-w-md mx-auto my-8 bg-white dark:bg-gray-900 shadow-lg border-2 border-black dark:border-gray-700 p-6">
  <h2 class="text-2xl font-bold text-black dark:text-white mb-4 border-b-2 border-black dark:border-gray-700 pb-2">Feedback</h2>
  <div class="mb-4">
    <div class="flex items-center mb-2">
      <img src="https://www.randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-10 h-10 rounded-full border-2 border-black dark:border-gray-700 mr-4">
      <p class="font-bold text-black dark:text-white">John Doe</p>
    </div>
    <div class="bg-gray-100 dark:bg-gray-800 border-2 border-black dark:border-gray-700 p-4">
      <p class="text-black dark:text-gray-300">"This article was incredibly insightful and well-written. I appreciate the clear explanations."</p>
    </div>
  </div>
  <div class="mb-4">
    <div class="flex items-center mb-2">
      <img src="https://www.randomuser.me/api/portraits/women/2.jpg" alt="Avatar" class="w-10 h-10 rounded-full border-2 border-black dark:border-gray-700 mr-4">
      <p class="font-bold text-black dark:text-white">Jane Smith</p>
    </div>
    <div class="bg-gray-100 dark:bg-gray-800 border-2 border-black dark:border-gray-700 p-4">
      <p class="text-black dark:text-gray-300">"I found a minor typo on page 3, but overall, a fantastic read!"</p>
    </div>
  </div>
  <div class="text-right">
    <button class="bg-black dark:bg-gray-700 text-white dark:text-gray-300 px-6 py-2 border-2 border-black dark:border-gray-700 font-bold hover:bg-gray-800 dark:hover:bg-gray-600">
      Give Feedback
    </button>
  </div>
</div>

관련 구성 요소

Feedback Components 구성 요소

비즈니스/기업 웹 사이트를 위한 복잡하고 반응이 빠른 피드백 및 평가 섹션으로, 다크 모드 UI와 파스텔 색상 구성표로 설계되었습니다. 추천서, 문의 양식 및 평가 표시와 같은 여러 대화형 요소가 포함되어 있습니다.

열다

스큐어모픽 피드백 컴포넌트 (Simple, Earth Tones)

대시보드를 위한 간단한 스큐어모픽 피드백 구성 요소로, 흙색을 사용하고 실제 요소를 모방하도록 설계되었습니다. 다크 모드 지원으로 완벽하게 반응합니다.

열다

Luxury_Premium_Vibrant_Simple_Food_Restaurant_Feedback_Component

음식/레스토랑 웹사이트를 위한 간단하고 우아한 피드백 구성 요소로, 생동감 넘치는 채도가 높은 색 구성표와 다크 모드를 지원합니다. 고급스러움/프리미엄 느낌을 위해 설계되었습니다.

열다