Etch-a-Sketch

2024-04-24
javascripthtmlcssweb-developmentsketchpadlearningodin-project

Etch-a-Sketch: Digital Drawing Pad

Overview

Etch-a-Sketch is a fun, interactive web app that lets you draw on a grid—just like the iconic Etch-a-Sketch toy! Created as part of the learning journey with The Odin Project, this project explores key web development concepts using JavaScript, HTML, and CSS.


Features

  • Dynamic Drawing Grid: Draw by hovering over grid cells; create pixel art instantly.
  • Custom Grid Size: Adjust the grid’s dimensions on the fly for more or less detail.
  • Multiple Drawing Modes: Includes regular color, rainbow, shade, eraser, and clear functions.
  • Responsive UI: Works smoothly across devices and window sizes.
  • Modern Design: Clean, simple interface for a pleasant creative experience.

Technology Stack

  • JavaScript: Handles user interaction and drawing logic.
  • HTML & CSS: Provides structure and visual styling.

Learning Focus

This project was built to solidify core skills in:

  • DOM manipulation
  • Event handling
  • Responsive layout
  • User interface design

Explore the Code

Curious how it works or want to try it yourself?
View on GitHub: sanjayJ369/Etch-a-Sketch