GitHub47

Gamification UI Kit by Trophy

Trophy's Gamification UI Kit is an open-source library of gamification UI components built on shadcn/ui and Tailwind CSS. Drop-in React components for streaks, achievements, leaderboards, points, and more — ready to copy and customize.

Star on GitHubGet started
19,845
XP
250 tasks
11% of users1,000 tasks

Your points progress

0-499
Beginner
500-999
Novice
1,000-1,499
Intermediate
1,500-1,999
Professional
2,000-2,499
Expert
2,500-2,999
Master
3,000-3,499
Grand Master
3,500+
Enlightened
1
Ava Turner avatar

Ava Turner

Diamond

286.9k

2
Leo Harrison avatar

Leo Harrison

Platinum

281.4k

3
Rowan Elijah avatar

Rowan Elijah

Platinum

274.5k

5
Emma Johnson avatar

Emma Johnson

Gold

216.7k

9
Sophia Miller avatar

Sophia Miller

Gold

187.1k

10
Daniel Brown avatar

Daniel Brown

Gold

179.7k

Page 1 of 1

Double XP Weekendx2

Enjoy double XP on all activity this weekend.

Ends in 47h 59m 59sDo something
Jun 2, 2026

2,016+94

Jun 1, 2026

1,922+135

May 26, 2026

1,787+130

May 5, 2026

1,657+71

Mar 4, 2026

1,586+105

Jan 3, 2026

1,481+126

Nov 4, 2025

1,355+120

Sep 15, 2025

1,235+133

Leo Harrison2,814
Ava Turner2,869
Rowan Elijah2,745

250 tasks

Complete 250 tasks

23%

Gamification UI Components for React

Trophy's Gamification UI Kit gives you production-ready gamification components — streak trackers, achievement badges, leaderboards, points displays, and more. Built on shadcn/ui and Tailwind CSS, every component is open source, fully customizable, and installs with a single CLI command into any React or Next.js project.

Everything You Need to Ship Gamification

Four categories of components covering the most impactful gamification patterns — all composable, accessible, and theme-aware.

Streak Components

Keep users coming back with streak tracking UI. Display daily streaks, streak calendars, and streak badges that motivate consistent engagement.

Streak CardStreak CalendarStreak Badge

Achievement Components

Celebrate milestones with achievement badges, unlock animations, and achievement grids. Give users a sense of progress and accomplishment.

Achievement BadgeAchievement CardAchievement GridAchievement ListAchievement Unlocked

Leaderboard Components

Drive competition with leaderboard rankings, podium displays, and leaderboard cards. Show users where they stand among peers.

Leaderboard RankingsLeaderboard PodiumLeaderboard Card

Points & Levels Components

Reward actions with points badges, level timelines, points charts, and boost indicators. Build complete progression systems.

Points BadgePoints AwardsPoints BoostPoints ChartPoints Levels ListPoints Levels Timeline

Built for Developers

One-Command Install

Add any component to your project with a single CLI command. No extra dependencies to manage.

Fully Customizable

Every component lives in your codebase. Tweak styles, layout, and behavior to match your brand.

Open Source

MIT licensed and community-driven. Use in personal projects or production apps without restrictions.