---
title: AccuracyBarChart
description: Accuracy bar charts visualize model or system performance metrics with intelligent color coding and percentage display.
category: Charts
order: 1
---

import DemoIndex from './demos/index.tsx?demo';

<Demo of={DemoIndex} layout="bare" />

{/* ## Usage example

The example below shows a chart composition displaying accuracy metrics for different models or systems.

<code src="./demos/example.tsx"></code>

## Usage example with color schemes

The example below shows different color schemes for accuracy visualization.

<code src="./demos/colorSchemes.tsx"></code>

## Usage example with thresholds

The example below shows threshold-based color coding for accuracy levels.

<code src="./demos/thresholds.tsx"></code>

## Usage example with custom formatting

The example below shows custom accuracy formatting and display options.

<code src="./demos/customFormatting.tsx"></code>

## Usage example with click events

The example below shows an interactive chart using the `onValueChange` prop.

<code src="./demos/clickEvent.tsx"></code>

## No Data

<code src="./demos/noData.tsx"></code>

## Loading

<code src="./demos/loading.tsx"></code>

## API

<API></API> */}