SVG Drawing App with Fabric.js

[KynloStephen66515]

SVG Drawing App with Fabric.js

This is a simple SVG drawing web application built using Fabric.js library. It allows users to draw various shapes, freehand drawings, add text, upload images, and manipulate SVG elements. The application provides functionalities like undo, redo, clear canvas, and save as SVG.

Features

• Drawing Tools: Users can select from different drawing tools such as brush, eraser, and select mode.
• Shape Drawing: Options to draw shapes like rectangles, circles, and triangles.
• Text Addition: Users can add text to the canvas.
• Image Upload: Allows users to upload images onto the canvas.
• Color Picker: Choose colors for drawing tools and shapes.
• Brush Size Slider: Adjust the size of the brush.
• Undo/Redo: Support for undoing and redoing actions.
• Save as SVG: Save the canvas drawing as an SVG file.
• Return to Top Icon: Scroll back to the top of the page easily.

How to Use

• Clone or download the repository.
• Open index.html in a web browser.
• Use the various drawing tools and functionalities provided.
• Click on "Save as SVG" to download the drawing as an SVG file.
• Enjoy drawing!

Libraries Used

• Fabric.js: A powerful JavaScript library that makes working with HTML5 canvas easy.
• Tailwind CSS: A utility-first CSS framework for styling the application.
• Font Awesome: Provides a wide range of icons for UI elements.

Contributing

Contributions are welcome! Feel free to fork the repository and submit pull requests for any improvements or additional features.

License

This project is licensed under the MIT License.


Link: https://github.com/Kynlos/SVGMaker