RetroFlow is a cross-platform flowchart maker with a retro-computer aesthetic. It allows users to quickly sketch diagrams using a drag-and-drop interface and export them as ASCII art, pixel-art PNGs, or SVGs. Ideal for developers, documenters, and retro computing fans, RetroFlow keeps things lightweight, fun, and practical.
-
Drag-and-Drop Flowcharts 📌
- Simple node-based editor with retro-styled boxes and arrows.
- Customizable arrowheads and connectors.
-
Export Options 🔄
- ✏️ ASCII Art: Share diagrams in plain text for code comments.
- 🖼️ Pixel Art PNG: Generate pixelated images with optional CRT effects.
- 📄 SVG: High-res scalable diagrams.
-
Retro Customization 🎨
- Choose between monochrome, amber, or green-screen themes.
- Optional "CRT glare" overlay for old-school aesthetics.
-
Quick Share 🔗
- Generate a shareable URL using compressed diagram data.
- Frontend: Preact + react-flow for lightweight interactivity.
- ASCII Conversion: figlet.js or custom text mapping.
- Pixel Art Export: Canvas API for downscaled rendering.
- Styling: CSS grid layout + pixel-style box shadows.
- State Persistence: LocalStorage for saving diagrams.
- Cross-Platform: Tauri for building native applications.
-
Clone the repository:
git clone https://github.com/yourusername/retroflow.git cd retroflow -
Install dependencies:
npm install
-
Run the development server:
npm run dev
-
Open in browser:
- Visit
http://localhost:3000
- Visit
-
Build Cross-Platform App (Optional):
npm run tauri build
Pull requests and feature suggestions are welcome! 🚀
- Fork the repository.
- Create a new branch:
git checkout -b feature-new-idea - Commit your changes:
git commit -m "Added new feature" - Push to the branch:
git push origin feature-new-idea - Open a PR!
🚀 Try it out: