SketchFlow is a professional, feature-rich sketch drawing application inspired by Excalidraw. Create beautiful diagrams, sketches, and drawings with an intuitive interface and powerful tools designed for both professionals and casual users.
- Selection Tool (V): Select, move, and manipulate existing elements
- Hand Tool (H): Pan around the canvas for easy navigation
- Rectangle (R): Draw perfect rectangles with customizable properties
- Circle (C): Create circular shapes with precision
- Diamond (D): Draw diamond shapes for flowcharts and diagrams
- Ellipse (E): Create elliptical shapes
- Arrow (A): Draw arrows with automatic arrowheads for diagrams
- Line (L): Draw straight lines between points
- Pen/Brush (P): Freehand drawing with smooth curves
- Text Tool (T): Add text annotations to your drawings
- Eraser: Remove unwanted elements
- Stroke Color: Choose from preset colors or use custom colors
- Fill Color: Multiple fill options including transparent, solid, and hatch patterns
- Stroke Width: Four preset widths (Thin, Regular, Bold, Extra Bold)
- Stroke Style: Solid, dashed, or dotted lines
- Sloppiness Control: Adjust from architect-precise to hand-drawn cartoonist style
- Opacity Control: Fine-tune transparency for all elements
- Zoom In/Out (+/-): Scale your canvas for detailed work
- Reset Zoom (0): Return to 100% view instantly
- Fit to Screen: Optimize canvas view
- Grid Background: Visual guide for alignment
- Export as PNG: High-quality image export with white background
- Export as SVG: Vector graphics for scalability (coming soon)
- Export as JSON: Save and reload your work
- Copy to Clipboard: Quick sharing with one click
- Tool Selection: Single-key shortcuts (V, H, R, C, D, E, A, L, P, T)
- Actions: Standard shortcuts (Ctrl+Z/Y for Undo/Redo, Ctrl+C/V for Copy/Paste, Ctrl+D for Duplicate)
- Delete: Remove selected elements with Delete or Backspace
- Select All: Ctrl+A to select all elements
- View: +/- for zoom, 0 to reset
- Toggle between light and dark themes for comfortable drawing in any environment
- Fully responsive interface that works seamlessly on desktop, tablet, and mobile devices
- Touch-optimized controls for mobile drawing
Professional toolbar with all drawing tools and comprehensive property controls.
Comfortable drawing experience in low-light environments.
Quick access to all features with intuitive keyboard shortcuts.
To run SketchFlow locally or contribute to the project, follow these steps:
- Clone the repository:
git clone https://github.com/ThisIs-Developer/SketchFlow.git- Open the project directory:
cd SketchFlow- Open the
index.htmlfile in your web browser to launch SketchFlow.
- HTML5: Semantic markup and Canvas API
- CSS3: Modern styling with CSS Variables for theming
- JavaScript (ES6+): Vanilla JavaScript with Canvas API for drawing functionality
- Responsive Design: Mobile-first approach with media queries
- Material Icons: Professional icon set
Contributions to SketchFlow are welcome! To contribute, follow these steps:
- Fork the repository.
- Create a new branch (
git checkout -b feature/my-feature). - Make your changes and commit them (
git commit -am 'Add new feature'). - Push to the branch (
git push origin feature/my-feature). - Create a new Pull Request.
This project is licensed under the Apache-2.0 License. See the LICENSE file for details.
For any questions or feedback regarding SketchFlow, please open an issue on the GitHub repository or contact the project maintainer here.
Enjoy drawing and creating with SketchFlow! 🎉
