Dashboard Header Card

A sticky header card for Home Assistant dashboards with dynamic greeting, weather display, person status detection, and a customizable badge row.

Screenshot

Features

• Dynamic time-based greeting (Jinja2 template support)
• Subtitle with person status detection (Jinja2 template support)
• Weather entity display with condition icons
• Customizable badge row (flexible wrapping/scrolling)
• Responsive layout with floating/full-width modes
• Sidebar integration and mobile landscape scroll behavior
• Automatic HA header height detection (Kiosk-mode aware)
• Full UI configuration (no exclusive YAML features)
• EN/DE multilanguage support
• Tip: use my mirror-card to show the header on each view

Prerequisites

• Home Assistant 2026.3.0 or newer
• HACS (recommended for installation)

Installation

HACS (Recommended)

Or add manually:

1. Open HACS in your Home Assistant instance
2. Click the three dots in the top right corner and select Custom repositories
3. Enter https://github.com/thecodingdad/dashboard-header-card and select Dashboard as the category
4. Click Add, then search for "Dashboard Header Card" and download it
5. Reload your browser / clear cache

Manual Installation

1. Download the latest release from GitHub Releases
2. Copy the dist/ contents to config/www/community/dashboard-header-card/
3. Add the resource in Settings → Dashboards → Resources:
   • URL: /local/community/dashboard-header-card/dashboard-header-card.js
   • Type: JavaScript Module
4. Reload your browser

Usage

type: custom:dashboard-header-card
weather_entity: weather.home
floating_mobile: true
badges:
  - entity: sensor.temperature
  - entity: sensor.humidity
badges_overflow: scroll

Configuration

Card Options

Option	Type	Default	Description
person_entity	string	auto	Person entity (auto-detect from logged-in user)
weather_entity	string	—	Weather entity for display
floating_mobile	boolean	false	Floating layout on mobile
floating_desktop	boolean	false	Floating layout on desktop
breakpoint	number	768	Mobile/desktop breakpoint in px
scroll_in_landscape	boolean	false	Enable scroll in landscape mode
respect_sidebar	boolean	true	Offset for HA sidebar
top_offset	string	auto	Fixed header height offset
max_width	string	—	Maximum width in floating mode
badges	array	—	Badge configurations
badges_align	string	—	Badge row alignment
badges_overflow	string	—	Badge overflow behavior (wrap/scroll)

Multilanguage Support

This card supports English and German.

License

This project is licensed under the MIT License - see the LICENSE file for details.