Svelte 5 components and the theme shared by OpenCount, LocalAssistant, Homerun, Sergio's, Nuvio Web and Penombre. Every page shows the component live and the code that renders it.

Blocks

25

App-level pieces the apps shared copies of.

Primitives

45

The shadcn-svelte components, as the apps customised them.

Modules

6

Helpers for toasts, titles, appearance and haptics.

Appearance

Install

Terminal 
bun add -d @orochibraru/ui

Import the theme right after Tailwind in the app's root stylesheet. It brings the tokens, the variants and an @source that makes Tailwind scan the package.

app.css 
@import "tailwindcss";
@import "@orochibraru/ui/theme.css";

Use with AI

The package ships an MCP server with every component's docs and code: your editor's assistant can list, search and read them. Every page also has a Copy page button for its Markdown.

Add to Cursor Add to VS Code
Claude Code 
claude mcp add orochibraru-ui -- npx -y @orochibraru/ui
mcp.json 
{
  "mcpServers": {
    "orochibraru-ui": {
      "command": "npx",
      "args": [
        "-y",
        "@orochibraru/ui"
      ]
    }
  }
}

Without installing anything: llms.txt, llms-full.txt and the hosted MCP endpoint at /mcp.

The tabbed-section pattern runs live in a demo section.