组件 汉堡菜单 粗犷汉堡菜单

粗犷汉堡菜单

野兽派风格的汉堡菜单,具有鲜艳的色彩和深色模式支持,专为博客或内容网站设计。

预览

HTML 代码

<div class="bg-yellow-400 dark:bg-purple-700 p-4 flex justify-between items-center">
  <h1 class="text-2xl font-bold text-black dark:text-white">Brutal Blog</h1>
  <button class="text-black dark:text-white focus:outline-none">
    <svg class="h-6 w-6 fill-current" viewBox="0 0 24 24">
      <path fill-rule="evenodd" clip-rule="evenodd" d="M4 5h16v2H4V5zm0 6h16v2H4v-2zm0 6h16v2H4v-2z"/>
    </svg>
  </button>
</div>

相关组件

汉堡菜单组件

一个为社交媒体界面设计的响应式汉堡菜单,具有暗模式主题和互补色方案。

打开

Glassmorphism 汉堡菜单

一个简单、响应式的汉堡菜单组件,具有 Glassmorphism 设计、互补配色方案和深色模式支持。

打开

汉堡菜单组件

一个复杂、响应迅速且充满活力的汉堡菜单组件,具有用于电子商务的微交互,具有滑出式导航、类别链接、搜索栏和社交媒体图标。它支持暗模式并使用 Lorem Picsum 进行图像处理。

打开