Alert Messages 구성 요소

블로그/콘텐츠 소비를 위해 설계된 반응형 스큐어모픽 경고 메시지 구성 요소로, 보색 구성표와 어두운 테마 지원을 특징으로 합니다.

미리 보기

HTML 코드

<div class="max-w-md mx-auto p-4 bg-gray-100 dark:bg-gray-800 rounded-lg shadow-lg">
    <div class="flex items-center mb-4">
        <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full mr-3">
        <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Alert Title</h2>
    </div>
    <p class="text-gray-700 dark:text-gray-300">
        This is a simple alert message that mimics real-world alert styles, using complementary colors for the design.
    </p>
    <div class="mt-4 flex justify-end">
        <img src="https://picsum.photos/150/50?random" alt="Illustration" class="rounded-md shadow-md">
    </div>
</div>

관련 구성 요소

Marketplace 경고 메시지 구성 요소

머티리얼 디자인에서 영감을 받은 경고 메시지 구성 요소는 마켓플레이스 플랫폼에 적합한 가을 색상으로 표시됩니다. 다양한 경고 유형(성공, 경고, 오류, 정보)을 무시할 수 있는 옵션과 다크 모드 지원을 제공합니다.

열다

Alert Messages 구성 요소

Tailwind CSS를 사용하여 3D 디자인, 반응형 기능 및 어두운 테마를 지원하는 Alert Messages 구성 요소입니다. 구성 요소에는 아이콘과 메시지가 있는 다양한 경고 유형(성공, 오류, 경고, 정보)이 포함됩니다.

열다

Corporate_Professional_Alert_Messages

비즈니스 또는 포트폴리오 환경에 적합한 깔끔하고 신뢰할 수 있는 경고 메시지 모음으로, 보석 색조 색상과 다크 모드를 지원하는 반응형 디자인을 특징으로 합니다. 정보, 성공, 경고 및 오류 경고를 포함합니다.

열다