Code kopieren & zu Dashboards
1# Wetter-Übersicht Dashboard Card
2# Kombiniert aktuelle Wetterdaten, Vorhersage und Warnungen
3type: vertical-stack
4cards:
5 # Aktuelles Wetter Header
6 - type: horizontal-stack
7 cards:
8 - type: weather-forecast
9 entity: weather.openweathermap
10 forecast_type: daily
11 show_forecast: false
12 style: |
13 ha-card {
14 background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
15 color: white;
16 border-radius: 15px;
17 box-shadow: 0 4px 8px rgba(0,0,0,0.1);
18 }
19
20 # Aktuelle Temperaturen
21 - type: vertical-stack
22 cards:
23 - type: sensor
24 entity: sensor.outdoor_temperature
25 name: "Außen"
26 icon: "mdi:thermometer"
27 card_mod:
28 style: |
29 ha-card {
30 background: rgba(255,255,255,0.1);
31 color: white;
32 border-radius: 10px;
33 text-align: center;
34 }
35 - type: sensor
36 entity: sensor.indoor_temperature
37 name: "Innen"
38 icon: "mdi:home-thermometer"
39 card_mod:
40 style: |
41 ha-card {
42 background: rgba(255,255,255,0.1);
43 color: white;
44 border-radius: 10px;
45 text-align: center;
46 }
47
48 # Wetter-Details Horizontal
49 - type: horizontal-stack
50 cards:
51 - type: entities
52 title: "Wetterdaten"
53 entities:
54 - entity: sensor.outdoor_humidity
55 name: "Luftfeuchtigkeit"
56 icon: "mdi:water-percent"
57 - entity: sensor.pressure
58 name: "Luftdruck"
59 icon: "mdi:gauge"
60 - entity: sensor.wind_speed
61 name: "Windgeschwindigkeit"
62 icon: "mdi:weather-windy"
63 - entity: sensor.uv_index
64 name: "UV-Index"
65 icon: "mdi:weather-sunny-alert"
66 card_mod:
67 style: |
68 ha-card {
69 border-radius: 15px;
70 background: var(--card-background-color);
71 }
72
73 # Niederschlag & Sonne
74 - type: entities
75 title: "Niederschlag & Sonne"
76 entities:
77 - entity: sensor.rain_today
78 name: "Regen heute"
79 icon: "mdi:weather-rainy"
80 - entity: sensor.rain_rate
81 name: "Regenrate"
82 icon: "mdi:weather-pouring"
83 - entity: sensor.sun_elevation
84 name: "Sonnenhöhe"
85 icon: "mdi:weather-sunny"
86 - entity: binary_sensor.sun_rising
87 name: "Sonne steigt"
88 icon: "mdi:weather-sunset-up"
89 card_mod:
90 style: |
91 ha-card {
92 border-radius: 15px;
93 background: var(--card-background-color);
94 }
95
96 # 5-Tage Vorhersage
97 - type: weather-forecast
98 entity: weather.openweathermap
99 forecast_type: daily
100 name: "5-Tage Vorhersage"
101 card_mod:
102 style: |
103 ha-card {
104 border-radius: 15px;
105 background: var(--card-background-color);
106 }
107
108 # Wetterwarnungen (falls vorhanden)
109 - type: conditional
110 conditions:
111 - entity: binary_sensor.weather_warning_active
112 state: "on"
113 card:
114 type: markdown
115 content: |
116 ## ⚠️ Wetterwarnungen
117 {{ state_attr('sensor.dwd_weather_warnings', 'warnings') | join('<br>') }}
118 card_mod:
119 style: |
120 ha-card {
121 background: rgba(255, 152, 0, 0.1);
122 border: 2px solid #ff9800;
123 border-radius: 15px;
124 }
125
126 # Regenradar (Optional)
127 - type: iframe
128 url: "https://www.regenradar.de"
129 aspect_ratio: 75%
130 title: "Regenradar"