# Bklit UI > Bklit UI is an open-source React chart and data-viz component library (Visx, Motion, Tailwind 4). Charts are composable primitives (line, area, bar, pie, heatmap, sankey, and more, plus utilities like Band, Weekends, Deadline, Trend Line, markers, and tooltips) installed via the shadcn registry. Themes use CSS custom properties with multi-hue chart palettes. The interactive Studio tunes chart props and records animations. ## Getting Started - [Introduction](https://bklit.com/docs): Beautiful, modern UI components for React applications - [Installation](https://bklit.com/docs/installation): How to install and configure Bklit UI in your project - [Components](https://bklit.com/docs/components): A collection of chart components for your applications. ## Guides - [Theming](https://bklit.com/docs/theming): Theme your charts with CSS custom properties — multi-hue palettes, trend colors, sequential scales, and custom palette export. - [Skills](https://bklit.com/docs/skills): Give AI agents project-aware context for Bklit charts in your application. ## Components - [Area Chart](https://bklit.com/docs/components/area-chart): A composable area chart with gradient fills, tooltips, and hover interactions - [Bar Chart](https://bklit.com/docs/components/bar-chart): A composable bar chart with spring animations, stacked bars, horizontal orientation, and grouped series support - [Candlestick Chart](https://bklit.com/docs/components/candlestick-chart): A composable OHLC candlestick chart with gradients, patterns, tooltips, and hover interactions - [Choropleth Chart](https://bklit.com/docs/components/choropleth-chart): A composable geographic map chart for visualizing data across regions with interactive tooltips, zoom controls, and pattern support - [Composed Chart](https://bklit.com/docs/components/composed-chart): Mix SeriesBar, Line, and Area on one shared time axis (Recharts ComposedChart–style) - [Funnel Chart](https://bklit.com/docs/components/funnel-chart): An animated funnel chart with multi-layer halo rings, hover interactions, and staggered entrance animations - [Gauge](https://bklit.com/docs/components/gauge-chart): Notch-based radial or linear gauge with optional center label, theme fills, patterns, arc gradients, and responsive sizing - [Heatmap Chart](https://bklit.com/docs/components/heatmap-chart): A contribution heatmap with animated cells, configurable level colors and patterns, and an interactive legend - [Line Chart](https://bklit.com/docs/components/line-chart): A composable line chart with tooltips, markers, and hover interactions - [Profit/Loss Line](https://bklit.com/docs/components/profit-loss-line): Sign-colored line segments for profit and loss on a shared zero baseline - [Live Line Chart](https://bklit.com/docs/components/live-line-chart): Real-time streaming line chart with smooth scrolling, crosshair, and animated axes - [Pie Chart](https://bklit.com/docs/components/pie-chart): A composable pie and donut chart with animated slices, hover interactions, patterns, gradients, and an interactive legend - [Radar Chart](https://bklit.com/docs/components/radar-chart): A composable multi-series radar chart with animated polygons, hover interactions, and customizable metrics - [Ring Chart](https://bklit.com/docs/components/ring-chart): A composable multi-ring progress chart with animated arcs, hover interactions, and a reusable legend component - [Scatter Chart](https://bklit.com/docs/components/scatter-chart): A composable time-series scatter chart with hover dimming, optional offset rings, jitter, and animated enter - [Sankey Chart](https://bklit.com/docs/components/sankey-chart): A composable sankey diagram for visualizing flow between nodes with animated links and interactive tooltips - [Sunburst Chart](https://bklit.com/docs/components/sunburst-chart): A composable hierarchical sunburst chart with drill-down zoom, animated segments, breadcrumb navigation, and legend sync ## Utility - [Legend](https://bklit.com/docs/utility/legend): A composable legend component for charts with progress bars, markers, and customizable layouts - [Grid](https://bklit.com/docs/utility/grid): A customizable grid component for charts with horizontal and vertical lines, edge fade, edge line hiding, and dashed styling - [Background](https://bklit.com/docs/utility/background): Pattern fill for the plot area when grid lines are hidden — presets, edge fade, and enter animation - [Reference Area](https://bklit.com/docs/utility/reference-area): Shaded Y band for target ranges and thresholds on cartesian charts — solid or pattern fill, dashed edges, and Y-axis tick coloring - [Projection Line](https://bklit.com/docs/utility/projection-line): Forecast segment extending a line series past the last data point — dashed stroke, gradient, and horizon marker - [Band](https://bklit.com/docs/utility/band): Shaded range between per-row upper and lower values on a line chart — range area charts, min/max ranges, confidence intervals, and Bollinger bands - [Weekends](https://bklit.com/docs/utility/weekends): Shade weekend days behind the series on date x axes — diagonal stripes or a solid fill, configurable weekend days, and zoom-aware rendering - [Deadline](https://bklit.com/docs/utility/deadline): Due-date marker for date x axes — a vertical line with a striped, gradient, or solid region to its right that fades out - [Trend Line](https://bklit.com/docs/utility/trend-line): Least-squares regression line over a series on line, area, bar, and composed charts — dashed, solid, or gradient stroke with optional edge fade - [Markers](https://bklit.com/docs/utility/markers): Annotate dates on time-series charts — rich icon badges with a radial fan-out and tooltip, or your own minimal glyphs built on useChart - [Tooltip](https://bklit.com/docs/utility/tooltip): An interactive tooltip component for charts with crosshair, dots, date picker, and customizable content - [Brush](https://bklit.com/docs/utility/brush): Time-range brush for zooming area and line charts with a mini-chart strip and draggable selection handles - [Axis](https://bklit.com/docs/utility/axis): X and Y axis components for line and area charts - [X Axis](https://bklit.com/docs/utility/axis/x-axis): Date labels for the horizontal axis in line and area charts - [Y Axis](https://bklit.com/docs/utility/axis/y-axis): Value labels for the vertical axis in line and area charts - [useChart Hook](https://bklit.com/docs/utility/use-chart): Access chart state and context for building custom chart components - [Custom Indicator](https://bklit.com/docs/utility/custom-indicator): Create custom tooltip indicators for charts using the useChart hook ## Optional - [Charts gallery](https://bklit.com/charts): Copy-paste examples for every chart type and variation. - [Blocks](https://bklit.com/blocks): Dashboard blocks composed from Bklit charts. - [Studio](https://bklit.com/studio): Interactive editor to tune chart props, palettes, and motion, then copy the code. - [Benchmarks](https://bklit.com/benchmarks): Live in-browser performance benchmarks (mount, update, hover, DOM size) against Recharts and TanStack Charts. - [Showcase](https://bklit.com/showcase): Real dashboards and data experiences built with Bklit UI.