Sharing: Claude skill library for Bubble Card dashboards — HA_Bubble_Skill

Sharing: Claude skill library for Bubble Card dashboards — HA_Bubble_Skill

Hi all,

I've been working on a structured skill library for Claude that focuses on building Bubble Card dashboards, and wanted to share it in case it's useful to others in the community.

What it is

HA_Bubble_Skill is a set of reference files you load into Claude (either as project knowledge in claude.ai, or on disk if you use Claude with file system access). Once loaded, Claude has detailed, version-specific knowledge of Bubble Card 3.2.x, Streamline Card, Sidebar Card, and the Mushroom chip card — plus a shared CSS theme architecture that wires all of them together.

It's an initial release, so treat it as a solid foundation rather than something polished and battle-tested.

What it covers

  • Bubble Card 3.2.x — all card types, v3.2 standalone pop-up format, sub-button schema (v3.1+ index ordering), JS template API, module authoring
  • Streamline Card — template syntax, UI-mode vs YAML-mode distinction, Bubble Card interaction patterns
  • Sidebar Card — config, known issues (including the HA 2026.x caveats), fallback patterns
  • Mushroom chip cards — including the template chip and a Mushroom ↔ HA state-colour integration via the CSS theme
  • CSS theme — a merged HA/Bubble/Mushroom theme (Casa5HeyneV2-based) with a colour intelligence layer: WCAG contrast checks, 12 ready-made palette recipes, advisory and prescriptive palette generation
  • Troubleshooting — symptom → cause → fix tables for the most common failure modes

What it doesn't do

It won't replace understanding how these cards work. Claude still makes mistakes, especially on things that changed between Bubble Card versions. The skill helps it get the common patterns right more consistently, not perfectly.

GitHub

github.com

GitHub - johnnyh1975/HA_Bubble_Skill: Claude skill library for building Home Assistant...

Claude skill library for building Home Assistant dashboards with Bubble Card, Streamline Card, Sidebar Card and Mushroom — including a merged HA/Bubble/Mushroom CSS theme, colour intelligence with WCAG checks, and full troubleshooting reference.

Includes the skill files, a base Casa5HeyneV2 theme YAML (with the Bubble + Mushroom CSS integration already wired), and a test dashboard you can import to verify the recipes work on your setup.

Happy to answer questions, and feedback on gaps or errors is very welcome — especially from people running setups I haven't tested against.

2 Likes

Not sure how much response you have gotten, but this is really cool and working well. The theme is nice - although I prefer the original bubble theme to be honest - but like the integration with Mushroom.

Good job!

1 Like

Thanks for the Feedback. Any thoughts on what to further add or improve to the skill to make it Even more useful?

I noticed my tokens get burned through a lot quicker. Does it take a bit for the agent to review?

I’ll keep playing with it.

1 Like

You are right, I optimized the structure a bit to reduce the token footprint
Good catch!

I'm still finding it is burning through my usage. I am on free, but i used to be able to get a lot done with my home assistant set up with 3. Now I'm finding it gives me 3-5 messages and I am done.

Running out of tokens? A new cry getting increasingly louder.

How soon before the AI bots start to do the bidding of their creators, and offer up code optimised to generate maximum profits, rather than optimum solutions for their "users" (I use that term as it is common in only two industries - computers and illegal drugs - and both treat their customers with similar contempt, getting them hooked first, and then milking them relentlessly).

"I'll swap you a token for an original thought" may be the conversation between two elderly unkempt travellers sitting under a bridge in the not too distant future.

Can you trust Claude if you ask to optimise for minimum token usage? Should you?