I’m completely new to HADashboard, so please excuse me if I’m floundering a bit here. But I’m looking for a widget that can show the current temperature based on a sensor entity, the target temperature based on a input_number entity, and buttons for increasing/decreasing the target temperature. I like the climate widget, but as far as I can tell, this can’t be used with sensor or input_number entities.
the only way to get such a widget is to create a custom widget, because there is no such widget by default.
to create a custom widget you need to be quite familiar with programming in javascript, html and css.
but you can also do this with 2 widgets. and just use some css to make them belong together.
you would need the input_number or input_slider widget (both using input_number but 1 uses a slider and the other uses + - buttons. and they are wrongly named)
that would show your target temperature and a sensor to show your actual temperature.
Thank you for the reply. Programming is fine, but I haven’t attempted making custom widgets yet. I’m trying to find docs on how to CSS two widgets together. Can you point me in the right direction?
there are no docs on how to css to widgets together, because you cant really.
you can change the appearance from widgets so it appears they belong together.
you can do that on several ways:
no margins and rounded corners
no widget background and a dashboard background that puts the widgets together.
or use background colors to show what belongs together
or use borders to show what belongs together
or what ever you can think of that let it appear that 2 widgets are 1
it can help to use no margins and set widgetsize to a smaller size and use an empty line as margin.
for example
widget_dimensions: [10,10]
layout:
- widget_a(10x10)
gives the same result as
widget_dimensions: [100,100]
layout:
- widget_a
the difference is that you can use a spacer from 10x10 or an empty line from 10 pix.
but be carefull with that because making the grid small has 2 disadvantages:
- it gets harder to create (more complex constructions)
- it will be slower because loading the grid will be bigger and more complicated
so you see, you can get as creative as you like 
Hi Rene, how did you created the rounded frame around the widget?
i made a backgroundpicture for that
adding border: 3px solid #fff; border-radius: 6px; to the widget_ style in variables.yaml will also produce the same effect.
thank you very much! but how do I combine few tiles together under the same frame?
you can create a skin for each dashboard.
its also possible to create a skin that picks a background based on the dashboard name (code and how to do that is somewhere here on the forum)
it is also possible to use no margins.
and use css like:
widget_style: "border-top-left-radius: 30px;border-left-style: 3px solid white;"
this is a dashboard that i created that uses that kind of CSS.