Herramientas Guías
fun Gratis Sin registro

Creador de Arte en Píxeles

Editor de arte en píxeles basado en navegador con relleno de inundación, cuentagotas, deshacer/rehacer y exportación a PNG.

Cargando la herramienta…

Acerca de esta herramienta

Cree arte en píxeles directamente en su navegador en una cuadrícula de 8×8, 16×16 o 32×32. Elija entre 32 colores predeterminados o seleccione cualquier color personalizado, luego pinte con el lápiz, borre con el borrador, rellene regiones con la herramienta de cubo o muestree colores existentes con el cuentagotas. Hasta 20 niveles de deshacer y rehacer mantienen sus ediciones seguras. Cuando termine, exporte su obra como PNG escalada 10× para que los píxeles sean nítidos y visibles.

Cómo usar

  1. 1 Elija un tamaño de cuadrícula (8×8, 16×16 o 32×32) y seleccione una herramienta: Lápiz, Borrador, Cubo de relleno o Cuentagotas.
  2. 2 Elija un color de las 32 muestras predeterminadas o abra el selector de color personalizado para cualquier tono.
  3. 3 Haga clic o arrastre en la cuadrícula para pintar; use los botones Deshacer / Rehacer para retroceder o avanzar.
  4. 4 Haga clic en 'Exportar PNG' para descargar su obra escalada 10× para una salida de píxeles perfectamente nítida.

What pixel art is and why a grid changes everything

Pixel art is illustration done one square at a time on a deliberately small grid, where every pixel is a conscious decision rather than a smooth gradient. It is the look of classic video games, retro icons, and emoji-style sprites, and the constraint is the point: with only a 16×16 grid to work in, you learn to suggest a shape with a handful of well-placed blocks. This maker gives you a true pixel canvas at three sizes — 8×8, 16×16, or 32×32 — drawn on an HTML canvas with crisp, non-blurred cells and visible grid lines so you always know exactly which square you are editing.

The four tools and what each one does

ToolAction
PencilPaints individual cells in the active colour; drag to paint a streak
EraserClears cells back to white (transparent on export)
FillFlood-fills a connected region of one colour in a single click
Pick (eyedropper)Samples the colour of any cell to make it the active colour

The fill tool uses a classic flood fill: starting from the cell you click, it spreads outward to every orthogonally connected cell that shares the original colour, stopping at any boundary of a different colour. That is how one click can recolour an entire enclosed area — a sky, a background, the inside of a shape — without touching anything outside it.

A worked example: a simple heart

Switch to the 16×16 grid and pick a red preset. With the pencil, place two small bumps near the top — a few cells each, separated by a one-cell gap — then taper the rows below inward until they meet at a single point at the bottom. That outline alone reads as a heart at small size. Now select the Fill tool and click inside the outline: the whole interior floods red in one action. Want a lighter centre? Pick a pink with the eyedropper-free custom colour input and dab a couple of highlight cells in the upper area. If a stroke goes wrong, Undo steps back through your last changes (up to 20 levels), and Redo brings them back.

Working with colour

You get a fixed palette of 32 presets covering the primaries, secondaries, and a useful range of dark and muted tones — enough to build a coherent sprite without decision paralysis. For anything specific, the Custom colour input opens your system colour picker so you can dial in an exact hex value, and the active-colour swatch always shows what you will paint next. A practical habit from real pixel artists: keep your palette small. Limiting yourself to a handful of colours is what gives pixel art its cohesive, deliberate look — sprawling palettes tend to read as noise at this resolution.

Exporting and the scaling trick

When you click Export PNG, the tool does something important: it does not save the large on-screen canvas with its grid lines. Instead it redraws your art at the true pixel resolution — one image pixel per grid cell — and scales it up by a clean factor (10×) with no smoothing, then downloads it as a PNG. So a 16×16 drawing exports as a sharp 160×160 image where every block stays a perfect square. This matters because if you ever scale a pixel image with normal interpolation it goes blurry; pixel art must always be scaled by whole-number factors with smoothing turned off, which is exactly what the export does. Empty (erased) cells export as white.

Practical tips

  • Start at the size you will ship. An icon for a tiny UI badge belongs on the 8×8 or 16×16 grid; detail you add at 32×32 disappears when displayed small.
  • Outline first, fill second. Lay down the silhouette with the pencil, then use Fill for the interior — it is far faster than colouring cell by cell.
  • Use the eyedropper to stay consistent. Rather than hunting the palette, pick an existing cell's colour to guarantee a match.
  • Changing grid size clears the canvas. Switching between 8, 16, and 32 starts fresh, so export before you resize.
  • It works on touch. The canvas supports finger drawing on phones and tablets, so you can sketch a sprite on the move.

Common mistakes

  • Over-detailing. The temptation at 32×32 is to render every feature; restraint and clear silhouettes read better than busy ones.
  • Relying on anti-aliasing. There is none here by design — edges are hard. Suggest curves with stair-stepped cells rather than expecting smoothing.
  • Forgetting undo has a limit. History holds your last 20 steps; export periodically if you are working on something you cannot afford to lose.

The entire editor runs in your browser. Nothing is uploaded — your artwork is drawn and exported locally, and the PNG is generated on your own device.

Preguntas frecuentes

{# Alpine.js — self-hosted. (The previous jsdelivr CDN tag had a stale SRI integrity hash, so the browser refused to run it and window.Alpine was never defined — silently breaking every FAQ accordion and Alpine tool.) #}