RuneScapeCN

If WarcraftCN exists, then RuneScapeCN had to exist too. As someone who’s been playing RuneScape for over 20 years, I couldn’t let Warcraft be the only game with a themed component library. It was practically my civic duty.

The Project

RuneScapeCN is a component library of Old School RuneScape-themed UI components built on top of shadcn/ui. Classic OSRS-inspired borders, beveled 3D shadows, zero border-radius, and authentic RuneStar fonts. If you’ve ever right-clicked on a goblin, you know the aesthetic.

It ships with 11 accessible components: Button, Card, Dialog, Select, Tabs, Input, Checkbox, Badge, Tooltip, Progress, and CopyButton. All fully open source, all copy-paste friendly.

You can install any component directly via the shadcn CLI registry:

pnpm dlx shadcn@latest add https://runescapecn.com/r/button.json

Or just clone the repo and grab what you need.

First Time Open Source

This is my first open source project. Setting up the registry, writing a contributing guide, thinking about how other developers would actually use the library — it’s a completely different mindset from building something just for yourself.

There’s something satisfying about publishing code that anyone can use and contribute to. Even if the niche is “people who want their web apps to look like a 2007 browser game.”

Tech Stack

• React 19 & TypeScript
• Tailwind CSS v4
• Radix UI for accessibility primitives
• Class Variance Authority for variant management

Why This Exists

RuneScape shaped a huge part of who I am. The game taught me patience (grinding 99 Runecrafting will do that), community, and even got me interested in programming in the first place. Building a component library themed around it felt like a proper tribute.

Plus, every game community deserves nice UI components.