A sleek horizon-style area chart that compresses time-series magnitude into layered bands above and below a central baseline. The mirrored shades convey intensity at a glance while conserving vertical space—perfect for dashboards where readability and density matter. Month ticks guide temporal context (Aug → Mar), and inline pill labels surface key values without crowding the plot. Smooth gradients make peaks pop and troughs recede, revealing trends, seasonality, and volatility. Designed for touch and mouse: tooltips and focus states keep interaction precise. Light-weight rendering keeps it buttery-smooth on mobile and desktop.

Functionality

• Horizon chart with mirrored, banded areas around a zero/median baseline.

• Multi-band shading to encode magnitude (darker = higher intensity).

• Inline value pills for selected checkpoints.

• Month axis with evenly spaced ticks and optional gridlines.

• Hover/tap tooltips, focus highlight, keyboard navigation (optional).

• Theming: band count, colors, opacity, baseline mode, smoothing, curve type.

• Responsive SVG/canvas rendering for mobile & desktop dashboards.

Use cases

• Show seasonality and volatility in KPIs without tall charts (analytics hubs).

• Compare intensity over time for traffic, demand, or alerts.

• Monitor error rates or latency bands in DevOps/SRE views.

• Summarize engagement levels across months for marketing reports.

• Visualize distribution envelopes (min/mean/max bands) for forecasting.

Keywords

horizon chart, horizon graph, density area chart, layered area chart, banded area, intensity bands, time series visualization, seasonal trends, volatility, compact chart, mirrored area, stream visualization, analytics dashboard, KPI trends, responsive chart, interactive tooltip, gradient bands, zero baseline, mobile chart, web dashboard, Flutter chart, FlutterFlow component, data visualization, time series, performance monitoring, product analytics, marketing analytics.