31 Leaderboard

What it does

A self-sorting leaderboard for your site. Type names and scores and it ranks them, adds gold / silver / bronze medals, draws score bars and shows up/down arrows against each player's previous rank. Switch on Podium to show the top three on a podium. Looks finished on install with 10 sample players.

Customizable properties

• Items (up to 50): name, score, avatar image (optional), tag and previous rank

• Podium mode, medals, score bars, movement arrows, avatars, tags

• Best Score: highest wins, or lowest wins (golf, lap times)

• Search box and tag tabs (both optional)

• Rows Shown + "Show more" button, fonts

• Number format: prefix, suffix, decimals, thousands separator

• Light / Dark, custom colors, stripes, gap, padding, radius

Why this component

• Ranks for you: sorting, rank numbers and ties are automatic.

• Bars animate once when scrolled into view, then stop. Canvas and static export show the finished state.

• Phones get a compact layout: tags and side bars drop away, a thin bar sits under each name.

• Keyboard focusable, with screen-reader summaries ("Rank 2, Liam Carter, 9,475 pts, down 1").

Need help?

Reach out anytime at hello@brandingupstudio.com. We usually reply within 1 business day.

Need more? All 10 paid BrandingUp components in one payment: All-Access Pass, $49 → https://brandingup.lemonsqueezy.com/checkout/buy/3391c106-6fbc-41b8-9cc8-b63365b95665

Built with code but fully customizable via property controls, no coding needed. Unlink is not provided so we can keep delivering updates. When an update is available, just click the Update button on the component.