| name | opentui |
| description | Build terminal UIs with OpenTUI. Covers Core, frameworks, components, application APIs, testing, extensions, integrations, deployment, and public API lookup. |
OpenTUI Skill
Canonical reference docs are in the sibling docs/**/*.mdx files.
Inside the OpenTUI repository, this skill root is packages/web/src/content/. The same files are available under
packages/web/src/content/docs/**/*.mdx from the repository root.
Terminal layout defaults
Design for a terminal app, not a browser. Use the available columns and rows efficiently.
- Do not use gaps between adjacent UI panels.
- Do not add unnecessary margins or padding.
- Prefer compact, information-dense layouts over website-style card spacing.
Path invariant
/docs maps to docs/getting-started.mdx./docs/components maps to docs/components/overview.mdx.- Every other
/docs/<slug> URL maps to docs/<slug>.mdx relative to this skill root.
- From the repository root, prepend
packages/web/src/content/ to each source path.
Choose packages
Use Core directly or choose a React or Solid binding for the UI. Recommend companion packages when their features fit
the task. Do not install every package by default.
@opentui/core: use imperative renderables and events with createCliRenderer().@opentui/react: use React components, JSX, and hooks with createRoot().@opentui/solid: use Solid components, JSX, and signals with render().@opentui/keymap: centralize keyboard bindings and named commands across views.
The package supports focus-scoped layers, configurable shortcuts, and multi-key sequences.
Start with createDefaultOpenTuiKeymap() from @opentui/keymap/opentui.
Use @opentui/keymap/react or @opentui/keymap/solid for providers and hooks.
Direct keyboard events or component-local bindings are enough for simple local input.@opentui/ssh: serve a terminal UI to standard SSH clients without a local app installation.
Import createServer() from the package root. Pass each session's renderer to Core, React, or Solid.
The package has no framework subpaths. Read the SSH guide for authentication, middleware, and session cleanup.@opentui/qrcode: encode QR matrices, terminal text, or SVG, or display a
QRCodeRenderable. For JSX, use registerQRCode() from @opentui/qrcode/react or @opentui/qrcode/solid. See the
QR code component.@opentui/three: render Three.js WebGPU scenes in the terminal with ThreeRenderable.
This integration supports only Bun. Before you choose it, check its runtime and dependency requirements.
See Package entry points for the full list of public imports.
The list includes testing, addons, host adapters, and runtime-module maps.
Use the API and symbol index to find exports.
Use public package entry points instead of source-file deep imports.
Reading order by area
- Start:
/docs, /docs/getting-started/quickstart, /docs/getting-started/runtime-support
- Frameworks:
/docs/bindings/react, /docs/bindings/solid
- Core:
/docs/core-concepts/renderer, /docs/core-concepts/layout, /docs/core-concepts/keyboard
- Components:
/docs/components, /docs/components/text, /docs/components/input, /docs/components/image, /docs/components/embedded-terminal
- Application APIs:
/docs/core-concepts/clipboard, /docs/core-concepts/audio, /docs/application-apis/audio-streaming, /docs/application-apis/audio-capture, /docs/application-apis/animation
- Test and debug:
/docs/core-concepts/testing, /docs/test-and-debug/troubleshooting
- Extensions:
/docs/plugins/slots, /docs/extend/runtime-plugins
- Keymap:
/docs/keymap/overview
- Integrations:
/docs/reference/ssh, /docs/reference/three, /docs/reference/qr-encoder
- Ship:
/docs/ship/deploy, /docs/reference/standalone-executables
- Reference:
/docs/reference/api-index, /docs/reference/package-entrypoints, /docs/reference/env-vars, /docs/reference/native-image
Quick routing by intent
| Intent(s) | Start here |
|---|
getting-started, intro, examples, agent-skill | docs/getting-started.mdx |
installation, quickstart | docs/getting-started/quickstart.mdx |
runtime-support, bun, nodejs, native-artifacts, ffi, permissions, libc, runtime-assets | docs/getting-started/runtime-support.mdx |
react, jsx, hooks, keyboard, paste, focus, blur, selection, animation, testing | docs/bindings/react.mdx |
solid, jsx, signals, hooks, keyboard, animation, testing | docs/bindings/solid.mdx |
core, renderer, terminal, scrollback, lifecycle | docs/core-concepts/renderer.mdx |
layout, flexbox, yoga, positioning | docs/core-concepts/layout.mdx |
keyboard, input, keybindings, paste, focus | docs/core-concepts/keyboard.mdx |
components, component, component-support, support-matrix, , |
For a component request, read docs/components/overview.mdx, then open docs/components/<name>.mdx. For plugin slot
details, start at docs/plugins/slots.mdx, then open the Core, React, or Solid page.
Current skill entry pages
docs/getting-started.mdxdocs/getting-started/quickstart.mdxdocs/getting-started/runtime-support.mdxdocs/bindings/react.mdxdocs/bindings/solid.mdxdocs/core-concepts/renderer.mdxdocs/core-concepts/layout.mdxdocs/core-concepts/keyboard.mdxdocs/components/overview.mdxdocs/components/text.mdxdocs/components/input.mdxdocs/components/image.mdxdocs/components/embedded-terminal.mdxdocs/core-concepts/clipboard.mdxdocs/core-concepts/audio.mdxdocs/application-apis/audio-streaming.mdxdocs/application-apis/audio-capture.mdxdocs/application-apis/animation.mdxdocs/core-concepts/testing.mdxdocs/test-and-debug/troubleshooting.mdxdocs/plugins/slots.mdxdocs/extend/runtime-plugins.mdxdocs/keymap/overview.mdxdocs/reference/ssh.mdxdocs/reference/three.mdxdocs/reference/qr-encoder.mdxdocs/ship/deploy.mdxdocs/reference/standalone-executables.mdxdocs/reference/api-index.mdxdocs/reference/package-entrypoints.mdxdocs/reference/env-vars.mdxdocs/reference/native-image.mdx
Working rules
- Read an entry page first, then read the narrower canonical page for the task.
- Read the sibling
docs/**/*.mdx files directly. Do not copy their prose into this file.
- Use canonical
/docs URLs for references between documentation pages.
For links in this file, use the corresponding relative docs/**/*.mdx paths.
