# Finance Charts

> Sixty-two fintech dashboard cards — highlighted bars, scrubbable areas, range bands, radials, flows and more — drawn with TanStack Charts and sprung in with motion as the wall scrolls past.

## Details

- **Slug**: `finance-charts`
- **Tags**: data, colorful

## Links

- [Registry item](https://www.uicapsule.com/r/finance-charts.json): install with `npx shadcn@latest add https://www.uicapsule.com/r/finance-charts.json`
- [Raw source JSON](https://www.uicapsule.com/api/content/finance-charts): every file, as JSON
- [Bare preview](https://www.uicapsule.com/preview-frame/finance-charts): the component with no site chrome

## Files (80)

Full contents are in the registry item linked above.

- `/charts/analytics.tsx`
- `/charts/asset-allocation.tsx`
- `/charts/asset-overview-bar.tsx`
- `/charts/asset-overview-radial.tsx`
- `/charts/average-sales.tsx`
- `/charts/balance.tsx`
- `/charts/budget-allocation.tsx`
- `/charts/budget-health.tsx`
- `/charts/budget-overview.tsx`
- `/charts/budget-plan.tsx`
- `/charts/budget.tsx`
- `/charts/cash-balance.tsx`
- `/charts/cash-flow-area.tsx`
- `/charts/cash-flow-daily-bar-chrome.tsx`
- `/charts/cash-flow-daily-bar.tsx`
- `/charts/cash-flow-monthly-bar.tsx`
- `/charts/category-breakdown.tsx`
- `/charts/cumulative-assets-and-liabilities.tsx`
- `/charts/customer-rate.tsx`
- `/charts/entry.ts`
- `/charts/ethereum.tsx`
- `/charts/expenses.tsx`
- `/charts/finance-analytics.tsx`
- `/charts/finance-overview-area.tsx`
- `/charts/finance-overview-diverging-bar.tsx`
- `/charts/finance-overview-flow.tsx`
- `/charts/finance-overview-stacked-bar.tsx`
- `/charts/finance-overview-timeline.tsx`
- `/charts/financial-breakdown.tsx`
- `/charts/financial-trends.tsx`
- `/charts/global-defi.tsx`
- `/charts/global-finance-market-combo.tsx`
- `/charts/global-finance-market-forecast.tsx`
- `/charts/group-1.ts`
- `/charts/group-2.ts`
- `/charts/group-3.ts`
- `/charts/group-4.ts`
- `/charts/group-5.ts`
- `/charts/group-6.ts`
- `/charts/group-7.ts`
- `/charts/growth-trends.tsx`
- `/charts/income-overview.tsx`
- `/charts/index.ts`
- `/charts/investment-app-adoption-by-country.tsx`
- `/charts/investment-app-user-age.tsx`
- `/charts/investment-growth.tsx`
- `/charts/investment-performance.tsx`
- `/charts/monthly-income.tsx`
- `/charts/net-worth-stripes.ts`
- `/charts/net-worth.tsx`
- `/charts/options-portfolio.tsx`
- `/charts/overview.tsx`
- `/charts/performance.tsx`
- `/charts/portfolio-allocation.tsx`
- `/charts/price-range.tsx`
- `/charts/profit-margin-analysis.tsx`
- `/charts/project-budget-allocation.tsx`
- `/charts/revenue-by-product-line.tsx`
- `/charts/revenue-growth.tsx`
- `/charts/revenue-overview.tsx`
- `/charts/sales-performance.tsx`
- `/charts/sales-target.tsx`
- `/charts/saving-progress.tsx`
- `/charts/spending-overview-cylinder.tsx`
- `/charts/spending-overview-range.tsx`
- `/charts/spending-overview-scatter.tsx`
- `/charts/total-balance.tsx`
- `/charts/total-expenses.tsx`
- `/charts/total-revenue.tsx`
- `/charts/total-sales-parts.tsx`
- `/charts/total-sales.tsx`
- `/charts/total-value.tsx`
- `/charts/value-locked.tsx`
- `/charts/your-asset.tsx`
- `/finance-charts.tsx`
- `/lib/data.ts`
- `/lib/kit.tsx`
- `/lib/tokens.ts`
- `/package.json`
- `/preview.tsx`

---

[UICapsule](https://www.uicapsule.com) · [All components](https://www.uicapsule.com/llms.txt)