stubui — ASCII UI component library

Design UI in plain text.

A shared notation language for describing UI layout in ASCII. Built for designers prompting Claude Code.

(~ fill ~)   →  stretches to fill available space
[ fixed  ]   →  explicit/fixed width
( hug )      →  shrinks to fit content

Components (99)

(~ - - - - - - ~)
(~              ~)
(~ - - - - - - ~)

Aspect Ratio

Maintains a consistent width-to-height ratio for content

+----------------------+
| Card Title           |
| Card description     |
|                      |
| [ Action ]           |
+----------------------+

Card

A contained surface for grouping related content

[ panel ] | (~ panel ~)

Resizable

Drag-to-resize panel layout with a movable divider

+------------------+
| content          |
| content          | |
| content          | |
| content          |
+------------------+

Scroll Area

Custom scrollable area with styled scrollbar

- - - - - - - - - -

Separator

A visual divider between content sections

[ sidebar ] (~ content ~)
[ sidebar ] (~ content ~)
[ sidebar ] (~ content ~)
[ sidebar ] (~ content ~)

Sidebar

A fixed side navigation panel with collapsible sections

( Home ) / ( Section ) / ( Page )

Breadcrumb

Hierarchical navigation trail showing current location

[ File ] [ Edit ] [ View ] [ Help ]

Menubar

A horizontal menu bar with dropdown menus

[logo] (~ Home  Products  About ~) [btn]

Navigation Menu

A top-level site navigation with dropdown panels

[ < ] [ 1 ] [ 2 ] [●3●] [ 4 ] [ 5 ] [ > ]

Pagination

Controls for navigating between pages of content

[ Tab 1 ] [ Tab 2 ] [●Tab 3●]
+--------------------------------+
| Tab content                    |
+--------------------------------+

Tabs

Switchable content panels organized as tabs

+---------------------------+
| Are you sure?             |
| This cannot be undone.    |
|                           |
| [ Cancel ]   [ Confirm ]  |
+---------------------------+

Alert Dialog

A modal dialog requiring user confirmation before proceeding