CCHub Logo CCHub Tailwind Collection
구성 요소 오류 메시지 오류 메시지 구성 요소

오류 메시지 구성 요소

Material Design 원칙을 사용하는 반응형 오류 메시지 구성 요소로, 트라이어드 색 구성표 및 다크 모드 지원을 통해 포트폴리오에 맞게 조정됩니다.

미리 보기

HTML 코드 

<div class="flex flex-col items-center justify-center p-5 bg-white rounded-lg shadow-md dark:bg-gray-800">
    <img src="https://picsum.photos/200/100" alt="Error Image" class="rounded-lg shadow-sm mb-4">
    <div class="text-center">
        <h2 class="text-lg font-bold text-red-600 dark:text-red-400">Error Occurred!</h2>
        <p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Oops! Something went wrong while trying to display the content.</p>
        <p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Please try again later or contact support.</p>
        <button class="mt-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-800">Retry</button>
    </div>
</div>

관련 구성 요소

오류 메시지 구성 요소 - 음식/레스토랑

음식/레스토랑 웹 사이트를 위한 종이/인쇄에서 영감을 받은 복잡한 트라이어딕 테마 오류 메시지 구성 요소로, 다크 모드를 지원하고 완전한 응답성을 제공합니다. 물리적 인쇄물을 시뮬레이션하는 여러 대화형 요소가 있습니다.

열다

오류 메시지 구성 요소

Tailwind CSS를 사용하여 잔인함 스타일로 설계된 반응형 오류 메시지 구성 요소로, 고대비, 특이한 레이아웃 및 다크 모드 지원을 특징으로 합니다.

열다

오류 메시지 구성 요소

대시보드용 glassmorphism 스타일의 오류 메시지 구성 요소로, 젖빛 유리 효과, 보색, 데이터 시각화 및 제어판에 적합한 복잡한 대화형 디자인을 특징으로 합니다.

열다