Achievement Grid

ui

Responsive React achievement grid for displaying collections of badges with progress and rarity across breakpoints. Ideal achievement UI design for galleries and showcases in consumer apps. Open source, built on shadcn/ui + Tailwind.

pnpm dlx shadcn@latest add "https://ui.trophy.so/r/achievement-grid.json"

Sign In

Achievement Grid

ui

Responsive React achievement grid for displaying collections of badges with progress and rarity across breakpoints. Ideal achievement UI design for galleries and showcases in consumer apps. Open source, built on shadcn/ui + Tailwind.

pnpm dlx shadcn@latest add "https://ui.trophy.so/r/achievement-grid.json"

components/ui/achievement-grid.tsx