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

# NavigationMenuIndicator

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

> Animated indicator container that lines up the arrow between the trigger and open panel.

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

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/NavigationMenuIndicator.md#theme-key-NavigationMenuIndicator-root) | 2 classes | Animated indicator container that lines up the arrow between the trigger and open panel. |
| [arrow](/v3/reference/theming/keys/NavigationMenuIndicator.md#theme-key-NavigationMenuIndicator-arrow) | `bg-popover border-l-hairline border-t-hairline relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm` | Rotated popover-colored arrow for navigation-menu content. |

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

## root

> Animated indicator container that lines up the arrow between the trigger and open panel.

Default classes:

```text
data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in
top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden
```

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

<a id="theme-key-NavigationMenuIndicator-arrow"></a>

## arrow

> Rotated popover-colored arrow for navigation-menu content.

Default classes:

`bg-popover border-l-hairline border-t-hairline relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm`

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