ECA Soccer Portrait Editor

Manually cover shoulders or background noise with white pixels. Our game engine uses a flood-fill transparency remover starting from the corners; anything you paint white that connects to the outer edge will instantly become transparent in the game!

1. Select Asset or Character to Edit

OR
2. Interactive Canvas Pixel Art Grid

Drag & drop any PNG file directly here

Recenter Face (Shift Pixels)
Brush Size (px): 2
Brush Color:
White ➔ Transparent: 0
Zoom Level: 100%
Grid Resolution:
In-Game Skin Color:
#ffffff
Shadow Color (Dark):
#ffffff
3. Nationality & Team Kit Colors
Country:
Shirt:
Shorts:
Socks:
Stripe:
Shoes:
3. In-Game Transparency Preview Live View
Verify the live preview below. Any white area touching the corners will be removed in-game.

How to Rebrand & Crop your Custom Portraits:

  1. Click a character button above (or drop their PNG file). It loads the active texture.
  2. Paint White: Drag your mouse/finger across the canvas. Brush over the shirt, neck, or shoulders at the bottom. Fill them with white (`#ffffff`).
  3. Observe the Live View. Because the background remover removes any white block that touches the corners, painting the shoulders white connects them to the bottom corner, making them vanish!
  4. Click Download Updated PNG.
  5. Move the downloaded file from your downloads folder into your project directory at /public/chars/<name>.png (replacing the original).
  6. Vite will instantly hot-reload, and you will see the updated pixel-art heads floating perfectly in the game!