gamekitui

Base registry URL: https://gamekitui.com/r/{name}.json

🚀 Usage

// app/not-found.tsx
import { Snake } from "@/components/games/snake";

export default function NotFound() {
  return (
    
      
        404
        Play a round while you decide where to go.
        
      
    
  );
}

That's it — no setup. On a single-game page like this, the game captures keyboard input globally, so it responds the moment a visitor presses a key (no click-to-focus needed).

Bundle size & lazy-loading

The installed .tsx looks big (~15–28 KB) because it inlines its own engine and theme hooks to stay a true single-file drop-in — but that's source, not what ships. Built for production each game is 2–4 KB minified + gzipped.

Because every game is a self-contained module, it's trivially code-split — lazy-load it so it never touches your initial bundle and only downloads when the easter egg actually renders:

import dynamic from "next/dynamic";

const Snake = dynamic(() => import("@/components/games/snake").then((m) => m.Snake), {
  ssr: false,
  loading: () => ,
});

Pin the registry (optional)

@gamekitui/ installs resolve straight from the official shadcn registry directory — no setup needed. If you'd rather pin the registry in your project config:

npx shadcn@latest registry add @gamekitui

Or add "@gamekitui": "https://gamekitui.com/r/{name}.json" to the registries field of your components.json by hand. You can also install any game by its direct URL: npx shadcn@latest add https://gamekitui.com/r/snake.json.

⚙️ Shared props

Every game accepts a common subset of props:

🗂️ Repository layout

apps/web                  Next.js 16 marketing + docs site; serves /r/*.json
packages/registry         The game sources (one self-contained file each)
packages/game-core        Shared contract types + reference hooks (zero runtime)
packages/ui               shadcn primitives used by the site
scripts/build-registry.ts Emits apps/web/public/r/*.json from the game sources

🛠️ Development

bun install
bun run dev            # builds the registry, then starts the site on :3001

Other scripts:

bun run build          # registry build + next build
bun run check-types    # typecheck every workspace
cd packages/registry && bun smoke.tsx   # render smoke test for every game

🤝 Contributing

Contributions are welcome! See CONTRIBUTING.md for the "add a new game" guide — the engine/wrapper template, the shared props contract, the theme-token mapping, and the size budget. Please also review our Code of Conduct.

Found a bug or have an idea? Open an issue.

⚠️ Disclaimer

GameKit UI is an independent, unaffiliated community project. It is not built, sponsored, or endorsed by the shadcn/ui team. It uses the shadcn registry system. The shadcn- prefix is reserved for official projects, which is why this project is named gamekitui (not shadcn-games).

📄 License

MIT © GameKit UI contributors

Built with ❤️ for the shadcn community.

Read the rest on GitHub →

Browse every shadcn registry we track →