Etch-a-Sketch

• created at: 2024-04-24
• tags: javascripthtmlcssweb-developmentsketchpadlearningodin-project
• live demo
• view repository

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

---