featurednextjsreacttypescripttailwindcssdesign-systemcomponentscliradix-ui

entrepta

A dark-first design system for sites that look like they were built by an engineer.

published
May 18, 2026
read
2 min
words
376
stack
8

Overview

entrepta is a dark-first design system for sites that look like an engineer built them. Tabs, a command palette, a status bar, shell prompts, serif italic next to mono.

Components are copied into your repo as source, in the shadcn model. No SDK, no runtime. You own the code.

npx @entrepta/cli@latest init
npx @entrepta/cli@latest add button card command-palette

What you get

33 components across 6 sections, in React 19, Tailwind v4 and CSS variables.

SectionComponents
PrimitivesButton, Badge, Card, Dialog, Dropdown, Tooltip, Kbd, Tabs
FormsInput, Textarea, Checkbox, Switch, Field, FilterPill
LayoutStatusBar, TopNav, ThemeSwitcher, ModeToggle, Sidebar, PageOutline
ContentCodeBlock, SectHead, doc parts
FeedbackToast, Skeleton, CommandPalette, ChromeMessage, PageLoading
MotionReveal, TypeIn, RollingNumber, Spotlight, ArrowLink

Six theme presets: entrepta, blossom, marmalade, julia, ivy and bosco. Pick one, or install all six and switch at runtime. Every text color clears WCAG AA in all 12 theme and mode combinations, and a test measures it on every change.

Built for coding agents

entrepta is meant to be installed and used by Claude Code, Cursor or Codex as much as by people.

  • An AGENTS.md for your project. The AGENTS.md button on the site builds one: pick the framework, theme and components, and it says how to install, where things live, which token goes where and how each component is used.
  • Every docs page in Markdown. Add .md to any docs URL, such as /docs/components/button.md.
  • /llms.txt indexes every page, and /llms-full.txt is the whole site in one file.

Install

npx @entrepta/cli@latest init --theme=ivy
 
# all six themes, switchable at runtime
npx @entrepta/cli@latest init --theme=ivy --themes=all
 
npx @entrepta/cli@latest add button card field

init writes the tokens, the cn helper and entrepta.json. add copies each component with everything it imports and installs its npm packages. It works in Next.js (App or Pages Router) and Vite, and never overwrites a file without --overwrite.

Every component page in the docs also has a Manual tab with its dependencies and the source, imports already rewritten.

Use it

import { Button } from "@/components/entrepta/button"
import { Card, CardHeader, CardLabel, CardTitle } from "@/components/entrepta/card"
 
export function Launch() {
  return (
    <Card variant="featured">
      <CardHeader>
        <CardLabel>launch</CardLabel>
      </CardHeader>
      <CardTitle>
        Ship it <em>tonight.</em>
      </CardTitle>
      <Button>deploy</Button>
    </Card>
  )
}

Built with entrepta

This site runs on it. entrepta started here, and v2 was built here first before it moved into the design system.

Stack

React 19, Next.js 15 as the reference setup, Tailwind v4, Radix UI, CSS variables, TypeScript strict, class-variance-authority, Phosphor icons, and motion for the components that animate through JavaScript.

License

MIT.

https://entrepta.vercel.app

https://github.com/imnotannamaria/entrepta

Active theme: entrepta, dark mode.