Bar chart
Allocation Performance Chart
An allocation dashboard card with textured asset tracks and bold fill states for portfolio composition.
The chart is built as custom SVG: striped track patterns, animated column fills, rounded mask-like bars and per-asset labels inspired by premium finance interfaces.
Dependencies
framer-motionlucide-reacttailwind-mergetailwind-variants
Interaction type
Replay the fill animation to scan allocation changes across Bonds, Stocks, ETFs and Crypto.
Usage
import { AllocationPerformanceChart } from "@/registry/new-york-v4/ui/allocation-performance-chart"
<AllocationPerformanceChart data={allocations} />Allocation Performance
Textured allocation tracks with active marker and tooltip