brainless

Overview

brainless, by Ben Swerdlow, recreates the terminal interfaces of Claude Code, OpenAI Codex and Grok Build as shadcn components. It is aimed at docs, demos and product surfaces that need to show an agent session without screenshots or video. The registry serves 40 items: individual UI parts for each tool and complete session blocks.

Each part is built from semantic HTML rather than styled text. Tool calls are real <details> disclosures, permission prompts are arrow-key radio groups, working lines are aria-live status regions, and composers wrap a real text input. The default install adds the Claude, Codex and Grok session blocks together.

Features

• Claude Code parts: Welcome header, messages, thinking line, tool calls, todo list, inline diffs, permission prompt, composer with effort chips and slash menu.
• Codex parts: Launch card, messages, exec lines with expandable output, working line, prompt, full-screen diff pager and permissions chooser.
• Grok parts: Launch card, status bar, events, thoughts, tool and write cards, plan approval, project picker, shortcuts and settings modals.
• Session blocks: Complete Claude Code, Codex and Grok screens, including a mid-turn Grok session.
• Onboarding demo: An interactive sign-up flow block with a typed assistant line.
• Accessibility: Keyboard-operable disclosures, radio groups, live regions and off-screen labels for diffs.

Tech stack

• React, Tailwind CSS
• shadcn registry

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @brainless/component-name