---
url: "https://vueda.dev/v3/reference/theming/keys/NavigationMenuTrigger.md"
title: "NavigationMenuTrigger"
---

# NavigationMenuTrigger

Source: `client/lib/theme/vueda-tailwind/navigation/index.js`

> Header-scale trigger. It intentionally uses a 36px height and half-strength active fill.

Vue component: [NavigationMenuTrigger](/v3/reference/api/vue/NavigationMenuTrigger.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/NavigationMenuTrigger.md#theme-key-NavigationMenuTrigger-root) | 4 classes | Header-scale trigger. It intentionally uses a 36px height and half-strength active fill. |

<a id="theme-key-NavigationMenuTrigger-root"></a>

## root

> Header-scale trigger. It intentionally uses a 36px height and half-strength active fill.

Default classes:

```text
group inline-flex h-9 w-max items-center justify-center rounded-vueda-control bg-background px-4 py-2 text-sm font-medium
hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground active:bg-accent-active active:text-accent-foreground
disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50
transition-colors focus-visible:focus-ring
```

Source: `client/lib/theme/vueda-tailwind/navigation/NavigationMenuTrigger.theme.js:16`