구성 요소 머리글 레트로헤더 컴포넌트

레트로헤더 컴포넌트

반응형 효과와 어두운 테마를 지원하는 Retro/Vintage 헤더 구성 요소.

미리 보기

HTML 코드

<header class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-white p-4">
  <div class="container mx-auto flex justify-between items-center">
    <div class="text-2xl font-bold">RetroHeader</div>
    <nav class="hidden md:flex space-x-4">
      <a href="#" class="hover:underline">Home</a>
      <a href="#" class="hover:underline">About</a>
      <a href="#" class="hover:underline">Contact</a>
    </nav>
    <div class="md:hidden">
      <button class="text-gray-800 dark:text-white focus:outline-none">
        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
      </button>
    </div>
  </div>
</header>

관련 구성 요소

헤더 구성 요소

마이크로 인터랙션과 생생한 색상이 있는 대시보드를 위한 반응형 헤더 구성 요소로, 어두운 테마를 지원합니다.

열다

헤더 구성 요소

3D 디자인, 파스텔 색 구성표, 복잡한 복잡성, 대시보드 목적, 반응형 디자인 및 어두운 테마 지원을 제공하는 Tailwind 헤더 구성 요소

열다

레트로 빈티지 헤더 구성 요소

레트로/빈티지 스타일의 반응형 헤더 구성 요소로, 어두운 테마를 지원하는 대시보드에 맞게 조정됩니다.

열다