demo · ratatui's classic demo on intuiTUIve
Screenshots
╭─ intuiTUIve demo ────────────────────────────────────────────────────────────────────────────────╮ │ Graphs │ World │ Colours │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Graphs ─────────────────────────────────────────────────────────────────────────────────────────╮ │Gauge: │ │███████████▊ 12.00% │ │Sparkline: │ │▃ ▅ ▁▂▂ █ ▃▄ ▇ ▄█ ▃ ▇▁▄▇ █ ▄ ▇ █ ▆ ▂ ▂ ▆ ▆▆ ▇ █ ▆ ▁▇ ▂▄ ▅ ▃▆▂ █ █ │ │█▅█▁ ███ █ ▃██ ▂█ ██ ▁█▃████▅█▃▆ █ █ █ ▃ ▆▇█ ▅ ▆ ▆█▅▇█ █ ▇██ █ █ ██▁█████ ██ ▆ ███▅████│ │████▁▅█████████▇██▂▆███▃▃███████████▆▃█▆█▄▇█▇█▂███▇███▂█████▆█▁▆▃███▃▆█▇█▄████████▃▃▁████▇████████│ │LineGauge: │ │ 12% ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━│ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ List ────────────────╮╭─ List ────────────────╮╭─ Chart ────────────────────────────────────────╮ │ Rotate the API keys ││CRITICAL Replica lag o…││20 │Y Axis ••••••••• │ │> Renew the certificat…││INFO Feature flag …││ │••• ⣀⣀⡀ ••• ••• │ │ Patch the build hosts││INFO New region on…││ │ ••• ⢀⡴⠚⠉ ⠉⠙⠢⣄ •• ⢀⡤⠆│ │ Archive last year's …││INFO Config reload…││ │ ••• ⡠⠞⠁ ⠑⢦⡀ ⢀⠔⠉ │ ╰───────────────────────╯╰───────────────────────╯│0 │⢦⡀ •••⢀⡤⠊ ••• ⠙⠢⡀ ⢀⡠⠞⠁ │ ╭─ Bar chart ────────────────────────────────────╮│ │ ⠈⠒⠤⢄⣀⣠⠤⠚⠉•• •••• ⠈⠑⠦⢤⣀⣠⠤⠖⠋ │ │ ███ ▅▅▅ ▁▁▁ ││ │ ••••••••• │ │ ▇▇▇ ▁▁▁ ▁▁▁ ███ ███ ███ ││-20│ X Axis│ │▃2▃ █9█ ▃2▃ █5█ █5█ ▃2▃ 14█ 12█ 10█ ▂1▂││ └────────────────────────────────────────────│ │B1 B2 B3 B4 B5 B6 B7 B8 B9 B10││ 120 130 140│ ╰────────────────────────────────────────────────╯╰────────────────────────────────────────────────╯ ╭─ Footer ─────────────────────────────────────────────────────────────────────────────────────────╮ │A paragraph of several lines, wrapped to fit its panel, and styled however you like. │ │ │ │For example: under the rainbow. │ │Or with every modifier: bold, dim, italic, underlined, reversed, struck through and blinking. │ │Text beyond ASCII shows as well: a coffee here costs 10€. │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
╭─ intuiTUIve demo ────────────────────────────────────────────────────────────────────────────────╮ │ Graphs │ World │ Colours │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Graphs ─────────────────────────────────────────────────────────────────────────────────────────╮ │Gauge: │ │███████████▊ 12.00% │ │Sparkline: │ │▃ ▅ ▁▂▂ █ ▃▄ ▇ ▄█ ▃ ▇▁▄▇ █ ▄ ▇ █ ▆ ▂ ▂ ▆ ▆▆ ▇ █ ▆ ▁▇ ▂▄ ▅ ▃▆▂ █ █ │ │█▅█▁ ███ █ ▃██ ▂█ ██ ▁█▃████▅█▃▆ █ █ █ ▃ ▆▇█ ▅ ▆ ▆█▅▇█ █ ▇██ █ █ ██▁█████ ██ ▆ ███▅████│ │████▁▅█████████▇██▂▆███▃▃███████████▆▃█▆█▄▇█▇█▂███▇███▂█████▆█▁▆▃███▃▆█▇█▄████████▃▃▁████▇████████│ │LineGauge: │ │ 12% ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━│ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ List ─────────────────────────────────────────╮╭─ List ─────────────────────────────────────────╮ │ Rotate the API keys ││CRITICAL Replica lag over 30 s │ │> Renew the certificates ││INFO Feature flag flipped │ │ Patch the build hosts ││INFO New region online │ │ Archive last year's logs ││INFO Config reloaded │ ╰────────────────────────────────────────────────╯╰────────────────────────────────────────────────╯ ╭─ Bar chart ──────────────────────────────────────────────────────────────────────────────────────╮ │ ▆▆▆ ▃▃▃ ▂▂▂ ███ ███│ │ ▆▆▆ ███ ███ ███ ███ ███ ▆▆▆ ███ ▅▅▅ ███│ │▃2▃ █9█ ▃2▃ █5█ █5█ ▃2▃ 14█ 12█ 10█ ▂1▂ 10█ 11█ ▆4▆ ▂1▂ █9█ █5█ ▂1▂ 15█ █8█ 15█│ │B1 B2 B3 B4 B5 B6 B7 B8 B9 B10 B11 B12 B13 B14 B15 B16 B17 B18 B19 B20│ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Footer ─────────────────────────────────────────────────────────────────────────────────────────╮ │A paragraph of several lines, wrapped to fit its panel, and styled however you like. │ │ │ │For example: under the rainbow. │ │Or with every modifier: bold, dim, italic, underlined, reversed, struck through and blinking. │ │Text beyond ASCII shows as well: a coffee here costs 10€. │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯
╭─ intuiTUIve demo ────────────────────────────────────────────────────────────────────────────────╮ │ Graphs │ World │ Colours │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Servers ──────────────────╮╭─ World ────────────────────────────────────────────────────────────╮ │Server Location ││ ⣀⣀ │ │ ││ ⣀⣠⣤⣴⣴⣾⣿⣿⡯⣿⡟⠛⠋⠉⠉⠉⠈⠉⢻⡟⠒ ⠠⣴⣲⡶⠔⠂ ⠒⠒⠚⢛⣂ ⠔ ⣐⢶⣦⣤⢀ ⢀ │ │NorthAmerica-1 Toronto ││⡄ ⣀⣀⣀⣀⡀ ⣀⣞⢿⣿⠿⣿⣿⢿⣿⣻⣦⣈⡉⠉⣦⡄ ⣰⣾⠃ ⡀ ⣂⣀⣀ ⢴⣟⣉⡠⣶⣶⡟⠏⠉⠉⠼⠻⠗⠴⠢⣠⢿⠿⠽⣁⣀ ⣀⣀⣠│ │Europe-1 Lisbon ││⠵⣶⣽⣧ ⠈⠉⠉⠁⠉⠛⠻⠙⠛⣩⣿⣟⡿⣪⣷⠆⠹⡇⢀⡤⠜⠊⢥⣤⠄ ⣠⠟⢩⡤⠙⣭⡞⠟⠋⠉⠁⠙⠟⠓ ⠈⠉⠉⡠⡨│ │SouthAmerica-1 Buenos Air… ││ ⠊⠚⠦⣤⡞⠒⠲⣤ ⠰⣍⡀⢉⡏⢻⣿⡄ ⠙⠚ ⣭⡖⠸⣷⣴⣿⡶⠂ ⢀⠤⠴⢴⡹⡿⠒⠉⠁│ │Asia-1 Tokyo ││⠤⠄⠖⠉⠁ ⠙⢷⣀ ⠈⢿⠅ ⣀⣛⡆ ⠰⢿⣿⡴⠛⠛⠋ ⠛⣶ ⢘⡖⠉⠃⠤⠄│ │ ││ ⡻ X⣀⣀⣀⣀⠛ ⣘⡻⣀⣀⣄ ⡴⡶⡂⢠⡶ ⡀⡰⣿⡤⠊ │ │ ││ ⢣ ⠘⡄⠋⠉⠉⠉⠉⠙⠛⠛⠛⠛⠭X⡶⠶⠶⠶⠶⠶⠶⣤⣤⣤⣤⣤⣤⣤⣤⣄⣀⣀⣀⣀⣀⣀⣀⡀⣶⣶⡋X⡏ │ │ ││ ⠑⣤ ⢀⣀⣀⡤⡇ ⠰⡜⠎⠁ ⠘⠢⣰⠭⣩⡇ ⢀⡀ ⠉⠉⠉⢉⡩⠝⠋⠁ │ │ ││ ⠻⣆ ⢺⠈⠁⣿⢸ ⡸⠋ ⠘⣧ ⠈⣷⢦⠤⣄ ⢀ ⣀⠤⠒⠁⠘⠁ │ │ ││ ⠈⠳ ⠘⢅⣣⡼⣏⠉⠘⡄⠄⡀ ⡰⠁ ⢸⢣ ⢀⡼ ⠘⢣ ⢀⡠⠔⠊⢰⠟⠁⣥ │ │ ││ ⠈⠘⢣⣇⢠⡇⣠⡃ ⢠⠃⠹⡀ ⢀⣀⣀⣀⡀ ⠻⣒⡽ ⣀⠤⠊⠁ ⡏⡷⣄⠇ ⣿⡆ │ │ ││ ⠙⡇⢸ ⠙⠶⡀ ⢠⠃ ⠣⠤⠔⠢⢸ ⡇ ⢀⡠⠔⠉ ⠙⠂ ⢢⢵⡅⣀⢼⠞⢧ ⠐ │ │ ││ ⠰ ⢸⠁⠘⡄ ⠠⡷⡤⢀⠇ ⠐⢸ ⣇⠤⠊⠁ ⠈⢿⣧⣏⣸⣷⣿⣶⡦⣀⠤⡀ │ │ ││ ⠱⡀ ⡇ ⢀⠎⡇ ⢸⣠⣔⣉⡇ ⡇ ⠈⠻⠶⠦⣯⡤⠞⠻⡴⣿⡝⢦⡀ │ │ ││ ⠒ ⢀ ⠱⡀⢸ ⡜⡞ ⣀⠤⠊⠁⠁ ⣇⡸⡆ ⢀⡶⠏⢇⡷⡀⠉⠈⠠⡄ ⣀│ │ ││ ⠈ ⢸⠘⡄ ⡜⣀⠇ ⢀⡠⠒⠉ ⠈⡆ ⡎⢨⢢⠃⠖ ⡔⠊ ⠱⡀ ⠰⠅⠈⠁│ │ ││ ⡜⡞X⡹⣇⣀⠔⠊⠁ ⠸⡀ ⢸ ⠉ ⠸⡃ ⡱ │ │ ││ ⢀⢸⡁⠸⠓⢹ ⠳⠒⠁ ⠣⠒⠋⠉⢾ ⢠⠃ ⣆⡀│ │ ││⢀ ⢰⡅⢧⣀⣠⠏ ⠹⡷ ⣠⡿⠁│ │ ││ ⢸⢁⡇⠈ ⢠ ⢈⠚ │ │ ││ ⠘⠿⠦⠉ ⠰⠂ ⠑ │ │ ││ ⢀⣤⡆ ⠂ │ │ ││ ⣀⣴⠿⡏ ⣀⣀⣀⣀⣀⣠⣀⣀⣠⢄⡔⠒⠋⠒⠒⣲⣀⠤⠒⠒⠛⠊⠑⠊⠒⠊⠑⠉⠑⠒⠦⠤⠤⣀⣀ │ │ ││ ⣀⣠⡤⠔⠒⠒⠒⠒⠶⠦⠿⠟⠛⠓⣚⣚⣉⡡⠃ ⢀⡀ ⡠⠤⠴⠖⠋⠁⠈⠁ ⠋⠁ ⠠⣞⣛ │ │ ││⣀⣤⢌⣯⡿⠟ ⠙⠓⠛⠷⣗⠴⠷⠟⠚⠛⠒⠂ ⠺⠭⣅⣀⣀│ │ ││ ⠉⠉⠁ │ ╰────────────────────────────╯╰────────────────────────────────────────────────────────────────────╯
╭─ intuiTUIve demo ────────────────────────────────────────────────────────────────────────────────╮ │ Graphs │ World │ Colours │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Colours ──────────────────────────────────────╮ │default: Foreground Background │ │black: Foreground Background │ │red: Foreground Background │ │green: Foreground Background │ │yellow: Foreground Background │ │blue: Foreground Background │ │magenta: Foreground Background │ │cyan: Foreground Background │ │white: Foreground Background │ │bright_black: Foreground Background │ │bright_red: Foreground Background │ │bright_green: Foreground Background │ │bright_yellow: Foreground Background │ │bright_blue: Foreground Background │ │bright_magenta: Foreground Background │ │bright_cyan: Foreground Background │ │bright_white: Foreground Background │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╰────────────────────────────────────────────────╯
╭─ intuiTUIve demo ────────────────────────────────────────────────────────────────────────────────╮ │ Graphs │ World │ Colours │ ╰──────────────────────────────────────────────────────────────────────────────────────────────────╯ ╭─ Colours ──────────────────────────────────────╮ │default: Foreground Background │ │black: ╭─ Help ─────────────────────────────────────────────────────────────╮ │red: │? Search keys › │ │green: │ │ │yellow: │ ←/h the tab before │ │blue: │ →/l the next tab │ │magenta: │ ↑/k the task before │ │cyan: │ ↓/j the next task │ │white: │ t show or hide the chart │ │bright_black: │ q quit │ │bright_red: │ │ │bright_green: │ │ │bright_yellow:│ │ │bright_blue: │ │ │bright_magenta│ │ │bright_cyan: │ │ │bright_white: │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ 6 keys · type to search · ↑↓ scroll · esc close │ │ ╰────────────────────────────────────────────────────────────────────╯ │ │ │ │ │ │ │ │ ╰────────────────────────────────────────────────╯