How to add rounded corners to lovelace cards - within a theme?

Share your Projects! Dashboards & Frontend
61

I might have missed it, but is there a way to globally assign styles to panels?
I tried the following in the yaml file:

type: 'custom:card-mod'
style: |
  ha-card {
    ha-card-border-radius: '20px'
    border: 1px solid green;
  }

But that only applies it to the “edit” section while in the edit mode.
It’s a little cumbersome to have to apply the style to every element.

62

Good evening

May i know how can i make a curved Cards.

I am first in HA

63

Hello
Can you please send to me complete Customs card mod installation tutorial …

I try too much time but still showing (Error: Custom element not found: card-mod
)

I believe you will solve my issue

64

Can you please tell me how can i setup border radius on card …
If you tell me every setup it will be more help full for me …
because i am first in HA

65

Hey, @shamseer. To adjust themes, first, open your configuration.yaml. You might need to install File Editor (Configurator) first. Then add this to it:

frontend:
  themes: !include themes.yaml

Click on save. Make a new file called themes.yaml. Add this to it:

Rounded theme:
  ha-card-border-radius: '20px'

Click on save. Restart Home Assistant. Click on your profile icon, and under themes choose Rounded theme. You should have all of the cards rounded.

1 Like