1
0
Fork 0
mirror of https://github.com/PixNyb/hass-theme-blocky.git synced 2026-05-07 22:19:35 +02:00
A sleek, modern Home Assistant theme with light/dark mode and customizable colors. https://roelc.me
Find a file
2025-04-22 10:35:58 +02:00
.github This project really doesn't need automatic releases.. 2024-10-14 18:35:57 +00:00
docs/img Initial commit 2024-10-12 19:06:07 +02:00
themes Fixed badges being round in the new drag and drop views 2025-04-22 10:35:58 +02:00
.environment-setup.sh Changed startup script to actually work with venv 2025-03-06 11:54:31 +00:00
hacs.json Initial commit 2024-10-12 19:06:07 +02:00
README.md Disabled the hacs button as it won't be enabled for the time being 2024-10-13 14:21:40 +00:00

Blocky HASS theme

Based on the stylesheets I use regularly for my own projects, I've decided to port it over to Home Assistant. This theme gives a sleek, modern look to your Home Assistant interface with support for light and dark mode and, when I figure out how, support for custom primary, accent, tertiary and quaternary colors.

Light mode Dark mode
Light mode Dark mode
Light mode Dark mode
Light mode Dark mode

Usage

Requirements

  1. card-mod

HACS

  1. Go to the HACS page.
  2. Click on the options menu in the top right corner.
  3. Click Custom repositories.
  4. Add the following:
    • URL: https://github.com/PixNyb/hass-theme-blocky
    • Type: Theme
  5. Click Add.
  6. Look for the Blocky - By PixNyb theme in the HACS store.
  7. Install the theme.
  8. Reload home assistant.
    1. Go to the Settings page.
    2. Click System.
    3. Press the power button in the top right corner.
    4. Click Quick reload.

Manual

  1. Download the blocky.yaml file.
  2. Place the file in your config/themes directory.
  3. Add the following to your configuration.yaml if it's not already there:
    frontend:
        themes: !include_dir_merge_named themes
    
  4. Reload home assistant.
    1. Go to the Settings page.
    2. Click System.
    3. Press the power button in the top right corner.
    4. Click Quick reload.

Enabling the theme

Individually

  1. Open your Home Assistant profile.
  2. Under Themes, select Blocky.

Globally

  1. Go to the Developer tools page.
  2. Click ACTIONS.
  3. Under Action, select frontend: Set the default theme.
  4. Under Theme, select Blocky.
  5. Click PERFORM ACTION.