Spaces:
Sleeping
Sleeping
| """ Color-by-Numbers generator Gradio app for HuggingFace Spaces | |
| Upload an image (photo or pixel art) | |
| Quantize colors to a limited palette (default 8 colors) | |
| Create a printable "color-by-numbers" page where each pixel/block contains the color's number | |
| Also export a legend showing each number and its representative color (hex) | |
| Dependencies: pillow, numpy, gradio | |
| Run: pip install pillow numpy gradio | |
| then python huggingface_color_by_numbers_app.py | |
| When deployed to Hugging Face Spaces, set runtime to use the same file. | |
| """ | |
| from PIL import Image, ImageDraw, ImageFont | |
| import numpy as np | |
| import gradio as gr | |
| import io | |
| def quantize_image(img: Image.Image, n_colors: int): | |
| """Quantize the image to n_colors using PIL adaptive palette. | |
| Returns: label_map (h,w) of 0..(k-1) and palette list of (r,g,b). | |
| """ | |
| # convert to RGBA and remove alpha by compositing on white background | |
| img = img.convert("RGBA") | |
| background = Image.new("RGBA", img.size, (255, 255, 255, 255)) | |
| img = Image.alpha_composite(background, img).convert("RGB") | |
| # Use PIL quantize to reduce to n_colors | |
| q = img.convert('P', palette=Image.ADAPTIVE, colors=n_colors) | |
| palette = q.getpalette() # flat list r,g,b,r,g,b,... length >= n_colors*3 | |
| # build palette list from used palette indices | |
| used_indices = list(sorted(set(q.getdata()))) | |
| # extract first n_colors entries from palette | |
| pal = [] | |
| for i in range(n_colors): | |
| r = palette[3 * i] | |
| g = palette[3 * i + 1] | |
| b = palette[3 * i + 2] | |
| pal.append((r, g, b)) | |
| # Convert paletted image to numpy labels: each pixel index corresponds to 0..(n_colors-1) | |
| label_map = np.array(q, dtype=np.int32) | |
| return label_map, pal | |
| def sort_palette_by_brightness(palette): | |
| # compute luminance and sort (brighter later) so numbers have consistent ordering | |
| lum = [0.299 * c[0] + 0.587 * c[1] + 0.114 * c[2] for c in palette] | |
| order = np.argsort(lum) | |
| sorted_palette = [palette[i] for i in order] | |
| return sorted_palette, order | |
| def remap_labels(label_map, order): | |
| # order says old_index -> new position in sorted palette | |
| # produce mapping from old index to new index | |
| inv = np.empty_like(order) | |
| for new_idx, old_idx in enumerate(order): | |
| inv[old_idx] = new_idx | |
| remapped = inv[label_map] | |
| return remapped | |
| def rgb_to_hex(rgb): | |
| return '#%02x%02x%02x' % rgb | |
| def generate_color_by_numbers_page(label_map: np.ndarray, palette: list, block_size: int = 24, outline: bool = True, font_path: str = None): | |
| """Generate a color-by-numbers image where each block contains the number (1..k). | |
| - label_map: 2D array of labels 0..k-1 | |
| - palette: list of RGB colors for legend ordering | |
| - block_size: pixel size of a single input pixel when scaled up | |
| """ | |
| h, w = label_map.shape | |
| k = len(palette) | |
| # Create canvas | |
| canvas_w = w * block_size | |
| canvas_h = h * block_size | |
| canvas = Image.new('RGB', (canvas_w, canvas_h), (255, 255, 255)) | |
| draw = ImageDraw.Draw(canvas) | |
| # Load font | |
| try: | |
| if font_path: | |
| font = ImageFont.truetype(font_path, int(block_size * 0.6)) | |
| else: | |
| font = ImageFont.load_default() | |
| except Exception: | |
| font = ImageFont.load_default() | |
| # draw each cell | |
| for y in range(h): | |
| for x in range(w): | |
| label = int(label_map[y, x]) # 0..k-1 | |
| left = x * block_size | |
| top = y * block_size | |
| right = left + block_size | |
| bottom = top + block_size | |
| # fill with white | |
| draw.rectangle([left, top, right, bottom], fill=(255, 255, 255)) | |
| # draw outline grid | |
| if outline: | |
| draw.rectangle([left, top, right - 1, bottom - 1], outline=(200, 200, 200)) | |
| # draw number centered | |
| number = str(label + 1) | |
| bbox = draw.textbbox((0, 0), number, font=font) | |
| tw = bbox[2] - bbox[0] | |
| th = bbox[3] - bbox[1] | |
| nx = left + (block_size - tw) / 2 | |
| ny = top + (block_size - th) / 2 - 1 | |
| draw.text((nx, ny), number, fill=(0, 0, 0), font=font) | |
| return canvas | |
| def generate_palette_legend(palette: list, block_size: int = 48): | |
| k = len(palette) | |
| padding = 10 | |
| sw = block_size * k + padding * (k + 1) | |
| sh = block_size + 2 * padding + 20 # extra space for hex text | |
| legend = Image.new('RGB', (sw, sh), (255, 255, 255)) | |
| d = ImageDraw.Draw(legend) | |
| try: | |
| font = ImageFont.load_default() | |
| except Exception: | |
| font = ImageFont.load_default() | |
| for i, rgb in enumerate(palette): | |
| x = padding + i * (block_size + padding) | |
| y = padding | |
| d.rectangle([x, y, x + block_size, y + block_size], fill=rgb, outline=(0, 0, 0)) | |
| label = str(i + 1) | |
| bbox = d.textbbox((0, 0), label, font=font) | |
| tw = bbox[2] - bbox[0] | |
| th = bbox[3] - bbox[1] | |
| d.text((x + (block_size - tw) / 2, y + (block_size - th) / 2), label, fill=(0, 0, 0), font=font) | |
| # hex text below | |
| hexcode = rgb_to_hex(rgb) | |
| d.text((x, y + block_size + 2), hexcode, fill=(0, 0, 0), font=font) | |
| return legend | |
| def process_image_to_color_by_numbers(pil_img: Image.Image, n_colors: int = 8, block_size: int = 24, outline: bool = True): | |
| # 1) quantize | |
| label_map, pal = quantize_image(pil_img, n_colors) | |
| # 2) sort palette by brightness | |
| sorted_pal, order = sort_palette_by_brightness(pal) | |
| remapped = remap_labels(label_map, order) | |
| # 3) generate page | |
| page = generate_color_by_numbers_page(remapped, sorted_pal, block_size=block_size, outline=outline) | |
| # 4) generate legend | |
| legend = generate_palette_legend(sorted_pal, block_size=max(32, block_size * 2)) | |
| return page, legend | |
| # -------------------- Gradio interface -------------------- | |
| def process_and_return(inp_img, n_colors, block_size, show_legend): | |
| if inp_img is None: | |
| return None | |
| pil = Image.open(inp_img) # inp_img is file path string | |
| page, legend = process_image_to_color_by_numbers(pil, n_colors=n_colors, block_size=block_size) | |
| # combine vertically | |
| if show_legend: | |
| combined_w = max(page.width, legend.width) | |
| combined_h = page.height + legend.height + 20 | |
| combined = Image.new('RGB', (combined_w, combined_h), (255, 255, 255)) | |
| combined.paste(page, (0, 0)) | |
| combined.paste(legend, (0, page.height + 20)) | |
| else: | |
| combined = page | |
| bio = io.BytesIO() | |
| combined.save(bio, format='PNG') | |
| bio.seek(0) | |
| return bio | |
| demo = gr.Interface( | |
| fn=process_and_return, | |
| inputs=[ | |
| gr.Image(type='filepath', label='Upload image'), # Changed to 'filepath' for clarity | |
| gr.Slider(minimum=2, maximum=12, step=1, value=8, label='Number of colors (reduction)'), | |
| gr.Slider(minimum=8, maximum=64, step=1, value=24, label='Block size (pixels)'), | |
| gr.Checkbox(label='Show legend with color swatches and hex codes', value=True) | |
| ], | |
| outputs=[gr.File(label='Download Color-by-Numbers Page (PNG)')], # Changed to File for download | |
| title='🎨 Color-by-Numbers Generator', | |
| description='Upload an image and get a printable color-by-numbers page. The app quantizes colors to a small palette and writes numbers in each pixel block so children (or adults) can color by numbers.', | |
| allow_flagging="never" | |
| ) | |
| if __name__ == "__main__": | |
| demo.launch() |