Skip to main content

Create pixel art programmatically — PNG + HTML/CSS export, browser-based editor.

Project description

pixelart-py

http://pixel.parinkhurana.xyz/

A simple, expressive Python library for creating pixel art programmatically — with PNG export, HTML/CSS export, and a browser-based hand-drawing editor that generates Python code.


Installation

pip install pixelart-py

Or locally:

git clone https://github.com/yourname/pixelart-py
cd pixelart-py
pip install -e .

Quick Start

from pixelart_py import Canvas

canvas = Canvas(16, 16, pixel_size=20)
canvas.fill("#1a1a2e")
canvas.draw_circle(8, 8, 6, "#e63946", filled=True)
canvas.save("art.png")

Features

  • Canvas — configurable grid size and pixel scale
  • Drawing primitivesdraw_rect, draw_line, draw_circle, flood_fill
  • Palette — define and reuse named colors
  • PNG export — pixel-perfect output via Pillow
  • HTML/CSS export — three styles: grid, table, custom-properties
  • to_code() — convert any canvas back to Python source code
  • Browser editor — draw by hand, get Python code automatically

Project Structure

pixelart-py/
├── pixelart_py/
│   ├── __init__.py      ← Public API
│   ├── canvas.py        ← Canvas class
│   ├── palette.py       ← Palette + color parsing
│   ├── drawing.py       ← Drawing primitives
│   ├── exporter.py      ← PNG + HTML/CSS + code generation
│   └── editor.py        ← Browser-based hand-drawing editor
├── examples/
│   ├── heart.py
│   ├── showcase.py
├── output/
├── pyproject.toml
└── README.md

API Reference

Canvas

canvas = Canvas(width, height, pixel_size=1, background=None)

Pixel manipulation

canvas.set_pixel(x, y, color)    # Set a pixel
canvas.get_pixel(x, y)           # Returns (r, g, b, a)
canvas.fill(color)               # Fill entire canvas
canvas.flood_fill(x, y, color)   # Flood fill from (x, y)
canvas.clear()                   # Reset to transparent

Drawing

canvas.draw_rect(x, y, w, h, color, filled=True)
canvas.draw_line(x1, y1, x2, y2, color)
canvas.draw_circle(cx, cy, radius, color, filled=False)

Export

canvas.save("output.png")
canvas.save_html("output.html", style="grid")       # CSS Grid
canvas.save_html("output.html", style="table")      # HTML table
canvas.save_html("output.html", style="custom-properties")  # CSS vars
html_str = canvas.to_html(style="grid")
code_str = canvas.to_code()                         # Python source
img = canvas.to_image()                             # PIL.Image

Utilities

copy = canvas.copy()
canvas.paste(other_canvas, x, y)
canvas.preview()   # opens image viewer

Palette

from pixelart_py import Palette

palette = Palette({
    "sky":    "#87ceeb",
    "ground": "#4a7c3f",
})

canvas.fill(palette["sky"])

Built-in palettes: CLASSIC, PASTEL, EARTHY

from pixelart_py import PASTEL
canvas.draw_rect(0, 0, 8, 8, PASTEL["mint"])

Color formats

All color arguments accept:

Format Example
6-digit hex "#ff0000"
3-digit hex "#f00"
8-digit hex "#ff0000ff"
RGB tuple (255, 0, 0)
RGBA tuple (255, 0, 0, 128)

Hand-drawing editor

from pixelart_py.editor import open_editor

canvas = open_editor(width=16, height=16, pixel_size=24)
# A browser window opens — draw your art, click "Save & Get Code"
# The function returns the canvas and prints Python code to the terminal

canvas.save("my_drawing.png")
print(canvas.to_code())

Editor features:

  • ✏️ Draw, 🧹 Erase, 🪣 Fill, 💉 Eyedrop tools
  • Keyboard shortcuts: D draw, E erase, F fill, I eyedrop, Ctrl+Z undo
  • Color picker + 15-color quick palette
  • Grid overlay toggle
  • Zoom in/out
  • On save: returns canvas + prints Python code

HTML/CSS Export Styles

"grid" — CSS Grid (recommended)

<div class="pixel-grid">
  <div class="p" style="background:#1a1a2e"></div>
  ...
</div>

"table" — HTML Table (max browser compatibility)

<table class="pixel-table">
  <tr><td style="background:#1a1a2e"></td>...</tr>
</table>

"custom-properties" — CSS Variables (easy to re-theme)

:root {
  --c0: #1a1a2e;
  --c1: #e63946;
}

Lets you change the entire color scheme by editing just the CSS variables.


Publishing to PyPI

pip install build twine
python -m build
twine upload dist/*

License

MIT

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

pixelart_py-2.0.2.tar.gz (20.4 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

pixelart_py-2.0.2-py3-none-any.whl (20.6 kB view details)

Uploaded Python 3

File details

Details for the file pixelart_py-2.0.2.tar.gz.

File metadata

  • Download URL: pixelart_py-2.0.2.tar.gz
  • Upload date:
  • Size: 20.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/6.2.0 CPython/3.12.4

File hashes

Hashes for pixelart_py-2.0.2.tar.gz
Algorithm Hash digest
SHA256 24c5d02ffb453f14cacd6aad6cbe6e4a7c9777c2d3ab21b3901a8a2e6ebce673
MD5 1fbf812c2271a0d407afab2f4dacf73b
BLAKE2b-256 8e7423b644383d2ad95724c43482365badc784a5d44cf256ee2be496e66b7eeb

See more details on using hashes here.

File details

Details for the file pixelart_py-2.0.2-py3-none-any.whl.

File metadata

  • Download URL: pixelart_py-2.0.2-py3-none-any.whl
  • Upload date:
  • Size: 20.6 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/6.2.0 CPython/3.12.4

File hashes

Hashes for pixelart_py-2.0.2-py3-none-any.whl
Algorithm Hash digest
SHA256 4206957292e2b84f0c67770a1ac99b302d0531d4b00e2118486717703beced37
MD5 731cc964f81f3a3e87012e7dcd894b67
BLAKE2b-256 56b8cfa91f4610368fdb9f5b4e16de646416db7e8e9fc11cb2c0afb8daf55140

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page