wtf is brainless?

Brainless is a library of ready made React components that recreate the look and feel of terminal based AI coding assistants, specifically Claude Code, OpenAI Codex, and Grok. Instead of pasting screenshots or embedding an iframe when you want to show what one of these tools looks like in action, you can drop in a real, working component that matches the actual terminal interface closely. The components are built using the shadcn UI system, which means they are copy paste style pieces you add directly into your own project rather than a typical package you just import from a registry. Each family of components covers the different pieces you would see in a real session: headers, chat messages, thinking or reasoning steps, tool calls, code diffs, permission prompts, the text input box, and slash command menus. There are also full prebuilt session blocks that combine these pieces into a complete Claude, Codex, or Grok style conversation view, including a live active state for Grok. To make sure the components actually look like the real tools, the project includes a capture system that runs these coding agents inside a terminal multiplexer called tmux, records the raw output as ANSI, HTML, and plain text frames, and stores those captures for comparison while building and refining the components. Installing brainless works through the shadcn command line tool, either by adding the whole registry under a namespace, pulling a component directly by URL, or referencing the GitHub repository path for a specific piece. The project itself is a documentation website built with Next.js, and development uses the Bun runtime and package manager. This is a useful tool for developers who write documentation, build product demos, or design marketing pages that need to accurately show what an AI coding agent's terminal interface looks like, without relying on static screenshots. It is released under the MIT License and has 405 stars.