Haminimi / etch-a-sketch

Etch A Sketch is a mechanical drawing toy and here we are building a browser version of something between a sketchpad and an Etch-A-Sketch.

Home Page:https://haminimi.github.io/etch-a-sketch/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Etch a Sketch - drawing app

Screenshot of the Etch a Sketch app.

Description

Etch A Sketch is a mechanical drawing toy and here we are building a browser version of something between a sketchpad and an Etch-A-Sketch. This project is a part of The Odin Project's curriculum. The Odin Project provides a high quality web development education maintained by an open source community.

Live Preview

The Etch A Sketch app.

Features

  • Adjustable Grid Size: Customize the grid using a slider, with sizes ranging from 1x1 to 99x99
  • Color and Rainbow Modes: Choose any color using a color picker or enable the dynamic rainbow mode
  • Eraser Mode: Easily correct or modify your drawings with the eraser

To Do:

  • Save and Download: Save your artwork as an image file and download it
  • Responsive Design: Upgrade the existing responsive design to enable the equal quality of a drawing experience both on desktop and mobile devices

Tech

The project is built with:

  • HTML
  • Vanilla JavaScript
  • Vanilla CSS

Tools:

  • VS Code
  • Git

Covered Topics

This section mentions the main topics covered during project work and prior lessons

  • DOM manipulation

Credits

Code is partially influenced by Michał Osman's implementation of the project.

Author

Happy coding!

About

Etch A Sketch is a mechanical drawing toy and here we are building a browser version of something between a sketchpad and an Etch-A-Sketch.

https://haminimi.github.io/etch-a-sketch/


Languages

Language:CSS 51.4%Language:JavaScript 30.5%Language:HTML 18.1%