Navigation & menus
Lexend Deca drives all menu treatments. These styles cover header links, mega menus, and mobile drawers.
Desktop header & mega menu
Full-width navigation at ≥1024px.
| Style name | Font | Size & line | Weight | Use cases | Live pages |
|---|---|---|---|---|---|
Top-level link | Lexend Deca, variable | Sm (14px) 1.5 line height with tight tracking | Medium | Platform, Solutions, Story, and other global links. | |
Mega menu title | Lexend Deca, variable | Base (16px) tight line height | Medium | Platform feature names and solution categories. | |
Mega menu caption | Lexend Deca, variable | Sm (14px) relaxed line height | Regular | Short descriptors beneath each mega-menu item. |
Tablet navigation
Hybrid hover/click header with condensed dropdowns.
| Style name | Font | Size & line | Weight | Use cases | Live pages |
|---|---|---|---|---|---|
Top-level link | Lexend Deca, variable | Sm (14px) 1.5 line height with tight tracking | Medium | Primary header entries at tablet widths. | |
Drawer or dropdown title | Lexend Deca, variable | Base (16px) tight line height | Medium | Platform and Solutions headers inside the tablet flyout. | |
Drawer caption | Lexend Deca, variable | Sm (14px) relaxed line height | Regular | Secondary descriptions under flyout items. |
Mobile navigation
Single-column sheet menu for small screens.
| Style name | Font | Size & line | Weight | Use cases | Live pages |
|---|---|---|---|---|---|
Top-level button | Lexend Deca, variable | Base (16px) 1.5 line height | Medium | Main list items inside the mobile sheet. | |
Section header | Lexend Deca, variable | 11px uppercase with 0.14em tracking | Medium | Uppercase headers inside nested mobile menus. | |
Section caption | Lexend Deca, variable | Sm (14px) relaxed line height | Regular | Helper text beneath mobile menu items. |