skills.rest
compozy
compozyOFFICIAL
Explore all skills by this author →
Website𝕏@compozyaiGitHub

tui-design

Standardize terminal UI design across Ratatui, Ink, Textual, and Bubble Tea.

2.5k|134|Updated Mar 28, 2026
Search Tags:#accessibility#framework-agnostic#design-system#layout-patterns#terminal-ui#color-system#tui-design
One-click install
npx skills add https://github.com/compozy/compozy --skill tui-design-compozy
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tui-design
Source: https://github.com/compozy/compozy/tree/main/.agents/skills/tui-design
Command: npx skills add https://github.com/compozy/compozy --skill tui-design-compozy

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Terminal UI design is fragmented across frameworks, leading to inconsistent UX and higher development time. A universal TUI design system standardizes patterns, tokens, and interactions to accelerate build and ensure usability.

Core Features & Use Cases

  • Framework-agnostic design primitives for layout, color tokens, focus management, and keyboard navigation applicable to Ratatui, Ink, Textual, Bubble Tea, and other TUI toolkits.
  • Semantic color slots and a cohesive theme to guarantee accessible contrast and consistent branding across terminal apps.
  • Modular interaction patterns (focus traps, modal dialogs, and contextual footers) that scale from small widgets to full dashboards.

Quick Start

Describe your terminal app and request a complete TUI design system proposal

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 terminal UI that works consistently across Ratatui, Ink, and Textual?▼

A universal TUI design system provides framework-agnostic design primitives for layout, color tokens, and keyboard navigation to ensure consistent terminal UI UX across different toolkits.

What is the best way to standardize color and spacing rules for a terminal UI design system?▼

Standardize terminal UI spacing and color rules by applying semantic color slots and a cohesive theme to guarantee accessible contrast and consistent branding across terminal apps.

How do I manage focus traps and modal dialogs in a TUI design?▼

Manage TUI focus traps and modal dialogs using modular interaction patterns that scale from small widgets to full dashboards, ensuring robust keyboard navigation and focus management.

Can I use this TUI design system for a full terminal dashboard?▼

Yes, the framework-agnostic component library and modular interaction patterns scale from small widgets to full terminal dashboards, providing contextual footers and robust layout patterns.

Does a framework-agnostic TUI design system guarantee accessible contrast in terminal apps?▼

Yes, the universal TUI design system defines semantic color slots and a cohesive theme to guarantee accessible contrast and consistent branding across terminal apps.

Why do terminal interfaces often suffer from inconsistent UX and higher development time?▼

Terminal UI design is fragmented across frameworks, leading to inconsistent UX and higher development time because there is no universal design system to standardize patterns, tokens, and interactions.

Related Skills

Explore More Design & Creative Skills→
louisfghbvclouisfghbvc
4

design-consultation

Generate a complete design system with typography, color, layout, and motion tokens.

Community
Advanced
JBonfimJBonfim

tui-design

Designs keyboard-first terminal user interfaces with layouts, colors, and responsive behavior.

Community
Advanced
yankeeinlondonyankeeinlondon
3

tui

Codify terminal user interface design best practices for Ratatui and Bubble Tea.

Community
Advanced
adbertramadbertram

tailwind-4

Enforce consistent Tailwind CSS patterns for class naming and styling.

Community
Basic