---
url: /api/css/menu.group.md
---
# CSS: menu.group

`.group` — A labelled group heading (InstUI `Menu.Group`/`Menu.ItemGroup`).

## Usage

```css
@import "@pantoken/components/components.css";
@import "@pantoken/components/menu.group.css";
```

## Tokens consumed

| Token | Type | Value |
| --- | --- | --- |
| `--instui-component-menu-group-background` | `<color>` | `light-dark(#ffffff, #171B21)` |
| `--instui-component-menu-group-color` | `<color>` | `light-dark(#273540, #ffffff)` |
| `--instui-component-menu-group-font-family` | `[ <font-family-name> \| <generic-font-family> ]#` | `Atkinson Hyperlegible Next, "Helvetica Neue", Helvetica, Arial, sans-serif` |
| `--instui-component-menu-group-font-size` | `<length>` | `1rem` |
| `--instui-component-menu-group-font-weight` | `<integer>` | `600` |
| `--instui-component-menu-group-padding-horizontal` | `<length>` | `0.75rem` |
| `--instui-component-menu-group-padding-vertical` | `<length>` | `0.5rem` |