About this project

Mini Graph Card is a custom Lovelace card for Home Assistant that displays the current state of sensor and binary_sensor entities alongside a line or bar graph of their history. It is installed through HACS, manually by copying the bundle into config/www, or via CLI download, then referenced as a JavaScript module resource in Lovelace. The card is configured in YAML. Required options are type (custom:mini-graph-card) and entities, a list of sensor entities. Each entity can be a plain entity id or an object with options such as attribute, name, color, unit, aggregate_func, show_state, show_legend_state, show_indicator, show_graph, show_line, show_fill, show_points, show_legend, state_adaptive_color, y_axis, fixed_value and smoothing. Card-level options include icon, icon_image, name, unit, tap_action, group, hours_to_show, points_per_hour, aggregate_func, group_by, update_interval, cache, show, animate, height, bar_spacing, line_width, line_color, color_thresholds, color_thresholds_transition, decimals, hour24, font_size, font_size_header, align_header, align_icon, align_state, lower_bound, upper_bound, min_bound_range, secondary bounds, smoothing, state_map, value_factor and logarithmic. The show list controls UI elements: name, icon, state, graph (line, bar or false), fill, points, legend, average, extrema, labels, labels_secondary, name_adaptive_color, icon_adaptive_color and loading_indicator. Aggregate functions include avg, median, min, max, first, last, sum, delta and diff. Data can be grouped by interval, date or hour. Color thresholds support smooth or hard transitions and interpolation of intermediate stop values. Non-numeric states can be mapped to labels via state_map, and attributes in nested dictionaries or lists can be accessed with dotted paths. Examples cover single-entity cards, alternative styles, multiple entities, bar charts, weekly history, graph-only cards, horizontal stacks, dynamic line colors, secondary y-axis, grouping by date, aggregation functions, binary sensors and showing extra state-only entities. Theme variables mcg-title-letter-spacing and mcg-title-font-weight allow appearance customization. Development requires nodejs and npm, with npm run build and npm run watch scripts.