A powerful, client-side-only web-based tool for creating ASCII diagrams and text-based visualizations. Perfect for documentation, technical diagrams, and creative text art.
Try it now at app.monosketch.io
Note: This project is being rewritten in TypeScript. Check out the
port-to-jsbranch or PR #584 for details.
MonoSketch is a fully client-side ASCII diagram editor that runs entirely in your browser. No server-side processing, no data uploaded to the cloud - your work stays on your device. Create technical diagrams, flowcharts, circuit diagrams, and more using only ASCII characters.
+10-15V 0,047R
●─────────○───────○─░░░░░─○─○─────────○────○─────╮
+ │ │ │ │ │ │ │ │
─═════─ │ │ │ │ │ │ │
─═════─ ──┼── │ │╭┴╮ │ │ │
─═════─ ─┼─ │ ││ │ 2k2 │ │ │
- │ 470│ + │ ││ │ │ │ │
│ uF│ ╰──╮ │╰┬╯ ╭┴╮ │ │
└─────────│ │ │ │ 1k │ │ │ ▽ LED
│ 6│ 7│ │8 │ │ │ ┬
───┴─── ╭──┴────┴─┴─╮ ╰┬╯ │ │
─═══─ │ │1 │ │ / BC │
─ │ ├───────○──┤/ 547 │
GND │ │ │ │ ▶ │
│ │ ╭┴╮ │ │
╭─────────┤ │ 220R│ │ ○───┤├┘ IRF9Z34
│ │ │ │ │ │ │├─▶
│ │ MC34063 │ ╰┬╯ │ │├─┐ BYV29 -12V6
│ │ │ │ │ ○──┤◀─○────○───X OUT
- │ + │ │2 ╰────╯ │ │ │
6000 micro ────┴──── │ ├──○ C│ │ ─── 470
Farad, 40V ─ ─ ┬ ─ ─ │ │ GND C│ │ ███ uF
Capacitor │ │ │3 C│ │ │\
│ │ ├────────┤├╮ │ │ GND
│ ╰─────┬───┬─╯ │ GND │
│ 5│ 4│ │ │
│ │ ╰────────────○──────────────│
│ │ │
╰───────────────●─────/\/\/─────────○────░░░░░──╯
2k │ 1k0
╭┴╮
│ │5k6 3k3
│ │in Serie
╰┬╯
│
GND
- Rectangle - Create bordered and filled rectangular shapes
- Text - Add text labels and annotations
- Line - Draw connecting lines with various styles
- Fill - Fill shapes with characters
- Border - Multiple border styles and characters
- Line decorations - Add arrows and other heads to line ends
- Rounded corners - Soften rectangular shapes
- Infinite canvas - Unlimited scrolling in all directions
- Autosave - Never lose your work
- Multiple projects - Organize your diagrams
- Standard operations - Copy, Cut, Paste, Duplicate
- Layer management - Move shapes and change their stacking order
- Dark mode - Easy on the eyes
- Smart snapping - Connect lines to shapes automatically
- Export selected shapes or entire diagrams
- Quick text copy with keyboard shortcuts:
- macOS:
Cmd + Shift + C - Windows/Linux:
Ctrl + Shift + C
- macOS:
Group shapes together for easier manipulation and organization. Includes a shape tree panel for managing complex diagrams with nested structures.
Freehand drawing with custom characters, plus expanded options for fills, borders, and line decorations.
- Open files from URLs
- Share to GitHub Gist
- Import/export capabilities
Contributions are welcome! Whether you're fixing bugs, adding features, or improving documentation, your help is appreciated.
- Kotlin/JS - The entire application is written in Kotlin, compiled to JavaScript
- SASS - CSS preprocessing
- Tailwind CSS - Utility-first CSS framework
- Gradle - Build system
- Java - Required for Gradle and Kotlin compilation
- Python 3.11+ (optional) - For alternative development server
- Pipenv (optional) - If using Python development server
Run development build with hot reload:
./gradlew browserDevelopmentRun --continuous -Dorg.gradle.parallel=falseRun production build:
./gradlew browserProductionRun --continuous -Dorg.gradle.parallel=falseNote: The -Dorg.gradle.parallel=false flag is a workaround for a KotlinJS build issue with --continuous mode.
Alternative approach when Gradle hot reload is not working properly:
# Install dependencies
pipenv install
# Run development server
pipenv run dev- Fork the repository and create a new branch for your feature or bug fix
- Make your changes following the existing code style
- Test your changes thoroughly
- Submit a pull request with a clear description of your changes
- Open an issue for bug reports or feature requests
- Follow @MonoSketchApp on Twitter for updates
This project is licensed under the Apache License 2.0.
