tui-design

Design keyboard-first terminal user interfaces with layout and accessibility patterns.

2|Updated Apr 10, 2026
One-click install
npx skills add https://github.com/t0lab/harness-kit --skill tui-design-t0lab
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: tui-design
Source: https://github.com/t0lab/harness-kit/tree/main/.agents/skills/tui-design
Command: npx skills add https://github.com/t0lab/harness-kit --skill tui-design-t0lab

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Provides a comprehensive, framework-agnostic design system and checklist for building usable, keyboard-first terminal user interfaces that scale from simple overlays to full dashboards while remaining accessible, responsive, and performant.

Core Features & Use Cases

  • Layout paradigms: persistent multi-panel, Miller columns, drill-down stacks, widget dashboards, IDE three-panel, and overlays for clear spatial organization.
  • Interaction & accessibility: keyboard layering, focus management, contextual footers, help tiers, and accessibility rules (NO_COLOR, contrast, monochrome testing).
  • Visual & data patterns: semantic color slots with ANSI/256/truecolor fallbacks, braille/sparkline visualizations, block and box-drawing recipes, and animation/refresh guidelines for flicker-free rendering.
  • Operational checklists: resize & compatibility rules, anti-pattern validation, and production readiness tests for tmux/SSH/Windows/WSL use cases.
  • Use case example: design a monitoring dashboard that shows per-core CPU braille sparklines, process tables, and a detail pane with drill-down navigation while preserving keyboard-first workflows.

Quick Start

Ask the skill to design a responsive multi-panel terminal dashboard with keyboard-first navigation, accessible color slots, and braille sparklines for CPU and network metrics.

Frequently Asked Questions about tui-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design a responsive terminal UI layout for a multi-panel dashboard?

Build responsive terminal UI layouts using persistent multi-panel, widget dashboard, or IDE three-panel paradigms with defined resize rules. This provides clear spatial organization and adaptability for high-density command-line dashboards across varying terminal window sizes.

What's the best way to implement keyboard-first navigation in a TUI application?

Implement keyboard-first navigation in TUI applications using keyboard layering, focus management, and contextual footers. This approach ensures spatial consistency and keyboard fluency for users navigating complex command-line interfaces without relying on a mouse.

How do braille sparklines work for terminal data visualization?

Braille sparklines render compact data visualizations directly in terminal UIs using Braille characters and block drawing recipes. They enable high-density, flicker-free rendering of metrics like CPU or network data within monitoring dashboards.

Does this TUI design system work with Ratatui, Textual, and Bubbletea frameworks?

Yes, this terminal UI design system applies framework-agnostic layout paradigms to Ratatui, Textual, Bubbletea, and Ink. It provides resize rules, semantic color slots, and accessibility checklists that integrate with these frameworks for production-ready command-line interfaces.

How do I handle color accessibility and NO_COLOR fallbacks in terminal interfaces?

Handle terminal UI color accessibility using semantic color slots with ANSI, 256, and truecolor fallbacks. Apply NO_COLOR support, contrast rules, and monochrome testing checklists to ensure command-line interfaces remain accessible across all terminal environments.

What are common anti-patterns and compatibility issues when building TUIs for tmux and SSH?

Common terminal UI anti-patterns include poor resize handling, flicker rendering, and inadequate keyboard focus management. Validate production readiness using compatibility checklists for tmux, SSH, Windows, and WSL to ensure stable command-line interface performance.