Skip to content

Custom lovelace card that displays a bottom nav in mobile devices, and a side nav in desktop devices for easy navigation.

Notifications You must be signed in to change notification settings

joseluis9595/lovelace-navbar-card

Repository files navigation

Navbar Card

Buy me a beer Last commit Downloads Version HA Community forum

Navbar Card image

Meet navbar-card — a custom Lovelace card for Home Assistant designed to make navigating your dashboards effortless and elegant.

Inspired by Adaptive Mushroom and Google’s Material Design, navbar-card brings a clean, modern interface that adapts beautifully to any device — whether you're on a phone, tablet, or desktop.

It’s minimal, responsive, and easy to configure, making navigation more intuitive across your dashboards.

Why Navbar Card?

  • Unified navigation across all your dashboards
  • Responsive layout that automatically adapts to screen size
  • Customizable actions, icons, and styles
  • Simple setup and seamless integration with existing Lovelace views



🚀 Quick start

Ready to give it a try? Start with the installation guide, then jump into the quickstart to build your first navbar in minutes.

⚙️ Configuration

You can find all configuration options in the wiki.

📚 Showcase

Want inspiration? Visit our examples showcase to see what's possible with Navbar Card.

🍻 Support

If you enjoy using navbar-card, you can find ways to support the project here.

About

Custom lovelace card that displays a bottom nav in mobile devices, and a side nav in desktop devices for easy navigation.

Topics

Resources

Contributing

Stars

Watchers

Forks

Sponsor this project

  •