The following props are available for navbar component. These are the custom props that come with we've added for the navbar component and you can use all the other native props as well.
| Attribute | Type | Description | Default |
|---|---|---|---|
variant | Variant | Change navbar variant | filled |
color | Color | Change navbar color | white |
shadow | boolean | Add box-shadow for navbar | true |
blurred | boolean | Add blur backdrop effect for navbar and makes it's background color white | true |
fullWidth | boolean | Change navbar to a block level element and remove its border radius | false |
className | string | Add custom className for navbar | '' |
children | node | Add content for navbar | No default value it's a required prop. |
import type { NavbarProps } from "@material-tailwind/react";The following props are available for mobile nav component. These are the custom props that come with we've added for the mobile nav component and you can use all the other native props as well.
| Attribute | Type | Description | Default |
|---|---|---|---|
open | boolean | If true the mobile nav will expand | true |
animate | Animate | Change mobile nav animation | undefined |
className | string | Add custom className for mobile nav | '' |
children | node | Add content for mobile nav | No default value it's a required prop. |
import type { MobileNavProps } from "@material-tailwind/react";type variant = "filled" | "gradient";type color =
| "transparent"
| "white"
| "blue-gray"
| "gray"
| "brown"
| "deep-orange"
| "orange"
| "amber"
| "yellow"
| "lime"
| "light-green"
| "green"
| "teal"
| "cyan"
| "light-blue"
| "blue"
| "indigo"
| "deep-purple"
| "purple"
| "pink"
| "red";type animate = {
mount?: object;
unmount?: object;
};