a drawing canvas where you can unleash your creativity.

I will use HTML, CSS, and Javascript for this project.

Steps:-

1. Create a webpage with a 16x16 grid of square divs.

   • Create the divs using JavaScript.
   • use CSS Grid to organize the grid

2. Set up a “hover” effect so that the grid divs change color when the mouse passes over them, leaving a (pixelated) trail through the grid like a pen would.

   There are multiple ways to change the color of the divs, including:

   • adding a new class to the div.(The one I use)
   • changing the div’s background color using JavaScript.

3. Add a button to the top of the screen that will send the user a popup asking for the number of squares per side for the new grid. Once entered, the existing grid should be removed and a new grid should be generated in the same total space as before (e.g. 960px wide) so that you’ve got a new sketch pad.

   • You should be able to enter 64 and have a brand new 64x64 grid pop up without changing the total amount of pixels used.

4. Push the project to GitHub!