Pixa San (Practice Project)

Pixa San is an etch-a-sketch inspired mini sketchboard. It comprises of a few modes, mainly random mode(which when enabled will put colors to random rgb colors, when this mode is enabled your normal selected color wont work) and the second mode is trailing effect mode (which when enabled gives you somewhat of a trailing effect such that while coloring your color opacity will increase with every colored square, eventually becoming fully opaque. Note that when you stop holding the mouse click button down and re click, trailing effect will reset and start from 0 opacity value), a color picker with option to set opacity too. You will have to set preferences first in order to be able to pixel-draw something. On the preferences section you will need to enter a grid size value otherwise sketchboard wont appear. On the sketchboard page you can toggle controls to enable modes, clear grid or move to either preferences or about page.

Utilized Technologies

• Html
• Css
• Javascript

Project Structure

Pixa-San/
├── index.html # Main HTML file
├── style.css # Stylesheet
├── script.js # JavaScript logic
└── icons/ # Icon and image assets
├── cursor.png
├── cute-girl-holding-paintbrush.gif
├── favicon.png
├── girl.png
├── hange.png
├── paint-brush-cursor.png
└── sailor-moon-girl.png

Credits

• Project idea: The Odin Project
• Color picker library: Iro.js
• Design inspiration: A cool neocities website
• Images/Icons/Cursors: Pinterest

---

Thanks for visiting !!