Introduction

Not a traditional component library

Tennantite breaks Minecraft’s GUI language into copyable React source. It ships through two channels: an npm package and source directories. Components are built on Base UI and Tailwind CSS v4, driven by design tokens by default.

The 71 components split into a core library and a separate mod area: 60 vanilla/shared components plus 11 mod components; the 37 full-screen interfaces are 27 vanilla screens and 10 mod screens. Full screens are not black boxes; they are compositions of smaller parts.

Five design principles

1. Compose by layer, not as full-screen black boxes. Screens are built from ScreenPanel, PlayerInventory, Slot and friends.
2. Keep UI and game logic separate. Components read no saves and send no requests; they render the data passed in.
3. Style through tokens. Geometry and color come from CSS variables; override variables to reskin.
4. Stay pixel-first. 1 GUI px equals 2 CSS px by default; textures use image-rendering: pixelated.
5. Prefer static rendering. Presentational components stay RSC-compatible and interactive boundaries stay small.

Layers

Layer	Content	Count
L0	@tennantite/tokens / @tennantite/textures	2 packages
L1	Primitives: Button, Input, Slider, Tabs…	13
L2	Containers: Panel, Grid, Slot, ScreenPanel…	12
L3	HUD and full-screen interfaces	41

Read the layer guide, or browse Components.

Distribution

@tennantite/ui is published on npm. Core components are also distributed as source through the shadcn registry endpoint (https://tennantite.rikka.cc/r/<name>.json) — install with npx shadcn add @tennantite/<name>; mod packages use npm install. See Registry and Installation.

Current status

Next

Start with Installation, then browse Components and Blocks.