---
fdRelatedComponents:
  - fd-shell-bar
  - fd-shell-bar-action
  - fd-shell-bar-actions
  - fd-shell-bar-group
  - fd-shell-bar-logo
  - fd-shell-bar-product
  - fd-shell-bar-product-menu
  - fd-shell-bar-product-switcher
  - fd-shell-bar-product-switcher-item
  - fd-shell-bar-product-switcher-item-img
  - fd-shell-bar-product-switcher-item-title
  - fd-shell-bar-product-title
  - fd-shell-bar-subtitle
  - fd-shell-bar-user-menu
---

# Shell Bar

## Minimal Shell Bar

::: tip

This example shows the minimum Shellbar for a single application product with only user settings. If no user thumbnail is available then display initials.

:::

<d-example name="minimal">
</d-example>

## Shell Bar with additional Actions

::: tip

Use `fd-shell-bar-action-button` to add additional action buttons to the shell bar.

:::

<d-example name="actions">
</d-example>

## Shell Bar with Product Switcher

::: tip

You have to embed a `fd-shell-bar` in a `fd-shell` for things to work properly.

:::

<d-example name="products">
</d-example>