---
title: "Creating styles for menus"
date: "2017-11-14T11:11:53+00:00"
summary: "Enhance your website's navigation with custom menu styles in Site Studio. Learn to use interactive classes and style helpers for visually appealing, user-friendly menus that improve site usability and engagement."
image:
type: "page"
url: "/drupal-starter-kits/add-ons/site-studio/creating-styles-menus"
id: "abfb9550-b9a2-4e16-a858-39189b16be52"
---

Use Custom list styles to affect both the appearance and interactivity of your menus. The following classes are applied to your menu list items when a user interacts with a menu link. You can use these classes to affect the appearance and display of your menu list items which content your menu links.

*   **is-active** - Is applied to the menu list item when the user is on the current link page
*   **has-children** - Is applied to the menu list item if the menu item, has children (sub-menus)
*   **is-expanded** \- Is applied to the menu list item if the menu item has children (sub-menus) and they are expanded
*   **is-collapsed** - Is applied to the menu list item if the menu has children (sub-menus) and they are collapsed
*   **in-active-trail** - Is applied to the menu list item if the menu item is within the active trail.

Menu style helpers
------------------

The process of creating a Custom list style for an interactive menu is quite complex unless you are an experienced front-end developer. For this reason, Site Studio includes a number of Style helpers for you to use to quickly create styles for different types of interactive menus. For information on how to use Style helpers, see [Using style helpers.](/drupal-starter-kits/add-ons/site-studio/creating-and-using-style-helpers "Using style helpers")