# Menu

Under the Menu tab of the header, colors, font styles, and other text-related parameters of the menu items of the Header part can be customized:

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FcapmNOC4OLUlS7FBjtt4%2Fimage.png?alt=media&#x26;token=64700baa-79bd-4a02-9064-210fb98e5d20" alt=""><figcaption><p>Menu Items on the Classic Layout</p></figcaption></figure>

{% hint style="success" %}
The tab is available and the same for all [Header Layouts](https://docs.stylemixthemes.com/motors-car-dealer-classifieds-and-listing/motors-skins/theme-options/main#header-layout) **except Header Footer Elementor.**
{% endhint %}

Here is the overview of the tab:

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FlTyo6Tec0AostxKjflHW%2Fimage.png?alt=media&#x26;token=57b93b72-ed09-4fb7-b035-6357074a5d81" alt=""><figcaption></figcaption></figure>

## Main Menu Font Settings

Customize the typography settings for the main navigation menu.

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FYHD9stSI8MkxIYsUxTqA%2Fimage.png?alt=media&#x26;token=72633f74-3fca-4a0f-82d1-658fc8883443" alt=""><figcaption></figcaption></figure>

* **Font Family** – Choose the main font family for the menu items.
* **Backup Font Family** – Select a backup font family to ensure compatibility.
* **Font Weight & Style** – Set the font weight and style for the main menu (e.g., Bold 700).
* **Font Subsets** – Select font subsets to support different character sets (e.g., Latin).
* **Text Align** – Set the text alignment for menu items (e.g., Left).
* **Font Size** – Define the font size for menu items in pixels.
* **Line Height** – Set the line height for menu items in pixels.
* **Word Spacing** – Adjust the space between words in menu items.
* **Letter Spacing** – Adjust the space between letters in menu items.
* **Text Transform** – Apply text transformation (e.g., Uppercase, Capitalize).

## SubMenu Font Family

Customize the typography settings specifically for submenu items:

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FR46mBHonIRiLEY9RRpZx%2Fimage.png?alt=media&#x26;token=957afbb7-1cc0-470e-a098-95049f556800" alt=""><figcaption></figcaption></figure>

Here are the available settings:

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FdqTr3EFqFGB0hcwg3DvX%2Fimage.png?alt=media&#x26;token=decbcba3-cff7-4076-8abf-b209d15cfa85" alt=""><figcaption></figcaption></figure>

* **Font Family** – Select the font family for submenu items.
* **Backup Font Family** – Choose a backup font for submenu items.

## Desktop Menu Settings

Adjust the appearance and behavior of the desktop version of the menu.

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2F84FiONefctbLURiMcsI1%2Fimage.png?alt=media&#x26;token=71cf2dc3-7617-4fc7-8a75-2d423f2fb02b" alt=""><figcaption></figcaption></figure>

* **Spacing Between Menu Items** – Set the space between top-level menu items (e.g., 20 pixels).
* **Item Text Color** – Choose the color for the default menu item text.
* **Hover Item Text Color** – Set the text color when a menu item is hovered over.
* **Hover Item Underline Color** – Choose the underline color for a menu item on hover.
* **Active Item Text Color** – Set the text color for the currently active menu item.
* **Active Item Underline Color** – Set the underline color for the active menu item.
* **Submenu Background Color** – Define the background color for submenu dropdowns.
* **Submenu Item Hover Background Color** – Set the background color for submenu items when hovered.
* **Submenu Item Text Color** – Choose the text color for submenu items.
* **Submenu Item Hover Text Color** – Set the text color for submenu items on hover.

## Mobile Menu Settings

<div><figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FacxDxrm1d5ZyO3926gaJ%2Fimage.png?alt=media&#x26;token=fe8acf68-9d1e-4414-b270-21c52f968397" alt=""><figcaption></figcaption></figure> <figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FnzwVG3VS2RclsoUbXtde%2Fimage.png?alt=media&#x26;token=5bcb1bfe-ab55-43a2-85de-db6f921403c5" alt=""><figcaption></figcaption></figure></div>

Configure the appearance of the mobile navigation menu.

<figure><img src="https://3691894799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhdEQqDAl80vVzOxJm8Us%2Fuploads%2FDB7ba1QGfmknQPmO1Urq%2Fimage.png?alt=media&#x26;token=6533d06d-7dcd-4c19-a491-b114c7ded8fc" alt=""><figcaption></figcaption></figure>

* **Menu Background Color** – Set the background color for the entire mobile menu.
* **Menu Item Background Color** – Choose the background color for individual mobile menu items.
* **Menu Item Text Color** – Define the text color for mobile menu items.
* **SubMenu Item Background Color** – Set the background color for mobile submenu items.
* **SubMenu Item Text Color** – Choose the text color for mobile submenu items.