Skip to content

chrislovescoding/pixelfix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 

Repository files navigation

PIXELFIX - Pixel Art Enhancer

A browser-based tool for working with pixel art. Single HTML file, no dependencies, no build step -- just open index.html.

Features

Grid Detection & Enhancement

  • Automatic grid line detection using transition signal analysis with adjustable threshold and minimum gap
  • Manual line editing -- add, remove, or clear vertical/horizontal grid lines
  • Signal visualization panel showing detected edge strengths
  • Cell averaging to produce a clean, enhanced pixel art output from a gridded source image

Palette Studio

  • Colour picker -- click cells on the image to build a palette
  • Palette quantization -- remap the image to your chosen colours
  • Save / Load / Export palettes (stored in localStorage, exportable as .hex)
  • Dedicated mode with no grid detection (each pixel = 1 cell)

Sprite Alignment

  • Multi-image loader -- drop or select multiple frames at once
  • Per-frame positioning with arrow keys (1px) and shift+arrow (5px)
  • Onion skinning with adjustable opacity to compare frame positions
  • Pixel grid overlay at high zoom levels
  • Zoom from 1x to 16x with crisp nearest-neighbour rendering
  • Editable canvas size -- adjust width/height beyond the auto-detected max
  • Flip any frame horizontally or vertically
  • Export options:
    • Sprite sheet (horizontal strip)
    • All frames as individual aligned PNGs
    • Mirrored sprite sheet
    • All frames mirrored
    • Single selected frame

General

  • Drag-and-drop or paste images
  • Side-by-side original vs enhanced view with toggle
  • Adjustable zoom and export scale (up to 32x)
  • Checkerboard transparency background
  • Dark UI with pixel art aesthetic

Usage

Open index.html in any modern browser. No server required.

  • Normal mode -- drop a single image for grid detection and enhancement
  • Palette Studio -- click the button on the landing page for palette-only work
  • Sprite Alignment -- click the button or drop multiple files at once

Keyboard Shortcuts (Sprite Alignment)

Key Action
Arrow keys Move selected frame 1px
Shift + Arrow Move selected frame 5px
[ / ] Cycle between frames

License

MIT

About

Browser-based pixel art enhancer with grid detection, palette studio, and sprite alignment

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages