Skip to content

fix(charts): round only top/right corners of bars instead of all four corners#10982

Open
creazyfrog wants to merge 1 commit into
shadcn-ui:mainfrom
creazyfrog:fix/10741-bar-chart-bottom-radius
Open

fix(charts): round only top/right corners of bars instead of all four corners#10982
creazyfrog wants to merge 1 commit into
shadcn-ui:mainfrom
creazyfrog:fix/10741-bar-chart-bottom-radius

Conversation

@creazyfrog

Copy link
Copy Markdown

Summary

Changes

All changes are in apps/v4/registry/new-york-v4/charts/:

File Before After
chart-bar-default.tsx radius={8} radius={[8, 8, 0, 0]}
chart-bar-active.tsx radius={8} radius={[8, 8, 0, 0]}
chart-bar-label.tsx radius={8} radius={[8, 8, 0, 0]}
chart-bar-multiple.tsx (×2) radius={4} radius={[4, 4, 0, 0]}
chart-bar-label-custom.tsx radius={4} radius={[4, 4, 0, 0]}
chart-bar-mixed.tsx radius={5} radius={[5, 5, 0, 0]}
chart-bar-horizontal.tsx radius={5} radius={[0, 5, 5, 0]}

In Recharts the array form is [topLeft, topRight, bottomRight, bottomLeft]:

  • Vertical bars grow upward → round top corners only: [N, N, 0, 0]
  • Horizontal bars grow rightward → round right corners only: [0, N, N, 0]

Testing

Visual-only change. Default appearance is improved: bars now sit flush on the axis baseline. No logic or data changes.

Closes #10741

🤖 Generated with Claude Code

@vercel

vercel Bot commented Jun 21, 2026

Copy link
Copy Markdown
Contributor

@creazyfrog is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

@creazyfrog creazyfrog force-pushed the fix/10741-bar-chart-bottom-radius branch from 9278f25 to 7430381 Compare June 21, 2026 05:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[bug]: Bar chart examples round the bottom of bars, reducing visual accuracy

1 participant