Cascii is a web-based ASCII and Unicode diagram builder written in vanilla Javascript.
It has zero dependencies on any servers, web packing, libraries, and is no-markup and no-stylesheets. You can start building diagrams by simply opening the cascii.html file in a browser. Cascii is also hosted at cascii.app where you can get short links to your diagrams, open an account, etc.
Here is a diagram built with Cascii that loosely explains how Cascii is structured internally:
┌╶╶╶╶╶╶╶╶╶╶╶╶╶╶┐
╷ GroupManager ╷
└╶╶╶╶╶╶╶╶╶╶╶╶╶╶┘
┌─────────────┐ / ┌─────────────┐
│EventManager │ / ┌───────│SquareLayer │
└─────────────┘ / │ │─────────────│ ┌───────────────┐
/ │───────│CircleLayer │ ┌────│SwitchLineLayer│
/ │ │─────────────│ │ │───────────────│
┏━━━━━━━━━━━━┓ │───────│BaseLineLayer│◀──┐────│FreeLineLayer │
┃LayerManager┃◀──────┘ │─────────────│ │ │───────────────│
┗━━━━━━━━━━━━┛ │───────│DiamondLayer │ └────│StepLineLayer │
┌────────────┐ / / │ │─────────────│ └───────────────┘
│CharManager │/ / │───────│FreeLayer │
└────────────┘ / │ │─────────────│
/ └───────│TableLayer │
┌────────────┐ └─────────────┘ Pixels!
│ ModeMaster │ •
└────────────┘ • • ▲
• • │
• • │
• CanvasCom ────────────────────────────────┘
• •
• •
• •
•
Edit/view: https://cascii.app/7c24a
Simply download and open the cascii.html
file!
…Literally…
curl https://cascii.app -o cascii.html && open cascii.html
…Or…
If you are not making changes, it’s recommended to use cascii.app
directly so you can take adva
9 Comments
dspillett
That looks almost exactly like something I've wanted, thought numerous times about making, but never getting around to. Thanks for scratching your itch and mine!
macintux
Very cool, thanks.
One of the saddest days at my current job: when the company I’m contracted to stopped offering Excalidraw in favor of Lucid. I mostly understand the rationale, but the dramatic difference in friction basically shut down all interest I had in using diagrams to help communicate with my team members.
jaredwiener
Really cool — and congrats!
FYI there's a typo in the link in the README — points to casci.app instead of cascii.app.
dimenoz
This is fantastic. I've always used JavE before but this being a single HTML file is a big+ and packs quite a punch. Kudos to the author!
One question though, how do edit the content later? For example I generated a few diagrams one at a time and pasted those in a local plain text file. Later when I want to edit a particular diagram/part, I tried copy pasted it in, but always got "cannot paste, content leaves canvas" error. If I tried copy-pasting a really small section (e.g. 3×3 table), it pasted it right in the center. Anyway, not sure if that's an intended work flow or not. Great job regardless.
shanselman
genius. I love it. I'll take 14 of these immediately!
breadchris
omg this is beautiful, great job!
nwroot
This is amazing thank you. Have been using asciimap or whatever, but this works so much better. Thank you.
ccakes
Looks super cool, congrats!
Monodraw[1] is a similar product delivered as a standalone macOS app. It’s a classic pay once-type license and very polished software. Cannot recommend enough! I’ve always wanted something as good on Linux though, will definitely give this a go!
[1] https://monodraw.helftone.com/
dangoodmanUT
it's literally just a single html file
legend