>> @bdocs/dui v0.7.0
$pnpm add @bdocs/dui▍
DUI

Terminal UI toolkit for Node.js CLIs — boxes, colors, logging, lists, dividers, spinners, tables, and more.

# 02 / showcase

dui — lists
$ node lists.js
dui lists — bullet, ordered, tasks
• Install DUI with pnpm
• Import the components
• Build beautiful CLIs
• Share with community
1. Clone repository
2. Install dependencies
3. Build project
4. Run tests
✔ Write documentation
✔ Add unit tests
○ Review pull request
○ Deploy to production
dui — grid & layout
$ node dashboard.js
dui — grid & layout — dashboard
╭── System Dashboard ────────────────────────────╮
│ │
│ CPU ████████░░░░ 65% MEM ████░░░░ 3.2G │
│ DSK ██████░░░░░░ 42% NET ██████░░ 1.5M │
│ │
│ API ● api-gateway up:12d │
│ DB ● postgres up:2h ! │
│ CACHE ● redis up:12d │
│ │
│ ✖ Disk /dev/sda1 87% │
│ ⚠ SSL cert expires 14d │
╰── Section • Grid • Badge ──────────────────────╯
dui — diff
$ node diff.js
dui diff — unified diff view
src/greet.ts
-export function greet(name: string) {
+export function greet(name: string,
+ polite = false) {
const prefix = polite ? "Hi " : "Hey "
- console.log("Hello", name);
+ console.log(prefix + name);
-export const VERSION = "1.0.0";
+export const VERSION = "1.1.0";
+export const AUTHOR = "Bolt Docs";
1 file changed, 5 insertions, 2 deletions
dui — true color
$ node colorize.js
dui colors — 24-bit true color engine
color gradient engine HEX
RGB OKLCH
████████████ True Color
12 built-in named colors • 16M RGB palette
dui — animation
$ node animate.js
dui animation — easing curves
Easing Curves (60 fps)
linear ██████████████████████████████
ease-out ████████████████████████░░░░░░
ease-in-out██████████████████████████████
25+ easing functions • spring physics
dui — boxes
$ node boxes.js
dui boxes — border styles
╔══════════════════════════╗
║ DUI Terminal UI ║
║ Boxes & Borders ║
║ • double border ║
║ • single border ║
║ • round corners ║
╚══════════════════════════╝
→ bordered output for CLIs