내비게이션 바블록
사이트용 내비게이션 바와 메뉴. 네오브루탈리즘 스타일의 바로 쓰는 React UI 블록입니다. 히어로, 가격, 인증, 대시보드 등. 모든 화면 크기를 미리 보고, 코드를 복사하거나 MCP 서버를 통해 AI 에이전트로 설치할 수 있습니다. Radix UI, Base UI, React Aria와 함께 동작합니다.
- Hero, 가격 & 인증
- 모든 중단점을 미리 보기
- 소스 복사하기
- MCP 설치 준비 완료
- Radix · Base UI · React Aria
- 158 기성 블록
- 제공되는 페이지 섹션
- 대시보드 및 마케팅
- Pro 암호를 해제합니다
- 드롭인 레이아웃
모든 레이아웃 보기
내비게이션 바
8 블록 — 아무 카드나 클릭하여 전체 화면 미리보기, 코드 및 설치 단계 확인.
- 01Pro
드로어가 있는 계정 내비바
전체 높이 셀로 이루어진 로그인 레일이 워드마크, 카운터, 아바타, 로그아웃을 담으며, md 아래에서는 React와 Tailwind 드로어가 됩니다. 사이드바가 이끌게 하세요.
- 02Pro
가운데 로고 메가 메뉴 내비바
가운데 정렬된 두 줄짜리 워드마크가 두 개의 행동 유도 요소 사이에 있고, 메뉴는 전체 너비의 React와 Tailwind 링크 패널을 엽니다. 브랜드를 주인공으로 만드세요.
- 03Pro
연락처 바 내비바
브랜드 색상 띠가 전화번호, 이메일 주소, 소셜 아이콘 네 개를 React와 Tailwind 링크 바 위에 담습니다. 번호를 탭 가능하게 만드세요.
- 04Pro
드롭다운이 있는 대시보드 내비바
키보드로 접근 가능한 드롭다운 두 개, 종 아이콘, 테마 토글, 아바타가 떠 있는 React와 Tailwind 카드 바 위에 있습니다. lg 아래에서는 패널이 아코디언이 됩니다.
- 05Pro
검색이 있는 이커머스 내비바
실제로 제출되는 검색 폼과 실시간 장바구니 개수가 이 React와 Tailwind 쇼핑몰 바를 지탱하며, 계정과 주문 링크가 있습니다. 쿼리 라우트를 연결하세요.
- 06Pro
인증 버튼이 있는 미니멀 내비바
워드마크, 링크 네 개, Log in과 Sign up 쌍이 있으며, md 아래에서는 변형하는 햄버거가 됩니다. React와 Tailwind. 마케팅 사이트를 여기서 시작하세요.
- 07Pro
메가 메뉴가 있는 박물관 내비바
Collections가 반전된 React와 Tailwind 사이니지 바 아래에서 이미지 중심 카드 680px 메가 메뉴를 엽니다 — 넓은 카드 두 개와 세로형 카드 두 개. 방문을 파세요.
- 08Pro
티커가 있는 포트폴리오 내비바
스크롤되는 공지 티커가 페이지 내 앵커 링크가 있는 전체 높이 테두리 셀 바 위에 놓입니다. React와 Tailwind. 공지 세 개를 수정하세요.