TailwindCSS Template Card - build custom cards with HTML and TailwindCSS

Share your Projects! Dashboards & Frontend
,
14

Awesome! That’s actually very easy to accomplish: you need to get the value from HomeAssistant with Jinja templates. It will update your card with the new state whenever your entities updates. e.g.:

<input
    type="range"
    class="range range-accent"
    min="0" max="100"
    value={{ states('input_number.test') }}
    onChange="hass.callService('input_number', 'set_value', { entity_id: 'input_number.test', value: this.value })"
/>