Etch-a-Sketch

Overview

This project is a simple grid drawing app where users can create grids of customizable sizes and interact with the grid by changing the colors of the grid squares. The app includes different modes, such as black coloring, random RGB coloring, and eraser functionality.

Preview: Live Demo Here ---> https://mhassan04.github.io/Etch-a-Sketch/

Features

• Resizable Grid: Users can create grids of customizable size, up to a 100x100 grid.
• Black Color Mode: Users can switch to drawing with black color by clicking the black color button.
• RGB Color Mode: Users can switch to drawing with random RGB colors by clicking the RGB button.
• Eraser Mode: Users can erase their drawing by switching to the white color using the eraser button.
• Grid Reset: Users can reset the grid back to the original state by clicking the reset button.

How to Use

1. Change Grid Size: Click the "Change Grid Size" button to input a custom grid size (between 1 and 100). The grid will resize accordingly.
2. Black Color Mode: Click the "Black" button to color the grid squares black when hovering over them.
3. RGB Color Mode: Click the "RGB" button to color the grid squares with random colors when hovering over them.
4. Eraser Mode: Click the "Eraser" button to erase the grid squares by turning them white.
5. Reset Grid: Click the "Reset" button to clear the grid and restore the default grid.

Installation

1. Clone the repository:

   git clone [email protected]:mhassan04/Etch-a-Sketch.git

2. Navigate to the project folder:

   cd "Etch-a-Sketch"

3. Open the index.html file in your browser to start using the app

Technologies Used

• HTML: Used for structuring the layout of the app.
• CSS: Used for styling the grid, buttons, and overall layout.
• JavaScript: Handles all user interactions, including grid resizing, color changes, and event handling.

Future Enhancements

• Color Picker: Implement a color picker that allows users to select any color for drawing.
• Drag-to-Paint: Enable continuous drawing by allowing users to drag across the grid while painting.
• Save Feature: Add functionality that allows users to save their drawing as an image or file.