구성 요소 성공 메시지 Success Messages 구성 요소

Success Messages 구성 요소

성공 메시지 구성 요소: Neumorphism 디자인, 반응형 및 어두운 테마 지원

미리 보기

HTML 코드

<div class="flex items-center justify-center h-screen dark:bg-gray-900">
  <div class="bg-gray-200 p-6 rounded-xl shadow-xl s Neumorphism dark:bg-gray-800">
    <div class="text-green-500 text-2xl mb-4">
      <svg xmlns="http://www.w3.org/2000/svg" class="h-10 w-10" fill="none" viewBox="0 0 24 24" stroke="currentColor">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
      </svg>
    </div>
    <h3 class="text-xl font-semibold mb-2 dark:text-white">Success!</h3>
    <p class="text-gray-600 dark:text-gray-300">Your action was performed successfully.</p>
  </div>
</div>

관련 구성 요소

Success Messages 구성 요소

Tailwind CSS를 사용하여 스큐어모픽 스타일로 설계된 반응형 성공 메시지 구성 요소로, 어두운 테마 지원을 제공합니다.

열다

Success Messages 구성 요소

반응형 Success Messages 구성 요소는 생생한 색 구성표와 함께 다크 모드를 위해 설계되었으며, 포트폴리오에서 작업을 보여주는 데 이상적입니다.

열다

성공 메시지 구성 요소 17

반응형 효과와 어두운 테마 지원을 특징으로 하는 Tailwind CSS로 디자인된 대담하고 생생한 성공 메시지 구성 요소입니다.

열다