Search blocks

Find a block by name or category

11 Blocks

Roadmap Blocks

Product roadmap blocks built with shadcn/ui: status-column boards, Now/Next/Later phases, upvotable public roadmaps, quarterly views, Gantt-style delivery lanes, and animated health overviews. Show direction publicly without exporting your project tracker.

Roadmap 1

Free

A three-column product roadmap board grouped by status (Planned, In Progress, Shipped). Cards carry a category badge, title, and description, plus per-status meta: a vote count when planned, a progress bar with contributor avatars when in progress, and a shipped date with avatars when done.

AvatarBadgeProgress

Roadmap 2

Free

A Now, Next, and Later roadmap with colored phase markers and a target month per phase. In-development items show a progress bar with contributor avatars while upcoming items show a vote count. A directional product roadmap.

AvatarBadgeProgress

Roadmap 3

Free

An interactive public roadmap card where visitors upvote feature requests. Each row has a vote button with a live count, a title, status and category badges, a description, and a progress bar with contributor avatars for in-development items. Good for feedback and feature-request pages.

AvatarBadgeCardProgress

Roadmap 4

Free

A product roadmap laid out as four quarterly columns, each listing feature cards with a category, a color-coded status icon, and a shipped, in-progress, or planned label.

Badge

Roadmap 5

Pro

Pro roadmap: an interactive delivery board across Shipped, In Progress, Planned, and Exploring columns, with an area filter that reflows the cards, count-up progress, shipped checklists, animated upvotes, and a live pulse on the newest release.

AvatarBadgeProgress
motion

Roadmap 6

Pro

Pro roadmap: a centered Now, Next, and Later switcher with a sliding indicator that blur cross-fades between phase card sets and auto-advances, each phase showing progress and contributor avatars or a vote count.

AvatarBadgeProgressToggle Group
motion

Roadmap 7

Pro

Pro roadmap: every initiative in one hairline table with a status filter and click-to-sort by target that reflow the rows, status pills, and a count-up summary of how many initiatives are in active development.

BadgeTable
motion

Roadmap 8

Pro

Pro roadmap: a horizontal milestone timeline whose progress line draws in on scroll, with quarter milestones alternating above and below the spine and a pulsing Today marker between shipped and upcoming work.

Badge
motion

Roadmap 9

Pro

Pro roadmap: a split with a count-up stat strip on the left and a live Recently Shipped changelog feed on the right that auto-streams new releases in with version tags, contributor avatars, and timestamps.

AvatarBadge
motion

Roadmap 10

Pro

Pro roadmap: a Gantt-style delivery plan with workstream lanes and quarter columns, status-tinted duration bars that draw in on scroll, a pulsing Now line, and hover tooltips revealing each initiative owner and target.

AvatarTooltip
motion

Roadmap 11

Pro

Pro roadmap: a health overview split with a radial completion gauge and count-up metric grid on the left and a heading, What's Next milestone list, and CTA on the right.

ButtonChart
motionrecharts

Roadmap Blocks FAQ

Categories that pair well with Roadmap blocks when composing a page.