chirp-ui Component Showcase

ASCII Border

Box-drawing borders in four variants.

single

Hello, single border

double

Hello, double border

rounded

Hello, rounded border

heavy

Hello, heavy border

ASCII Divider

Horizontal rules with character variety.

single

double

heavy

dots

spin

ASCII Sparkline

Inline bar-chart sparklines from data arrays.

default ▂▆▁▇▃▅▁█▄▂

accent ▁▃▁▇▄▆▂▅█▁

gradient █▆▄▂▁▁▃▅▇█

ASCII Progress

Determinate progress bars with semantic variants.

Queued 25%

Building 50%

Testing 75%

Complete 100%

ASCII Spinner

Animated character-set spinners in multiple sizes.

Charsets

braille

box

dots

arrows

blocks

Sizes

sm

md

lg

ASCII Toggle

Toggling switches with semantic colour variants.

ascii_toggle

Default on Default off Success Danger Accent

ascii_switch

Power Standby Network

ASCII Indicator

Status dots with optional blink animation.

Static

Blinking

ASCII Tile Buttons

Glyph tile buttons in a grid. lit=true highlights the active tile.

ASCII Knob

Rotary selector with discrete steps.

ASCII Fader

Vertical fader strips grouped into a mixer bank.

Mixer

CH 1 70

CH 2 45

CH 3 90

CH 4 30

ASCII VU Meter

Animated level meters for audio-style displays.

Levels

L 80%

R 65%

ASCII 7-Segment Display

Retro numeric readouts with colour variants.

Counter 1 2 3 4

Clock 8 8 : 0 0

Score 0 0 4 2

Limit 9 9 9 9

ASCII Checkbox

Grouped checkboxes with ASCII-style markers.

Options Option A Option B Option C Option D

ASCII Radio

Grouped radio buttons with ASCII markers.

Pick one Alpha Beta Gamma

ASCII Stepper

Multi-step progress indicator.

ASCII Split-Flap

Departure-board style split-flap display.

Departures

ASCII Ticker

Scrolling marquee text with variant colours.

ASCII Breaker Panel

Industrial-style toggle switches in a panel.

System Controls

Main

Aux

Backup

Lights

ASCII Badge

Inline status badges with semantic variants.

Default OK Warn Fail New N/A

ASCII Empty State

Placeholder for views with no content.

No results

Try adjusting your search

ASCII Skeleton

Loading placeholders in various shapes.

text (3 lines)

card

⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀ ⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀ ⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠⠐⠈·⠁⠂⠄⡀⢀⠠

avatar

heading

ASCII Table

Box-drawing tables in four border styles.

single

Alice Admin Active

Bob User Away

double

Carol Editor Active

Dave Viewer Offline

heavy

Eve Admin Active

Frank User Busy

rounded

Grace Editor Active

Hank Guest Idle

ASCII Error Pages

Full-width error states for HTTP status codes.

     ┌─────────┐     
     │  4 ◇ 4  │     
     └────┬────┘     
          │          
     ◇ ── ★ ── ◇    
          │          
        ·   ·

404

Not Found

The page you're looking for doesn't exist.

       ╔═══╗         
       ║ ⛓ ║         
    ╔══╬═══╬══╗      
    ║  ┃   ┃  ║      
    ║  ┃ ◆ ┃  ║      
    ╚══╩═══╩══╝

403

Forbidden

You don't have permission to access this resource.

      · ✦ · ★ ·      
       ╱  ◇  ╲       
      ╱ 5·0·0 ╲      
     ╱ · · · · ╲     
    ╱───────────╲    
      · ★ · ✦ ·

500

Server Error

Something went wrong on our end.

    ┌──────────┐     
    │ ⚙  ·  ⚙ │     
    │    ◎     │     
    │  ·╱ ╲·   │     
    └──╱───╲───┘     
     ▪ ▪ ▪ ▪ ▪

503

Unavailable

The service is temporarily offline.

408

Timeout

The request took too long to complete.

ASCII Card

Box-drawn card with title bar and content area.

single (default)

All systems operational.

double

Last deploy: 2h ago

rounded

Build #847 passed.

heavy

Disk usage at 92%.

ASCII Tabs

Tab bar with box-drawing bracket indicators.

ASCII Modal

Native dialog with monospace styling.