Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Chart - Tooltip - No Label
A React chart tooltip without label header using hideLabel and hideIndicator props with shadcn/ui and Recharts
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Tooltip labels add context, but sometimes they're just noise. This React bar chart uses hideLabel and hideIndicator props on ChartTooltipContent to remove both the header label and color indicators, creating an ultra-minimal tooltip showing only series names and values. Built with shadcn/ui and Recharts, this stripped-down tooltip works when chart context is already clear (X-axis labels are obvious), space is extremely limited (mobile, small widgets), or when minimalist aesthetics matter more than redundant information. Perfect for single-data-point focus, extremely compact views, value-only displays, or design-forward dashboards prioritizing clean typography.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Default Tooltip
Tooltip with label and indicators
Custom Label Tooltip
Custom label header
No Indicator Tooltip
Hide indicators but keep label
Formatted Tooltip
Custom value formatting
Default Bar Chart
Basic bar chart pattern
Line Chart
Line chart with tooltip