Solved: Reuse code with YAML Anchors and more

Here are three methods for reusing code in Home Assistant / YAML.

First, be sure you’re using Lovelace YAML mode.

METHOD 1 - Anchors
Define anchors (the code you want to reuse) using the & key

You can define anchors when you’re using code for real, or you can create dummy entries like this in a Lovelace file (Be sure YAML code that creates anchors comes before the YAML code that uses the anchors):

  dummy_colors:
    color1: &yellow_gradient 'linear-gradient( 135deg, rgb(253, 235, 113) 10%, rgb(248, 216, 0) 100%)' # Yellow 
    color2: &blue_gradient 'linear-gradient( 135deg, rgb(171, 220, 255) 10%, rgb(3, 150, 255) 100%)' # Blue
    color3: &purple_medium '#9c88ff' # Purple
    color4: &green_medium '#4cd137' # Green Medium
    color5: &orange_medium '#fbc531' # Orange Medium

Once defined, you can use your anchors with the * key like this:

    styles:
      card:
        - background-image: *green_gradient

For more information on anchors including the merge key see:

METHOD 2 - Decluttering Card
Another powerful way to reuse code is with the decluttering card

METHOD 3 - Button Card
If you want to reuse code while creating buttons, I highly recommend using “Configuration Templates” with the awesome Button Card


Cheers, Richard

24 Likes