Skip to content

centaurusss/PixelArtGenerator

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🎨 Pixel Art Generator

Description

A modern Pixel Art Generator built with HTML5, CSS3, and Vanilla JavaScript.
With a sleek glassmorphism UI, you can create pixel art by customizing the grid size, choosing colors, and drawing directly in your browser.
The app supports both mouse and touch devices, making it fully usable on desktop and mobile.

This project is lightweight, responsive, and requires no external libraries.


✨ Features

  • Adjustable grid size (width & height up to 40x40)
  • Color picker to choose any color
  • Paint mode to draw pixels
  • Erase mode to remove pixels
  • Clear grid option to start fresh
  • Highlighted active tool (Paint / Erase)
  • Smooth hover & drawing animations
  • Responsive design with glassmorphism style

🚀 How to Use

  1. Open index.html in your browser.
  2. Adjust the grid width and grid height using sliders.
  3. Click Create Grid to generate the drawing area.
  4. Pick a color from the color picker.
  5. Use Paint to draw, or Erase to remove pixels.
  6. Click Clear Grid to reset everything.

🛠️ Technologies

  • HTML5 → structure & UI
  • CSS3 → styling, responsive layout, glassmorphism effects
  • Vanilla JavaScript → grid generation, drawing logic, and interactions

📜 License

This project is licensed under the MIT License.

About

A modern Pixel Art Generator built with HTML5, CSS3, and Vanilla JavaScript. With a sleek glassmorphism UI, you can create pixel art by customizing the grid size, choosing colors, and drawing directly in your browser. The app supports both mouse and touch devices, making it fully usable on desktop and mobile.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors