Getting started
OpenTUI is a TypeScript library for building terminal user interfaces.
Installation
OpenTUI requires Bun as the runtime.
mkdir my-tui && cd my-tui
bun init -y
bun add @opentui/core
Hello world
Create index.ts:
import { createCliRenderer, Text } from "@opentui/core"
const renderer = await createCliRenderer({
exitOnCtrlC: true,
})
renderer.root.add(
Text({
content: "Hello, OpenTUI!",
fg: "#00FF00",
}),
)
Run it:
bun index.ts
You should see green text. Press Ctrl+C to exit.
Composing components
Components nest naturally. Here’s a bordered panel with content:
import { createCliRenderer, Box, Text } from "@opentui/core"
const renderer = await createCliRenderer({
exitOnCtrlC: true,
})
renderer.root.add(
Box(
{ borderStyle: "rounded", padding: 1, flexDirection: "column", gap: 1 },
Text({ content: "Welcome", fg: "#FFFF00" }),
Text({ content: "Press Ctrl+C to exit" }),
),
)
Box and Text are factory functions. The first argument is props; additional arguments are children.
What’s next
Core concepts
- Renderer - The rendering engine
- Layout - Flexbox positioning
- Constructs - The declarative component API