---
title: Componente React para Navegação inferior
components: BottomNavigation, BottomNavigationAction
---

# Navegação inferior

<p class="description">A barra de navegação inferior permite navegar entre os principais destinos em um aplicativo.</p>

Barras de [navegação inferior](https://material.io/design/components/bottom-navigation.html) apresentam de três a cinco destinos na parte inferior da tela. Cada destino é apresentado por um ícone e opcionalmente um rótulo de texto. Quando um ícone de navegação inferior é pressionado, o usuário é levado ao destino associado com ícone.

## Navegação inferior

Quando existir apenas **três** ações, exiba ambos, os ícones e rótulos de texto.

{{"demo": "pages/components/bottom-navigation/SimpleBottomNavigation.js", "bg": true}}

## Navegação inferior sem rótulo

Se existir **quatro** ou **cinco** ações, exiba os destinos inativos somente com ícone.

{{"demo": "pages/components/bottom-navigation/LabelBottomNavigation.js", "bg": true}}