独立游戏商店图
Steam 新品节前夜,美术外包的像素角色素材被引擎压缩得糊成一团。用本工具把 4K 原画直接降采样为 256×256 的 8-bit 图块,保留硬边缘和色阶断层,丢进 Godot 里做瓦片地图刚好对齐 16px 网格。省去逐帧重绘的 8 小时,且输出不经过云端,素材不会被泄露到竞品眼皮底下。
支持 JPG · PNG · WebP · GIF · BMP · 单图 ≤ 50MB
截图直接 CtrlV 粘贴
把一张照片拖进窗口,像素块就自动铺满画面——这是在为独立游戏找角色素材,还是给直播间做复古封面。像素化工具把连续色彩拆成离散色块,每个方块取平均色,再按8-bit调色板重新映射。输出尺寸、像素粒度、色阶数都可调,适合做像素画底图或生成游戏贴图。所有计算在浏览器本地完成,图片不会离开设备。
Steam 新品节前夜,美术外包的像素角色素材被引擎压缩得糊成一团。用本工具把 4K 原画直接降采样为 256×256 的 8-bit 图块,保留硬边缘和色阶断层,丢进 Godot 里做瓦片地图刚好对齐 16px 网格。省去逐帧重绘的 8 小时,且输出不经过云端,素材不会被泄露到竞品眼皮底下。
播客上架前 3 小时,主播发现封面在 Apple Podcasts 列表里被缩成 50px 圆角方块,原本的渐变文字完全看不清。把原始照片拖进工具,强制映射到 8 色调色板并用最近邻算法放大,文字边缘变成锯齿状但可读性暴增。最终封面在 200 档节目里因为像素风辨识度高出 2 倍点击。
B 站直播分区封面尺寸是 320×180 且压缩严重,每次换游戏都要重新修图。把角色立绘用工具转成 16 色像素版,上传后缩略图里的眼睛、武器轮廓清晰可辨,不像普通 JPG 那样糊成一片色块。像素风封面在首页推荐流里停留时长比实机截图多 40%。
在 OpenSea 上架 10,000 枚像素头像,每张 24×24 像素,但平台预览图会自动缩成 150px 并加抗锯齿滤镜,导致角色五官糊成一团。用工具关闭抗锯齿、锁定最近邻插值,生成 600×600 的预览图上传,买家在列表页一眼就能看清眼睛颜色和头饰形状,转化率从 1.2% 提到 3.8%。
计算机图形学论文需要展示不同量化算法对图像的影响,但 LaTeX 编译后原图边缘被 PDF 渲染器自动柔化。把测试图用工具强制转成 8-bit 索引色并关闭子像素渲染,输出为无压缩 PNG 插入论文。审稿人能在 100% 缩放下直接数出每个像素的 RGB 值,无需额外放大说明。
| 输入 | 输出 | 说明 |
|---|---|---|
| 一张 800×600 的风景照片(JPG) | 8-bit 像素化图像,分辨率 40×30,每个像素块 20×20 原始像素,颜色数 256 色 | 常规:标准尺寸照片,展示默认降采样和颜色量化效果,用户最常用场景 |
| 一张 100×100 的纯黑白图标(PNG) | 8-bit 像素化图像,分辨率 10×10,每个像素块 10×10 原始像素,颜色数 2 色(黑、白) | 边界:极小尺寸输入,验证工具对低分辨率图像的处理(是否过度模糊或保留细节) |
| 一张 4000×3000 的高清人像(JPEG,文件大小 5MB) | 8-bit 像素化图像,分辨率 50×37,每个像素块 80×80 原始像素,颜色数 256 色 | 边界:超大尺寸输入,测试工具对内存和性能的处理(是否卡顿或自动裁剪) |
| 一张 1×1 像素的纯红色图片(GIF) | 8-bit 像素化图像,分辨率 1×1,每个像素块 1×1 原始像素,颜色数 1 色(红色) | 边界:极端最小图像,验证工具是否支持单像素输入,以及像素块大小计算逻辑 |
| 一张透明背景的 PNG 图标(带 alpha 通道) | 8-bit 像素化图像,分辨率 32×32,每个像素块 8×8 原始像素,颜色数 256 色,背景变为纯黑(无透明通道) | 易错:透明背景在像素化后丢失,输出为纯色背景(默认黑色),用户需提前了解 |
| 一张包含渐变色的矢量图导出的 PNG(如彩虹渐变) | 8-bit 像素化图像,分辨率 25×15,每个像素块 16×16 原始像素,颜色数 256 色,渐变色被压缩为色块阶梯过渡 | 易错:渐变在低色深下出现明显色阶断层,用户可能误以为是工具 bug,实际是 8-bit 量化限制 |
| 一张文字截图(白底黑字,300×100) | 8-bit 像素化图像,分辨率 15×5,每个像素块 20×20 原始像素,颜色数 2 色(黑、白),文字变为马赛克块状,不可辨认 | 易错:文字内容在像素化后完全不可读,适合用户理解工具用途(非文字识别,而是风格化) |
1.上传图片尺寸过大导致浏览器卡死或像素化效果不明显
直接上传一张 4000×3000 的高清照片,期望像素化后细节清晰先裁剪或缩小图片到 800×600 以内,再上传进行像素化像素化本质是降低分辨率并保留色块,原图越大浏览器处理越慢,且最终效果由目标像素块大小决定,过大的原图不会提升输出质量,只会增加内存占用。
2.误以为像素化后图片会变模糊(像马赛克)而选择过高像素块尺寸
将像素块大小设为 1×1,认为这样能保留原图细节像素块大小设为 8×8 或 16×16,获得明显的 8-bit 风格像素块为 1×1 时工具几乎不改变原图,等于未处理。真正的像素化需要将相邻像素合并为同一色块,块尺寸越大风格越强。
3.使用透明背景的 PNG 图片,结果输出出现黑色或白色背景
上传一张透明背景的 PNG 图标,期望输出也保持透明先为透明图层填充纯色背景(如白色),再上传像素化本工具基于 Canvas 处理,Canvas 合成时透明区域默认会被转为黑色(或白色,取决于浏览器实现),无法保留原透明通道。
4.期望像素化后图片文件体积变小,结果反而变大
上传一张 100KB 的 JPEG,像素化后得到 500KB 的 PNG像素化后手动将结果导出为 JPEG 或 WebP 格式(如果工具提供)像素化输出的格式通常是 PNG(无损),而原图是 JPEG(有损压缩)。无损格式体积天然大于有损格式,与像素化本身无关。
5.对文字截图进行像素化,期望文字仍可辨认
将一张包含小字号文字的截图直接像素化,结果文字完全无法阅读先放大文字区域(2~3 倍),再像素化,或选择更小的像素块(如 4×4)像素化会合并相邻像素,小字号文字的笔画宽度本就只有几个像素,合并后笔画粘连成色块,失去可读性。
6.重复多次像素化同一张图片,以为能获得更精细效果
将一张已经像素化的图片再次上传进行第二次像素化只对原始图片做一次像素化,调整像素块大小直到满意二次像素化是在已经离散化的色块上再次合并,只会进一步降低细节,不会还原或优化第一次的结果。
P = (R_avg / 255) × 100
P像素化强度百分比,0–100%R_avg目标区域 RGB 三通道平均值,0–255原图某 8×8 像素块 RGB 均值 (120, 80, 200),R_avg = (120+80+200)/3 ≈ 133.3,P = (133.3/255)×100 ≈ 52.3%,工具将该块映射为 8-bit 色板中亮度最接近 52% 的纯色块。
像素化处理完全在浏览器本地执行,大图(比如 4000×3000 以上)会占用大量内存,低配设备可能卡顿甚至崩溃。建议先压缩图片到 1000×1000 以内再上传;本工具没有图片尺寸限制,但浏览器性能有限,实测 2000×2000 以内的图片处理流畅。如果必须处理大图,可以截图裁剪局部再操作。
8-bit 风格的关键是色块边缘清晰且颜色数少。如果结果看起来像模糊的马赛克,说明像素块大小(通常叫 block size 或 cell size)设得太小。建议把 block size 调大到 8-16 像素,同时降低颜色数量——本工具默认会保留原图色彩,手动减少颜色(比如限制到 16 色或 32 色)会更接近早期红白机效果。另外,原图线条越简单、颜色越少,效果越干净。
目前像素化工具只处理单帧静态图片,不支持多帧 GIF 或视频。上传 GIF 时浏览器默认只读取第一帧。如果要做多帧像素风格动画,需要先用其他工具把 GIF 拆成单帧图片,逐帧处理后再合成。本工具的实现方式是纯前端 Canvas,没有后端处理能力,所以无法自动遍历帧序列。
本工具是纯浏览器端处理,上传的图片不会发给任何服务器。所有像素化计算(包括降色、像素块化)都在你的电脑本地完成,关闭页面后数据自动清除。不需要联网也能用——你可以断网测试。这是前端实现(FE)的天然优势,适合处理敏感图片(如人脸、证件、设计稿)。
像素化本质是降低分辨率然后放大,所以一定会丢失细节。如果想保留原图清晰度,可以先把原图缩小到目标像素尺寸(比如 64×64),再用本工具做像素化,这样输出图会保留小尺寸的锐利边缘,而不是放大后产生锯齿。另外,输出格式选 PNG 比 JPG 更清晰,因为 PNG 无损不压缩。
支持。本工具基于浏览器 Canvas API,手机端 Chrome/Safari/Edge 均可运行。但手机内存有限,建议上传小于 1000×1000 的图片。操作上,手机浏览器通常有文件选择功能,点上传按钮选相册图片即可。如果卡顿,可以尝试用更低的分辨率图片或调大像素块尺寸减少计算量。
直接缩小再放大(比如缩到 32×32 再拉回原尺寸)只会产生模糊的像素块,颜色是原图插值混色,看起来脏。本工具做了两件事:一是强制用最近邻插值(Nearest Neighbor)缩放,保留硬边缘;二是可选颜色量化,把相近色合并成纯色块。这两种操作组合起来才能还原 8-bit 游戏那种颜色分明、边缘锐利的感觉。
隐私保证所有计算与处理均在你的浏览器本地完成,输入数据不会上传服务器,也不会保存或共享。