Components
Loading preview...
CoreHeader – A sleek top navigation bar for dashboards and apps. Displays the page title, user identity, and avatar, with a subtle background pattern for a modern look.
@m.kumailalirajpoot
npx shadcn@latest add https://21st.dev/r/m.kumailalirajpoot/core-header-navbarimport { SimpleNavbar, SecondaryNavbar } from "@/components/ui/core-header-navbar";
import { useState } from "react";
export default function DemoOne() {
const [type, setType] = useState("react");
return (
<div className="w-full">
<SimpleNavbar
title="Dashboard"
userName="kumail 21st dev"
/>
<SecondaryNavbar
currentType={type}
onTypeChange={setType}
links={[
{ name: "React", href: "react" },
{ name: "Next.js", href: "nextjs" },
{ name: "Full Stack", href: "fullstack" },
{ name: "UI/UX", href: "uiux" },
]}
/>
</div>
);
}