Skip to content


Where to start?

So, you came here to read how to design your own theme. That's good!

There are two prerequisites to create a Material 3 theme and convert it to an Home Assistant dark / light theme.

Step 1: Create a free Figma Account

So head over to the site, and Sign up!

Figma Site

Step 2: Install the Material Theme Builder plugin

From the menu, go to "Plugins" and "Browse plugins in Community"

Figma Browse Plugins in Community

Now search for the material theme builder...

Figma Search Material Theme Builder plugin

If you made no typos, you will see the Material Theme Builder selected. Click on this one to install the plugin.

Figma Found Material Theme Builder plugin

Now click install and the plugin is installed, You made it!

Figma Install Material Theme Builder plugin

You need the Swiss Army Knife custom card

This card is (ab)used to convert the resulting tokens file.

Back to top