widgets · ratatui's widget examples on intuiTUIve
Screenshots
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ┌─ Bordered ─────────────┐╭─ Styled ───────────────╮╭─ Rounded red ────────────╮ │A plain border, all four││Bold italic blue on ││A rounded border in red, │ │sides. ││black, the border and ││its title in bold. │ │ ││the inside. ││ │ │ ││ ││ │ │ ││ ││ │ └────────────────────────┘╰────────────────────────╯╰──────────────────────────╯ ┏━ Thick ━━━━━━━━━━━━━━━━┓╔════════ Double ════════╗╭─ Left ─────────── Right ─╮ ┃A thick border. ┃║A double border, its ║│Titles left, right and on │ ┃ ┃║title in the middle. ║│the bottom edge. │ ┃ ┃║ ║│ │ ┃ ┃║ ║│ │ ┃ ┃║ ║│ │ ┗━━━━━━━━━━━━━━━━━━━━━━━━┛╚════════════════════════╝╰─ Bottom ─────────── 1/9 ─╯ ── Sides ─────────────────┌╌ Dashed ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌┐╭─ Shadow ────────────────╮ Only the top and the ╎Dashes, light and heavy.╎│A shadow down the right │▒ bottom. ╎ ╎│and along the bottom. │▒ ╎ ╎│ │▒ ╎ ╎│ │▒ ╎ ╎│ │▒ ╎ ╎╰─────────────────────────╯▒ ──────────────────────────└╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌┘ ▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Centred ──────────────╮╭─ Right ────────────────╮╭─ Justified ──────────────╮ │ Each line ││ Each line││Each line but the last is│ │ sits in the middle ││ sits at the right││spread to the whole width,│ │ of the panel. ││ of the panel.││the words spaced out. │ ╰────────────────────────╯╰────────────────────────╯╰──────────────────────────╯ ╭─ Wrapped ────────────────────────────────────────╮╭─ No wrap ────────────────╮ │Toasted barley salad. Toast a cup of pearl barley ││A line too long for its p…│ │in a dry pan until it smells of popcorn, then ││ │ │simmer it for half an hour. Drain it, dress it ││ │ │while warm with lemon, olive oil and a little ││ │ │honey, and fold in chopped parsley, cucumber and ││ │ │feta. It keeps for three days, and tastes better ││ │ │on the second. ││ │ │ ││ │ │ ││ │ ╰──────────────────────────────────────────────────╯╰──────────────────────────╯ ╭─ Masked ───────────────╮╭─ Hyperlink ────────────────────────────────────────╮ │Password: ││The project's home: │ │correct-horse-battery ││rs-rich on GitHub │ │ ││ │ │m shows or masks it ││A terminal with OSC 8 links opens it. │ ╰────────────────────────╯╰────────────────────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ List ───────────────────────╮╭─ Chat, bottom to top ────────────────────────╮ │ Apples ││ │ │ Barley ││ │ │> Carrots ││ │ │ Dates ││ │ │ Eggs ││ │ │ Fennel ││ │ │ Garlic ││ │ │ Honey ││ │ │ Ink for the printer ││ │ │ Jam ││ │ │ Kale ││ Ben: Hello! │ │ Lemons ││ Ana: How was the week? │ │ ││ Ben: Fine, and you? │ │ ││ Ana: Dinner tonight? │ │ ││ Ben: The new place on the corner has a long│ │ ││ menu and short queues on a Tuesday. │ │ ││ Ana: Did you book somewhere? │ │ ││>> Ben: Table for four at eight, by the │ │ ││>> window. │ │ ││ Ana: On my way, ten minutes. │ ╰─ ↑/↓ move · Tab the chat ────╯╰─ multi-line, scroll padding ─────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Table ──────────────────────────────────────────────────────────────────────╮ │ Dish Course Price Time│ │ │ │ Lentil soup Starter 6.50 20 min│ │ Beetroot salad Starter 7.00 15 min│ │🍴 Mushroom risotto Main 14.00 35 min│ │ Fish pie Main 16.50 45 min│ │ Chickpea curry Main 13.00 30 min│ │ Apple crumble Dessert 6.00 40 min│ │ Lemon tart Dessert 6.50 25 min│ │ Cheese board Dessert 9.00 5 min│ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ 8 dishes 78.50 │ ╰─ ↑/↓ row · ←/→ cell · v the table app ───────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Table app · emerald ────────────────────────────────────────────────────────╮ │ Name Address Email │ │ Ada Marsh 4 Willow Row ada.marsh@example.com █│ │ Eastbrook █│ │ EB2 7QL █│ │ █│ │ █ Ben Okafor 17 Quarry Hill ben.okafor@example.com █│ │ Low Fenton █│ │ LF9 1AA ║│ │ ║│ │ Chloe Ruiz 2 Harbour Steps chloe.ruiz@example.com ║│ │ Portwick ║│ │ PW1 3DS ║│ │ ║│ │ Dev Patel 88 Mill Lane dev.patel@example.com ║│ │ Crossford ║│ │ CF4 8NT ║│ │ ║│ │ ║│ │ ║│ │ ║│ ╰─ ↑/↓ row · ←/→ cell · c colours · v the first table ─────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Default: a line between, a space each side ─────────────────────────────────╮ │ Overview │ Logs │ Metrics │ Settings │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ A dot between, a space each side ───────────────────────────────────────────╮ │ Overview • Logs • Metrics • Settings │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ Nothing between, brackets each side ────────────────────────────────────────╮ │[Overview][Logs][Metrics][Settings] │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ In the middle ──────────────────────────────────────────────────────────────╮ │ Overview │ Logs │ Metrics │ Settings │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ Content ────────────────────────────────────────────────────────────────────╮ │ │ │ │ │ Metrics │ │ │ │ The content of the selected tab, centred. │ │ │ │ │ │ │ ╰──────────────────────────────────────────────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Down the right, with arrows ────────────────────────────────────────────────╮ │Line 4: the quick brown fox jumps over the lazy dog, 4 times over, and then ↑│ │Line 5: the quick brown fox jumps over the lazy dog, 5 times over, and then █│ │Line 6: the quick brown fox jumps over the lazy dog, 6 times over, and then ↓│ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ Down the left, no track ────────────────────────────────────────────────────╮ │┃Line 4: the quick brown fox jumps over the lazy dog, 4 times over, and then │ │ Line 5: the quick brown fox jumps over the lazy dog, 5 times over, and then │ │ Line 6: the quick brown fox jumps over the lazy dog, 6 times over, and then │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ Along the bottom, a begin arrow and a thumb of its own ─────────────────────╮ │ the quick brown fox jumps over the lazy dog, 1 times over, and then rests in │ │ the quick brown fox jumps over the lazy dog, 2 times over, and then rests in │ │◄─────▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬─────────────────────│ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭─ Along the bottom, a track of its own ───────────────────────────────────────╮ │ the quick brown fox jumps over the lazy dog, 1 times over, and then rests in │ │ the quick brown fox jumps over the lazy dog, 2 times over, and then rests in │ │ the quick brown fox jumps over the lazy dog, 3 times over, and then rests in │ │ the quick brown fox jumps over the lazy dog, 4 times over, and then rests in │ │-----####################################################---------------------│ ╰──────────────────────────────────────────────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Surrounding days ───╮ ╭─ Sunday first ───────╮ ╭─ Events ───────────────────╮ │ October 2026 │ │ November 2026 │ │ 5 Oct Harvest fair │ │ Mo Tu We Th Fr Sa Su │ │ Su Mo Tu We Th Fr Sa │ │16 Oct Team offsite │ │ 28 29 30 1 2 3 4 │ │ 1 2 3 4 5 6 7 │ │31 Oct Lantern night │ │ 5 6 7 8 9 10 11 │ │ 8 9 10 11 12 13 14 │ │11 Nov Remembrance │ │ 12 13 14 15 16 17 18 │ │ 15 16 17 18 19 20 21 │ │26 Nov Thanksgiving │ │ 19 20 21 22 23 24 25 │ │ 22 23 24 25 26 27 28 │ │ │ │ 26 27 28 29 30 31 1 │ │ 29 30 │ │ │ │ │ │ │ │ │ ╰──────────────────────╯ ╰──────────────────────╯ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╰─ n/p month ────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Behind ─────────────────────────────────────────────────────────────────────╮ │This panel sits under the pop-up. Press p to open it: a box of 60% by 20% of │ │the screen, centred, with a shadow over what is below. │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╭─────────────────── Popup ────────────────────╮ │ │ │A pop-up over the blue panel, with a shadow. │ │ │ │p or Esc closes it. │ │ │ ╰──────────────────────────────────────────────╯ │ │ │ │ │ │ │ ╰──────────────────────────────────────────────────────────────────────────────╯ ╭───────────────╮ ╭───────────────╮ ╭───────────────╮ ╭─────────────────╮ │ Light │░ │ Medium │▒ │ Dark │▓ │ Dim │ │ │░ │ │▒ │ │▓ │ │ ╰───────────────╯░ ╰───────────────╯▒ ╰───────────────╯▓ ╰─────────────────╯ ░░░░░░░░░░░░░░░░░ ▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒▒ ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom ╭─ Top left ───────────────────────────┬─ Top right ───────────────────────────╮ │Four panes share their borders. │The lines join where they meet. │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ┢━ Bottom left ━━━━━━━━━━━━━━━━━━━━━━━━╅─ Bottom right ────────────────────────┤ ┃The pane with the focus is drawn ┃↑/↓, Tab or a click pick a pane. │ ┃thick. ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┃ ┃ │ ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┹───────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom Three stock buttons, each with a look of its own from theme styles: a face, a lit top edge and a shaded bottom one, picked while it has the focus or the pointer, and pressed while a button is held on it. ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔ Red Green Blue ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ Green pressed, 1 time. ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit
Block Text List Table Tabs Scrollbar Calendar Popup Borders Custom Three stock buttons, each with a look of its own from theme styles: a face, a lit top edge and a shaded bottom one, picked while it has the focus or the pointer, a╭─ Help ───────────────────────────────────────────────╮ │? Search keys › │ │custom │ │ ↓ the next button │ │ ↑ the button before │ │ │ │ ← the tab before │ │ → the next tab │ │ q quit │ │ 1 the Block tab │ │ 2 the Text tab │ │ 3 the List tab │ │ 4 the Table tab │ │ 5 the Tabs tab │ │ 15 keys · more below · type to search · ↑↓ scroll · │ ╰──────────────────────────────────────────────────────╯ ←/→ or 1-9, 0 tabs · ? keys · Ctrl+P commands · q quit