Features

Features

✨ Features

📈	Line, step, and bar charts with smooth Bezier curves
🕯️	Candlestick (OHLC) charts — render any entity as trading-style candles showing the open, high, low, and close of each time bucket. Green/red up/down bodies with high–low wicks and an O/H/L/C tooltip; recolor with the Rise/Fall Colors feature. Candles snap to clean clock intervals and sit centered on the X-axis ticks
📅	Built-in Date Picker — navigate Day, Week, Month, Year views with arrow buttons, calendar popup, and preset ranges (Last 7/30 Days, Last 12 Months). Or open on a rolling window that ends now — Last 24H … Last 12M — set as the default mode or shown as extra picker buttons. Sync multiple cards with date_picker_group — even cards without a visible picker can follow the group. Customize visible modes with date_picker_modes — lock to a single mode for a minimal nav bar
🪟	Card styling without card-mod — set border radius, border color & width, padding, background image (with smart /local/ path resolution), background blur (image-only — chart and header stay sharp), header color, weight, and letter-spacing directly from the editor. Combine with rgba(...) background colors for translucent cards over images
🔢	Live state rows with current value, MDI icons, and configurable font sizes
🎯	Fourteen chart modes — Timeline, State Timeline, Scatter, Pie (donut), Ranking (horizontal bar), Radial Bar (concentric arcs), Polar Area (variable-radius pie), Radar (spider polygon), Heatmap (days × hours), Calendar (weekly grid), Gauge (needle dial), Box Plot (distribution boxes), Waterfall (running-total bridge), Histogram (value-frequency bars) — selectable from a single dropdown
📦	Box Plot mode — chart_mode: box draws min / Q1 / median / Q3 / max boxes per time bucket, straight from the dense source samples. Answer "what is this room's daily temperature spread?" at a glance. Bucket width follows group_by or is picked automatically from the window
🪜	Waterfall mode — chart_mode: waterfall turns each entity into a +/− step of a running total with an automatic Total bar — the classic bridge chart for energy balances and budgets. Steps default to sum; use aggregate_func: diff for cumulative kWh counters and invert: true for subtractions
📊	Histogram mode — chart_mode: histogram shows the value-frequency distribution over the visible window. Bin count is automatic (Freedman–Diaconis) or fixed via histogram_bins; multiple entities share the same bins side by side
🎛️	Gauge display — replace the state row with a half-circle gauge showing current value against min/max bounds
🧭	Gauge chart mode — chart_mode: gauge draws a needle dial per entity in a column grid. The arc fills the value range seen in the period (min → max), the needle marks the live value, and color_thresholds paint the dial. Configurable span, columns, value position/size, and per-entity needle_color
✨	Sparkline mode — ultra-compact inline graphs with no chrome, ideal for dashboard overview tiles
📊	Rise/Fall colorization — graph segments automatically change color as values climb or drop, with independent colors for rising, falling, and stable periods
⏩	Trend icon — a ▲▼⯇⯈ indicator on each state row shows the current direction of change, calculated over a configurable time window (trend_period_hours)
🌐	Locale-aware formatting — control how numbers are displayed per entity (number_format) and how timestamps appear card-wide (datetime_format), independent of your HA locale
🏷️	Custom unit per entity — override auto-detected units with unit: kWh on any entity. Essential for attributes and unitless sensors
🏠	Area names — include_area_names: true appends each entity's Home Assistant area to its label (Heating Temperature · Lounge) across the state row, legend, tooltip, stats and exports. Indispensable with integrations like Advanced History that give several entities the same friendly name
🏷️	Attribute names — include_attribute_name / use_only_attribute_name label a series by the attribute it plots, so two attributes of the same entity stop sharing one name
🔡	Axis label customization — adjust font size and opacity of Y-axis and X-axis labels independently for a clean, tailored look
📌	Axis tick marks — optional small tick lines at each label position, controllable independently for X and Y axes
🕐	Dynamic Graph Hours — filter data to specific hours each day with graph_start_hour and graph_end_hour. Accepts fixed numbers or sensor entities (e.g. sensor.sunrise_hour) for sunrise-to-sunset views that adapt throughout the year
🛠️	Full visual editor — every option is configurable through the Lovelace UI without touching YAML; entities can be reordered by drag-and-drop. The editor adapts dynamically: irrelevant options hide based on the selected chart mode
↕️	Dual Y-axis support (primary + secondary) with per-axis bounds and configurable tick count
↕️	Independent Y2 axis toggle — show or hide the secondary (right) Y axis labels without affecting the primary axis. Hidden by default; enable it when you want right-side labels
↕️	Independent Y-axis — y_axis: independent gives each entity its own hidden scale based on its min/max, enabling trend comparison across sensors with wildly different units (°C, %, lux, hPa) on a single graph
🎨	Color thresholds with direction (vertical gradient or horizontal per-segment) and transition (smooth blend or hard switch). Threshold values and colors can also reference live entities (sensor.x / sensor.x.attribute)
🔺	Min / Max extrema labels — always on, on click, or never
➖	Average line — dashed reference at the mean value for the visible window
〽️	Moving averages — overlay one or more simple moving-average (SMA) lines per entity, each with its own period (in buckets), color, and width, plus an optional on-line MA7/MA26 label. The card extends the look-back beyond the visible window automatically, so a long period (e.g. MA26) draws fully even when hours_to_show is short. Averages the close for candlesticks, otherwise the bucket value; drawn on the entity's own Y axis
💬	Tooltip with crosshair on hover
🌅	Per-entity gradient fill with same-hue fade — applies to both area charts and bar charts (with rounded corners)
▦	Grid lines — horizontal + vertical aligned to actual data points
📉	Logarithmic scale
🔍	Zoom brush — click and drag on the graph to zoom into a time range; double-click steps back one zoom level, "Reset zoom" restores the full window
📌	Annotations — add threshold lines, event markers, time span highlights, and comfort zone bands to the graph. Entity-driven or manual timestamps, with per-annotation opacity and Jinja2 template support
🔄	Tooltip sync — hover one card and see crosshairs on all synced cards, with optional named groups
🔍	Zoom sync — brush-zoom on one card and every other card in the group jumps to the same time window (double-click anywhere to reset them all)
↔️	Scroll sync — horizontal scrolling stays in lock-step across all cards in the same group, even when their hours_to_show differ
📊	Stacked mode — stack line/area/bar entities to show composition
↔️	Time Offset — per-entity hour offset to overlay the same sensor from different periods on one graph. Supports helper entities (e.g. input_number) for dynamic offset values
〰️	Soft bounds (~ prefix) — axis expands when data exceeds the bound
🔣	state_map for non-numeric entities (binary sensors, input selects)
🔗	Attribute reading with dot-notation nested path support
⏩	Forward-fill for sparse sensors (e.g. weather entities)
🎨	Adaptive state color — state row inherits entity line color automatically
🎚️	Interval picker — quick-select time range buttons (1H–1Y) directly on the card, no editor needed
⚡	Auto scale points — automatically reduces data density for longer time ranges, keeping performance smooth
🔀	Attribute switcher — per-entity dropdown on the card to switch between state and any numeric attribute on the fly
🔍	Scrollable graph — set a visible window smaller than the data range and scroll horizontally through history
↔️	Configurable icon position — place the header icon on the left or right side of the title
🏷️	Compact Legend — color-coded entity name key below the graph with configurable position (left, center, right). Click any legend item to temporarily hide that entity from the graph
📊	Per-entity legend stats — choose any combination of Min, Avg, Max, Sum, Last and Live for each entity's legend row. Click to toggle entity visibility
🏷️	Vertical axis labels — optional vertical unit labels on the left and right edges of the graph. Defaults to the entity's unit of measurement, with custom text override
🕐	Smart X-axis labels — when the time range spans multiple days, midnight ticks automatically show the date (e.g. "28 Mar") while other ticks show HH:mm. Tick density adapts to label width and font size
⬇️	Bottom state rows — place entity state rows below the graph instead of above with bottom-left, bottom-center, bottom-right alignment
📏	Grid aligned to tick marks — horizontal grid lines match Y axis tick values exactly
🔀	Value Transform — apply a JavaScript expression to every data point using x, first, min, max, avg, last, index — ideal for normalize-to-zero, splitting sensors, and percentage calculations
📏	Range Band — per-entity min/max shaded band behind the line showing value fluctuation within each data bucket
🏷️	Data Labels — print the numeric value of every visible data point right above the bar / line / point, ApexCharts-style. Font size adapts automatically to bar width; text renders in the entity color with a card-background halo for readability. Per-entity opt-in via show_data_labels
🕳️	Break on Gaps — per-entity toggle to break the line at long unavailable / unknown outages instead of carrying the last known value across the gap
↔️	Dynamic Y-axis width — axis label areas auto-expand to fit longer numbers without clipping
⚡	Energy Date Sync — sync the card's time range with HA's Energy dashboard date picker or energy-period-selector-plus
🔌	External Statistics — display imported statistics that have no regular entity (e.g. gazpar:gazpar_consumption) by setting statistic_id
📅	Long-range views — group_by: week and month with native HA statistics periods, graph_start anchoring to calendar boundaries, and smart X-axis labels that adapt to the grouping mode
⚡	Change aggregation — aggregate_func: change uses HA's native change field for energy, gas, and water meters. Combine with group_by: date/week/month for accurate consumption charts
🔀	Stacked Groups — per-entity stack_group names let you create multiple side-by-side stacked bar groups on a single chart
🏷️	Template names — use {{ state_attr('sensor.x', 'attr') }} with Jinja2 filters (capitalize, upper, replace(), round(), etc.) for dynamic entity names
↔️	Horizontal state layout — state_layout: horizontal flows entity values side by side instead of stacking vertically
🔢	Y-axis decimals — card-level y_axis_decimals overrides per-entity decimals for axis labels only, keeping state row precision separate
⏱️	X-axis interval — x_axis_interval for manual tick spacing (1h–3M) with clean boundary snapping
📅	Show Full Period — extend the X-axis to cover a complete calendar period (day, week, month, year) with a "now" indicator line, leaving empty space after the current time. Ideal for imported data or comparing today vs yesterday
🔋	Battery icon — battery_entity displays a color-coded battery level indicator in the header or state row, with configurable low threshold
📡	Attribute Data Source — read chart data from an entity attribute array (forecast, spot prices) instead of history. Supports future timestamps for EPEX, Nordpool, Tibber, solar forecasts, and weather predictions. Also accepts numeric/categorical time fields (month_of_year, day_of_year, hour_of_day, epoch seconds/ms) so monthly summaries and hourly profiles work without artificial timestamps. Per-point values can also be computed from element fields plus other entities via data_value_expression + data_vars
📅	Group by Year — group_by: year for multi-year trend views with automatic bar width and X-axis labels
🔄	Invert bars — per-entity invert: true draws bars downward from zero. Combine with stacked: true for butterfly charts (energy import/export, network in/out)
🔁	Rolling date picker window — date_picker_step turns the picker into an N-unit rolling window. step: 4 + mode: week shows the last 4 weeks and prev/next jumps a full 4 weeks at a time
💾	Long-term statistics auto-routing — entities with state_class declared automatically use HA's long-term statistics for ranges beyond recorder retention. Set statistic_id explicitly or use hours_to_show > 240 to opt in for short ranges. A console warning lists entities lacking state_class when the range exceeds retention
📈	Static data carry-forward — when a sensor stops emitting state changes, the last known value is carried forward to "now" instead of leaving the chart blank. Matches the behavior of HA's built-in statistics card
⚠️	Offline sensor gaps — when HA reports a sensor as unavailable, the line breaks at that point and resumes when the sensor recovers. Makes it instantly obvious when a sensor was offline versus when its value was simply steady
🎚️	On-card Points/Hour & Group By pickers — change data resolution and bucketing right on the card; selections persist, take priority over Auto Scale, and "Auto" returns to the configured value
🕐	Multi-hour buckets — group_by: 2h / 3h / 4h / 6h / 12h (any Nh) for clean multi-hour bars between hour and date
🕒	Y-axis label formats — show durations (h:mm, mm:ss, d h:mm) or custom {expression} labels per axis; tooltips, data labels, state row and the average label follow automatically
🔗	Picker group sync — interval_picker_group, pph_picker_group, group_by_picker_group: one visible picker drives every card sharing the group; receivers don't need a picker at all
🙈	Auto Hide Entities — start with every series hidden and reveal only what you need from the legend
📍	Date picker layout — place the ‹ date › navigator and the D/W/M/Y shortcuts left / center / right, independently
🥧	Pie chart styles — pie_style presets (Classic, Thick, Donut, Thin) with optional pie_3d depth effect, pie_spacing for gaps between slices, and automatic rounded slice corners. Slice labels show the actual value with unit. Customize slice and center label fonts/colors with pie_label_font_size, pie_label_color, pie_center_font_size, and pie_center_color — all accept theme variables
🎯	Snap-to-data tooltips — hovering over a line graph snaps the tooltip and dot to the nearest real data point instead of interpolating fake values between samples. The crosshair line aligns with the snapped point too, so what you see is exactly what your sensor recorded
🔤	Theme-aware fonts — every canvas-rendered chart (Pie, Heatmap, Calendar, Ranking, Radial Bar, Polar Area, Radar, Gauge, axis labels) uses your active HA font (--primary-font-family) instead of generic sans-serif
🧹	Clean YAML output — the visual editor only writes fields you've actually customized. New cards start with 5 lines, not 80. Toggle a setting and it appears in YAML; revert to default and it disappears. Explicit overrides are always preserved
🏷️	Y-axis state names — when graphing entities with state_map (washing machines, alarm panels, media players), the Y-axis automatically shows the original state names (idle, running, done) instead of 0, 1, 2. Optional friendly labels supported via value, label in the editor
🎨	Custom axis colors — y_axis_color, x_axis_color, and x_axis_date_color let you color-match the axis labels and tick marks to your dashboard theme
✨	Bar hover highlight — bars brighten on mouse hover so it's obvious which bar a tooltip refers to, especially in stacked or multi-entity charts. On mobile, the highlight persists while the finger is held down via a JS-managed class (CSS :hover is unreliable on touch devices)
✨	Period highlight — on bar charts, hovering a bar shades the background band of that whole period so it's clear where each period starts and ends, even with several entities side by side. Toggle with period_highlight and recolor with period_highlight_color; works with or without the tooltip
🎨	Color templates — all color fields (color, icon_color, state_color, point_colors, axis/grid colors) accept Jinja2 {{ }} templates evaluated server-side by HA via render_template WebSocket subscriptions. Use a central sensor.entity_colors to manage all entity colors from one place. In the editor, the color picker automatically dims when a template is detected
📅	graph_start: tomorrow — sets the graph window to tomorrow 00:00 → end of day, perfect for displaying next-day spot prices (Nord Pool, EPEX, Tibber) via data_attribute. The window extends into the future automatically without requiring show_full_period
📏	Grid customization — per-axis control over grid line appearance: y_grid_style / x_grid_style (dashed, solid, dotted, long-dash), y_grid_width / x_grid_width (thickness in px), y_grid_color / x_grid_color (any CSS color or template), and y_grid_opacity / x_grid_opacity to dial the grid up or down without retyping rgba colors. All configurable from the editor's Y Axis and X Axis tabs
📱	Mobile touch improvements — tooltip appears instantly on first tap (no finger movement needed). Long-press (600ms) + drag activates brush zoom; a quick slide shows the tooltip. Bar highlights persist while the finger is held down
🥧	Pie/Radial decimals — entity decimals setting now controls the precision of percentage labels in slice labels, tooltips, and radial bar overlays — not just the value display
🔮	Forecast Horizon — per-entity forecast_horizon: N shifts each recorded data point along the X-axis. Positive values (e.g. 1) shift forward — for sensors whose current state predicts T+N hours ahead (e.g. Solcast PV forecast in 1 hour); the X-axis is extended automatically to keep the shifted line visible. Negative values (e.g. -24) shift backward — useful with attribute-based forecasts to overlay tomorrow's data onto today's chart. Independent from offset — both can be combined
⏱️	Now Line — a vertical marker showing the current moment, enabled by default. Customize now_line_color, now_line_opacity, now_line_width, and now_line_style (solid, dashed, dotted, long-dash) or disable with show_now_line: false
🗂️	Z-Index layering — per-entity z_index sets which curve is drawn in front (higher = on top, lower or negative = behind). Independent of the legend / state-row order, so you can layer overlapping lines, bars or bands without reordering your entities
📆	Weekday on the X-axis — datetime_format understands ddd / dddd, so multi-day and "last N days" views can label day boundaries with the day name (Mon / Mo / Pzt …, localized). Use dddd alone for just the day name; the intraday clock keeps showing the time
📐	Round Y-axis ticks — the Y axis picks clean round numbers (0, 500, 1000, 1500) that fit within your data range without expanding it. Enabled by default; disable with y_axis_round_ticks: false
🎯	Primary Value dropdown — primary_state_as controls what the big value in the state row shows: live state (default), last aggregated point, or Sum / Avg / Min / Max / First over the visible window. Ideal for clean header-only entities
📊	Show Range — show_range_values: true displays the visible window's min and max as a subdued (min → max) suffix next to the primary value. Perfect for compact "records" cards (show_graph: false + primary_state_as: min/max) where the range previously was only reachable via the graph tooltip
📑	Stacked name layout — name_position: below places the entity name centered below the primary value (ApexCharts-style), great for mobile and header-only entities
🎨	Card shadow & border toggles — card_shadow: false and card_border: false allow a flat borderless look or blending with decorated backgrounds
👥	Period Comparison — per-entity compare overlays a faded, dashed ghost of the same sensor from a previous period (yesterday, last week, last month, last year, or any number of hours) underneath the main series. Also accepts a list of comparisons — one ghost per entry, each reaching further back via periods_back (previous period, two periods ago, …). Calendar-aware shifting in the date picker's Month/Year modes, a Δ% delta in the tooltip, and legend clicks that toggle main + ghosts together
🧩	Boolean template toggles — display toggles like show_legend, stacked, show_points, or show_state accept Jinja2 {{ }} templates as well as plain booleans, resolved live server-side — drive card chrome from an input_boolean without editing YAML
🏷️	State timeline labels toggle — state_timeline_show_labels: false hides the state labels drawn inside state_timeline segments for clean, label-free color bands
🧲	Raw grouping — group_by: raw skips bucketing entirely and draws every recorded sample at its exact timestamp — ideal for step charts of binary/state sensors
🤏	Pinch zoom & zoom history — two-finger pinch on touch devices zooms the timeline live around the gesture midpoint; any pinch angle works (the gesture measures the true 2D finger distance) and zoom responds on an amplified curve, so small real-world pinches zoom meaningfully — pinching inward zooms out just as strongly, all the way back to the full window. Every committed zoom (brush or pinch) is pushed onto a history stack (up to 20 levels) — double-click / double-tap steps back one level at a time instead of resetting fully. Works with cross-card zoom_sync
📥	PNG / CSV export — show_export: true overlays a small download icon on the card with a three-item menu: a 2× PNG of the chart, a 2× PNG of the whole card (header, chart, state row and legend), or a wide-format CSV (ISO 8601 UTC time column, one column per visible series, Excel-friendly UTF-8 BOM). A zoomed chart exports exactly the zoomed range — export what you see
➖	Two-entity math — per-entity ref_entity + ref_op combines a series with a second entity over time (subtract / add / multiply / divide). Plot indoor − outdoor, production − consumption, or target vs actual with no template sensor; the reference is sampled as a step function so each point is combined with the value valid at that moment
💶	Cost view — per-entity price_entity multiplies a series by the value of another entity over time (spot price, tariff sensor). The price is read as a step function from the price entity's own history and applied per consumption slice before bucketing, so every bucket is an exact Σ(value × price). Ideal with aggregate_func: change on energy counters — set unit to your currency and the kWh chart becomes a cost chart
⚡	Custom auto-scale rules — card-level auto_scale_rules teaches Auto Scale your thresholds: each rule maps a visible period ("up to N hours") to a Group By and optionally a Points/Hour. The smallest matching threshold wins; periods beyond every threshold fall back to the built-in auto scale