# Breadcrumb specific style Properties

## Overview

<figure><img src="https://3933488479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjpWd52BKwABWxF2lScUK%2Fuploads%2Fgit-blob-6a09f67759c05e1baa97a95d98e4aa07d7017172%2Ftheme-breadcrumb.jpg?alt=media" alt=""><figcaption><p>Breadcrumb specific style Properties</p></figcaption></figure>

The **Breadcrumb specific style Properties** section is dedicated to customizing the appearance of breadcrumb navigation elements in your application. Breadcrumbs help users understand and navigate the hierarchical structure of your application.

## Properties

{% hint style="info" %}
All properties have an additional button: `Select Color`, which opens the [color chooser](https://docs.servoy.com/reference/servoy-developer/object-editors/color-chooser) wizard.
{% endhint %}

Here's an in-depth look at each property:

### Breadcrumb bg

This property sets the background color for the breadcrumb navigation bar. It ensures that the breadcrumb area visually stands out from the rest of the content, making it easy for users to locate and use the navigation.\
Value: Hex color code or CSS variable (e.g., `@body-bg`).

### Breadcrumb color

This property defines the text color of the breadcrumb links. It’s important for ensuring that the breadcrumb text is readable against its background.\
Value: Hex color code or CSS variable (e.g., `@main-color`).

### Breadcrumb selected color

This property sets the color of the breadcrumb item that represents the current page or selection. It helps users identify their current location within the application’s hierarchy.\
Value: Hex color code or CSS variable (e.g., `@text-color`).