[Custom Card] Room Card - Visual, Clean, Grid-Based & Zero YAML

Share your Projects! Dashboards & Frontend
1

Hi everyone,

I wanted to share my first custom card with you all.
I was looking for a room card that is compact, visually customizable, and allows for a flexible grid layout without having to mess with complex YAML nesting.

So I built the Room Card.

It focuses on stability, performance (Vanilla JS), and usability. Everything can be configured directly via the visual editor.

preview_collage
preview_collage505×661 138 KB

:sparkles: Key Features

  • :computer_mouse: Visual Editor: Configure everything in the UI – no YAML required.
  • :straight_ruler: Flexible Grid: You decide if a button takes 1/3, 1/4, or 1/6 of the row width.
  • :battery: Smart Chips: Automatically shows active devices (e.g., open windows, low batteries, high humidity).
  • :arrow_up_down: Custom Heights: Make important buttons taller for better accessibility.
  • :zap: Fast: Written in Vanilla JS with no external dependencies.

:inbox_tray: Installation

The card is ready to be installed via HACS (Custom Repository):

  1. Open HACS.
  2. Go to “Custom Repositories” (top right menu).
  3. Add URL: https://github.com/lop1505/RoomCard
  4. Category: Lovelace (or Dashboard in newer versions).
  5. Click “Install”.

Or check out the code and documentation on GitHub:
:point_right: GitHub Repository

I’d love to hear your feedback and suggestions!

Cheers,
OneLine

1 Like
2

Looks pretty good, but everything is in German and my German is very rusty.

image
image1220×1063 43.3 KB

2 Likes
3

Thanks for the feedback! I’ve just released Version 1.0.3, which now includes full support for English and French. You should be able to update and use it in your preferred language now. Let me know if everything works for you!

1 Like
4

You can now use this direct installation link to add the card, as I have just fixed two critical bugs in version 1.0.4.
Open your Home Assistant instance and open a repository inside the Home Assistant Community Store.

5

Hey everyone, I just pushed a major update (v1.0.7) for the OneLine Room Card regarding stability and flexibility!

1. :no_entry_sign: Renaming to avoid conflicts To prevent clashes with other existing “room-card” projects, I have officially scoped the card name.

  • New Type: custom:oneline-room-card
  • Old Type: custom:room-card (Now displays a migration warning)

2. :us: Dynamic Unit Support (“Freedom Units”) No more hardcoded Celsius! The card now automatically detects your Home Assistant system settings. Whether you use Fahrenheit, Celsius, the card adapts instantly without manual config.

:point_right: How to update:

  1. Update via HACS to v1.0.7.
  2. Clear your browser cache (Ctrl + F5) – Important!
  3. Update your YAML configuration to the new type: type: custom:oneline-room-card.

Enjoy the update!