Repository navigation
v1.1.0
The biggest Tabdeck release yet: nearly 40 new features. Tabs can now react to your home (live icons, alerts, formatted badges), the card can run a wall panel by itself, the deck can be a phone-style dock, a dropdown menu or a side-by-side split view, and the editor can build a deck for you from your own entities or convert one from another card. It also speaks eight languages, and there's a live demo to try everything in the browser before you install it.
Every new feature is opt-in. Nothing needs migrating and existing dashboards look and behave exactly as before.
🎮 New: try it in your browser
- Live demo: a playground with example decks, a YAML box you can edit, and pretend devices (guest mode, a garage door, lights) that switch visibility, badges and alerts live. No Home Assistant needed.
- Showcase: a wiki page of community decks and starter ideas. Share yours with the new Show and tell discussion form (screenshot, YAML and a tick-box to agree to it being featured).
✨ New: the editor builds decks for you
- Starter templates: Start from a template builds a working deck from your own entities: Rooms, Lights, Security, Media, Climate, Energy or Family. Replace the current tabs or add to them.
- Convert from another card: paste a
tabbed-card,swipe-card,state-switch, Bubble Card pop-ups, a stack or grid (split atheadingcards),conditionalcards, a sections view or a whole dashboard, and get Tabdeck tabs back. Options are mapped across, and anything that couldn't be carried over is explained. - Why is this tab hidden?: the editor checks each tab's conditions against live state. Hidden now and Alerting chips show on the tab list, and each condition gets a ✅ or ❌ with the current value, any missing entity and live template results.
- Condition builders: Visibility, Alert and Default-when conditions use Home Assistant's own condition editor. Tabdeck-only types such as
templateedit as YAML in place. (#110) - Copy and import tabs: copy a tab's config to the clipboard (works over plain http too) and paste one or several tabs back in. (#111)
🏠 New: tabs that react to your home
-
Live icons, names and colours: a tab's
icon,name,subtitle,colorandaccentcan be Jinja templates, so the Garage tab can turn red with an open-door icon while it's open. (#100) -
Alert pulse: per-tab
alertconditions make a tab pulse in--tabdeck-alert-colorwhile they're met. With reduced motion on, it's a steady tint instead. (#102) -
Badge formatting:
badge_format: { precision, unit, max }turns21.456into21.5°and150into99+. Set it per tab or once for the whole card. (#101) -
A tab per area or label:
auto_tabs: { source: areas | labels }builds a tab for every area (with its icon) or label, listing its entities. No Jinja needed. (#112) -
Tab-change actions:
enter_action/leave_actionrun any HA action when a tab opens or closes, for example turning a camera stream on only while its tab is showing. (#106)- name: Garage icon: "{{ 'mdi:garage-open' if is_state('cover.garage', 'open') else 'mdi:garage' }}" color: "{{ 'var(--error-color)' if is_state('cover.garage', 'open') else '' }}" alert: - condition: state entity: cover.garage state: open
🖥️ New: wall panels and kiosks
- Auto-rotate:
auto_rotate: 15cycles through the tabs and pauses whenever someone touches the screen. (#103) - Idle return:
idle_return: 120goes back to the default tab after two minutes with nobody using it. (#103) - Remote control from HA: with
remember: entity, the card now follows its helper entity live, so an automation or Node-RED flow can change the tab on every panel at once. (#99) - Edit mode helpers: while you edit the dashboard, hidden tabs appear faded with an eye-off marker so you can still reach them, and rotation and idle return pause.
🧭 New: more ways to lay out a deck
- Dock:
dock: truepins the bar to the bottom of the screen like a phone app's navigation, with the icon over the label, badges on the icon, and room left for the home bar and HA's sidebar. - Floating action tabs:
fab: truemakes a tab a raised round button that floats above the dock. Pair it withtap_action. - Grouped tabs: a tab with
children:holds sub-tabs, shown as a second row or, withchildren_display: menu, as a ▾ dropdown on the tab. - Split view:
split: 900shows every tab side by side as columns once the card is at least 900 px wide. (#108) - Narrow screens:
tab_display_narrowswitches to, say, icon-only tabs when the card is narrow. (#108) - Expand the selected tab:
tab_display: activeshows icons only, except the selected tab, which also shows its name. Suggested by the community in discussion #93. - Pagination dots and content arrows:
tab_display: dotsswaps the tabs for a row of dots, andcontent_arrows: trueadds ‹ › buttons beside the content. - Expanding side rail:
rail_expand: truekeeps a left or right bar as an icon rail that slides its labels out on hover or keyboard focus. - Scroll-spy:
scroll_spy: truestacks every tab as one long page. The bar jumps to each section and highlights the one you're reading. (#105) - Collapsible:
collapsible: truefolds the content away when you tap the open tab again.start_collapsedstarts folded. (#107) hide_bar: content only, no tab bar.
🎨 New: styling
- Style presets:
preset: ios | material | glass | minimal | railapplies a whole look in one line. Anything you set yourself still wins, and the editor's preset picker fills the values into the form so you can tweak from there. A new--tabdeck-bar-backdropvariable gives frosted bars. (#109) - Per-tab styles: a tab's own
stylesapply while it's open, for example a different accent colour per room. (#113)
⌨️ New: getting around faster
- Quick-switch search:
search: trueadds a 🔍 filter that ignores case and accents and searches names and subtitles. Use ↑ ↓ and Enter to pick a tab. - Keyboard shortcuts:
hotkeys: truegives 1 to 9 for tabs,[]to step and/to search. They're ignored while you're typing. - Back button:
history: truemakes the browser's Back button, or the phone's back gesture, return to the previous tab. - Arrange your own tabs:
customize: truelets each person reorder and hide tabs for themselves. It's saved in their browser and never changes the dashboard config. - Navigation tabs: a tab with
tap_actionruns an action, such asnavigateto another view, instead of opening. (#104) - Friendlier deep links:
#tab=living-roomnow matches the Living Room tab, ignoring case. (#99)
🌍 New: eight languages
The editor and the card's own text follow your Home Assistant language: English, Deutsch, Español, Français, Italiano, Nederlands, Polski and Português. Regional variants use the base language, and anything not yet translated shows in English. See Languages if you'd like to help translate.
🔌 New: for scripts and other cards
selectTab(nameOrIndex),selectedTab, and atabdeck-tab-changedevent on every tab change, for browser_mod, scripts and other cards.
🐛 Fixed
- Sticky bars no longer hide under Home Assistant's header. They now pin just below it. Override the position with
--tabdeck-sticky-top. (#105) - Actions picked in HA's action editor now run.
perform-action(what the picker writes) works forhold_action,badge_actionandtap_action; before, only the oldercall-servicedid. (#106) - Content beside a left or right tab bar fills the card instead of shrinking to fit its content.
- The editor's Add tab icon shows on current Home Assistant builds.
- Swiping skips disabled tabs instead of landing on them.
- A
0.0badge counts as zero, sohide_inactive_badgehides it and dot mode shows no dot.
Upgrading
Update via HACS, then hard-refresh your browser (Ctrl/Cmd + Shift + R) so the new card loads. Nothing needs changing in your config.
Full details for each feature are on the Wiki.
Full changelog: v1.0.0...v1.1.0