> ## Content Index
> Fetch the complete content index at: https://blog.jestor.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# How to customize the top navigation bar style of the app
- URL: https://blog.jestor.com/customize-top-navigation-bar-style/
- Published: 2026-07-12T00:43:09.000Z
- Updated: 2026-07-12T00:43:09.000Z
- Author: Bruno Bannach

Top navigation bar style is the choice between different visual formats — rounded, icons only, text with colored selection — for the tabs at the top of the system. In Jestor, there are seven different options, with adjustable position and background color.

## The problem with a single fixed navigation style

A navigation bar with a single fixed style limits each app's visual identity, especially when different teams have distinct preferences on how to navigate between screens.

- **Rounded:** rounded-shape selection, with or without an icon.
- **Icons only:** a more minimalist look, no text.
- **Text with colored selection:** color highlight on the selected item.
- **Position:** centered or side-aligned, depending on the layout.

| Navigation style                | Characteristics                                  |
| ------------------------------- | ------------------------------------------------ |
| **Rounded**                     | Rounded-shape selection, with or without an icon |
| **Icons only**                  | A more minimalist look, no text                  |
| **Text with colored selection** | Color highlight on the selected item             |

## How to customize the top bar in Jestor

- **Open the top bar settings:** inside the app's build mode.
- **Choose from the seven style options:** rounded, icons, text, or contrast variations.
- **Position the bar:** centered or to the side.
- **Adjust the background color:** to match the app's visual identity.

**How to configure it in Jestor:** minimalist options work best when the focus should stay on the content; styles with prominent icons help teams that navigate between several screens frequently.

## Why choose Jestor to give each app a visual identity?

Seven style options may seem like overkill at first, but in practice they cover the main use cases — from dense data panels to more visual, customer-facing apps, each with the navigation style that fits.

## Frequently Asked Questions

**How many style options are available for the top bar?** Seven different navigation options, including existing formats and new ones.

**Can I use just icons, with no text?** Yes, there's a specific option with icons only, no text.

**Can the bar's background color be personalized?** Yes, you can adjust the background color to match the rest of the app.

## Video Tutorial: Step by Step

Check out other practical tutorials on the Jestor YouTube channel.

## Get to know Jestor

With Jestor, every app has navigation that matches the process it represents, not a repeated generic layout.

Visit the official Jestor website and scale the efficiency of your operation.