A DOS design system
For interfaces that invite focus.
Amber on black
The first screen I loved was my dad's 286. Amber phosphor on not-quite-black. The soft sound of floppy disks. A blinking cursor.
I played Commander Keen and Space War. I wrote story games in Turbo Pascal. The machine didn't notify me, didn't scroll infinitely, didn't fight for my attention. It just waited—ready when I was.
That's what eiDotter is for. Building interfaces that feel like that cursor: present, patient, yours to command.
Your attention belongs to you.
5 CGA Themes
One CSS import. Entire palette swap. Each theme derived from real CGA hardware modes.
Built for Clarity
5 CGA Themes
Switch between amber-mono, cga-amber, mode4-p0, mode4-p1, and mode5 with a single CSS import. Each derived from real hardware palettes.
Keyboard First
Every component is fully keyboard navigable with visible focus states. DOS taught us to type, not click.
WCAG 2.1 AA
Accessibility isn't an afterthought. Semantic HTML, ARIA attributes, and tested with real assistive technology.
Tree Shakeable
Import only what you need. Each component is independently bundled for minimal footprint.
Token Pipeline
JSON sources through Style Dictionary into CSS, JS, and Tailwind preset. Validated at build time. One source of truth, every format.
MDX Documentation
Storybook 10 with MDX docs for all 18 components. Live examples, API tables, and accessibility audits built in.
See It In Action
19 production-ready components across 5 CGA themes, with variants, states, and that unmistakable phosphor glow.
# Install the package
npm install eidotter
# Import components
import { Button, Card, Terminal } from 'eidotter'
import 'eidotter/themes/amber-mono.css'
# Use in your app
<Button variant="primary">
Execute
</Button>Install via npm
Add eiDotter to your project with npm install eidotter or your preferred package manager.
Pick a theme
Import a theme CSS file like eidotter/themes/amber-mono.css for the full phosphor experience.
Use components
Import individual components. They're tree-shakeable, so bundle only what you need.
Tailwind? We got you
Use our preset: require('eidotter/tailwind') in your config.
Ready to Boot Up?
Join the developers building interfaces with intention. eiDotter is open source and ready for your next project.