메인 메뉴

메인 메뉴는 사용자가 서비스의 정보 구조를 탐색할 때, 가장 많이 사용하는 유형의 메뉴이다.

메인 메뉴는 사용자가 서비스의 정보 구조를 탐색할 때, 가장 많이 사용하는 유형의 메뉴이다.

사용 지침

헤더 내부에 배치해 데스크톱에서는 가로 형태로, 모바일에서는 햄버거 버튼으로 펼쳐 보이도록 반응형으로 구성하고, 현재 위치를 시각적으로 강조해 사용자에게 컨텍스트를 제공합니다.

예제

Default

examples/main-menu/MainMenuDefault.tsx
import { MainMenu, MainMenuBar, MainMenuBarItem } from "@/components/ui/dynamic/main-menu"

export default function MainMenuDefault() {
examples/main-menu/MainMenuWithPanel.tsx
import {
  MainMenu,
  MainMenuBar,

속성

이름타입기본값설명
classNamestring——