docs: Update README with example screenshots.

README.md

@@ -28,6 +28,8 @@ A Home Assistant integration that provides advanced price information and rating
 -   **Statistical Sensors**: Track lowest, highest, and average prices for the day
 -   **Price Ratings**: Quarter-hourly ratings comparing current prices to 24-hour trailing averages
 -   **Smart Indicators**: Binary sensors to detect peak hours and best price hours for automations
+-   **Beautiful ApexCharts**: Auto-generated chart configurations with dynamic Y-axis scaling ([see examples](docs/user/chart-examples.md))
+-   **Chart Metadata Sensor**: Dynamic chart configuration for optimal visualization
 -   **Intelligent Caching**: Minimizes API calls while ensuring data freshness across Home Assistant restarts
 -   **Custom Actions** (backend services): API endpoints for advanced integrations (ApexCharts support included)
 -   **Diagnostic Sensors**: Monitor data freshness and availability
@@ -308,6 +310,16 @@ template:
 
 📖 **[View all sensors and attributes →](docs/user/sensors.md)**
 
+### Dynamic Icons & Visual Indicators
+
+All sensors feature dynamic icons that change based on price levels, providing instant visual feedback in your dashboards.
+
+<img src="images/entities-overview.jpg" width="400" alt="Entity list showing dynamic icons for different price states">
+
+_Dynamic icons adapt to price levels, trends, and period states - showing CHEAP prices, FALLING trend, and active Best Price Period_
+
+📖 **[Dynamic Icons Guide →](docs/user/dynamic-icons.md)** | **[Icon Colors Guide →](docs/user/icon-colors.md)**
+
 ### Custom Actions
 
 The integration provides custom actions (they still appear as services under the hood) for advanced use cases. These actions show up in Home Assistant under **Developer Tools → Actions**.
@@ -318,11 +330,15 @@ The integration provides custom actions (they still appear as services under the
 
 📖 **[Action documentation and examples →](docs/user/actions.md)**
 
-### ApexCharts Integration
+### Chart Visualizations (Optional)
 
-The integration includes built-in support for creating beautiful price visualization cards. Use the `get_apexcharts_yaml` action to generate card configurations automatically.
+The integration includes built-in support for creating price visualization cards with automatic Y-axis scaling and color-coded series.
 
-📖 **[ApexCharts examples →](docs/user/automation-examples.md#apexcharts-cards)**
+<img src="images/charts/rolling-window.jpg" width="600" alt="Example: Dynamic 48h rolling window chart">
+
+_Optional: Dynamic 48h chart with automatic Y-axis scaling - generated via `get_apexcharts_yaml` action_
+
+📖 **[Chart examples and setup guide →](docs/user/chart-examples.md)**
 
 ## 🤝 Contributing
 

docs/user/chart-examples.md

@@ -40,7 +40,7 @@ data:
 
 **Screenshot:**
 
-<img src="../../images/charts/today.png" width="800" alt="Today's Prices - Static 24h View">
+<img src="../../images/charts/today.jpg" width="800" alt="Today's Prices - Static 24h View">
 
 **Key Features:**
 - ✅ Color-coded price levels (LOW, NORMAL, HIGH)
@@ -70,7 +70,7 @@ data:
 
 **Screenshot:**
 
-<img src="../../images/charts/rolling-window.png" width="800" alt="Rolling 48h Window with Dynamic Y-Axis Scaling">
+<img src="../../images/charts/rolling-window.jpg" width="800" alt="Rolling 48h Window with Dynamic Y-Axis Scaling">
 
 **Key Features:**
 - ✅ **Dynamic Y-axis scaling** via `chart_metadata` sensor
@@ -104,7 +104,7 @@ data:
 
 **Screenshot:**
 
-<img src="../../images/charts/rolling-window-autozoom.png" width="800" alt="Rolling Window Auto-Zoom - Progressive Zoom Effect">
+<img src="../../images/charts/rolling-window-autozoom.jpg" width="800" alt="Rolling Window Auto-Zoom - Progressive Zoom Effect">
 
 **Key Features:**
 - ✅ **Progressive zoom:** Graph span decreases every 15 minutes
@@ -298,16 +298,14 @@ cards:
 
 1. **Today View (Static)** - Representative of all fixed day views (yesterday/today/tomorrow)
 
-   <img src="../../images/charts/today.png" width="600" alt="Today View">
+   <img src="../../images/charts/today.jpg" width="600" alt="Today View">
 
 2. **Rolling Window (Dynamic)** - Shows dynamic Y-axis scaling and 48h window
 
-   <img src="../../images/charts/rolling-window.png" width="600" alt="Rolling Window">
+   <img src="../../images/charts/rolling-window.jpg" width="600" alt="Rolling Window">
-
-   **Recommended for README** - showcases the most impressive features!
 
 3. **Rolling Window Auto-Zoom (Dynamic)** - Shows progressive zoom effect
 
-   <img src="../../images/charts/rolling-window-autozoom.png" width="600" alt="Rolling Window Auto-Zoom">
+   <img src="../../images/charts/rolling-window-autozoom.jpg" width="600" alt="Rolling Window Auto-Zoom">
 
-**Note:** Tomorrow view is visually identical to Today view (same chart type, just different data), so one static screenshot is sufficient to represent all fixed day modes.
+**Note:** Tomorrow view is visually identical to Today view (same chart type, just different data).

images/charts/README.md

@@ -1,32 +0,0 @@
-# Chart Screenshots
-
-This directory contains screenshots of the different chart configurations available through `tibber_prices.get_apexcharts_yaml`.
-
-## Files:
-
-- ✅ `today.png` - Static view of today's prices (representative of all fixed day views)
-- ✅ `rolling-window.png` - Dynamic 48h rolling window with Y-axis scaling
-- ✅ `rolling-window-autozoom.png` - Auto-zoom view with progressive zoom
-
-**Note:** Tomorrow view is visually identical to today view, so one static screenshot covers all fixed day modes (yesterday/today/tomorrow).
-
-## Screenshot Guidelines:
-
-When capturing screenshots:
-
-1. Use a clean Home Assistant dashboard (no other cards visible)
-2. Capture during a day with interesting price variations (show the chart at work!)
-3. Include both light and dark mode versions if possible
-4. Make sure best price period highlights are visible (if enabled)
-5. Capture at a resolution that's readable when embedded in docs (at least 1200px width)
-
-## Recommended for README.md:
-
-Use `rolling_window.png` in the main README.md as it shows:
-- ✅ Dynamic 48h window (impressive!)
-- ✅ Color-coded series (visual appeal)
-- ✅ Dynamic Y-axis scaling (key feature)
-- ✅ Best price period highlights (useful overlay)
-- ✅ Gradient effect (polished look)
-
-This showcases the most advanced features at a glance!