Ramp Palette Swap

Map a ramp by lightness order and build team-colour variants in one go.

A palette swap recolours a sprite by mapping each colour of one shading ramp onto the step in the same position of another ramp: the darkest red of a cloak becomes the darkest blue, the highlight becomes the highlight, and nothing else changes. In the Pixel Lab's Recolour stage you select the source colours, generate a target ramp from one base colour (or pick one), and apply it to every frame; team variants (red, blue, green, yellow or any #RRGGBB) export as one ZIP with a folder and a .gpl per variant.

Drop image files hereProcess many files at once

No upload · processed on this device

Map by position in the ramp, never by nearest colour

Replacing each colour by its nearest match in the new palette breaks shading: two neighbouring shades of red can both land on the same blue, and a light red can land on a darker blue than its shadow. The Lab sorts the selected source colours by Oklab lightness and maps them onto the target ramp by position, so the first becomes the darkest target, the last the lightest, and the order cannot invert.

A target ramp can be generated from a single base colour. It keeps the source ramp's lightness steps, takes the base colour's hue and chroma (so the base's own lightness is not used), boosts chroma in the mid-tones and rotates hue by up to 12° across the ramp, darker end one way and lighter end the other. The result is a starting point to adjust, not a finished art decision.

Every recolour is a palette transform: a pixel keeps its palette index and only the colour behind the index changes. Two frames that shared a shade still share it, which is why the swap cannot introduce flicker or stray colours between frames.

Ramp swap: Mapping selected source colours onto a target ramp by their position from dark to light.
Team variant: The same sprite recoloured with a different base colour for each team or player.
Hue window: A range of hues (centre ± degrees) whose colours are replaced while keeping their own lightness.
Status tint: A recipe that pulls every colour toward one hue (frozen, poison, burn, ghost, damage flash).

Example: a red cloak ramp turned into team blue

Computed with the Lab's own functions (L = Oklab lightness, h = hue):

source (red cloak)   #5a1e28 L0.33 h13 | #a02c3a L0.48 h18 | #dc5a50 L0.63 h27 | #f5a08c L0.79 h34
base: team blue      #3467d6 (L0.54 is ignored; hue 263°, chroma 0.18 are used)
generated ramp       #002d8c L0.35 | #004ed5 L0.48 | #4f7bff L0.62 | #99acff L0.76
hue along the ramp   262° → 262° → 267° → 273°
mapping by position  darkest→darkest … lightest→lightest; black and white untouched
3 colours onto a 5-step ramp: positions 0, 0.5, 1 → steps 0, 2, 4
test: 4 variants × 8 frames = 32 PNGs; 3 selected slots changed, 13 byte-identical

The generated lightness follows the source within 0.03; the lightest blue lands a little lower because sRGB cannot hold that blue at full chroma. Nudge it by hand if the highlight looks dull.

Check a swap

Before applying, compare the source and target swatches side by side: both rows should run dark to light.
Step through the frames: every frame should change only the selected colours, and outlines, skin and eyes stay as they were.
Open one variant's .gpl: the untouched slots have the original colours in the original order.
Put the variants next to each other at 1×: the teams should be distinguishable at game size, not only zoomed in.

Troubleshooting

Symptom	Likely cause	How to check	Fix
The shading came out inverted or flat	A colour outside the ramp (outline, skin) was selected with it	The selected swatches do not form one dark-to-light sequence	Select only the ramp's colours; the order you click in does not matter, lightness decides
Other parts changed colour too	The cloak shares a palette entry with another part of the sprite	Select that swatch and compare its pixel count with the cloak alone: other parts use it too	Give that part its own colour first (for example in the Studio's Pixel workspace), then swap
The team colour is much darker or lighter than the base I picked	The generated ramp keeps the source lightness steps and uses only the base's hue and chroma	Compare the base swatch with the middle of the generated ramp	Pick a target ramp by hand, or choose a base with the hue you want and adjust the steps
The hue window catches too much or nothing	The window (± degrees) is too wide or too narrow, and near-grey colours are ignored	The preview marks the matching colours with a tick	Narrow or widen the window; greys need the ramp swap instead

Other ways to do it

Option	When it is the better choice
Team-colour variants in the Studio's Pixel workspace	The sprite has layers and tags: variants apply to every frame and layer and each becomes a new sprite; in an indexed sprite a single palette edit recolours every frame. See the palette editor.
One-colour palette swap with a tolerance	You only need to replace a single colour, with a shading offset: palette swap.
Aseprite: Edit › Replace Color	You work in Aseprite and replace colours one at a time, with a tolerance, on the selection or on all cels.

What this page does not cover

Variants export as PNG frames and .gpl files, not as .aseprite.
One palette for all loaded frames: a sheet with two unrelated characters must be split first.
Status presets are recipes, not authored art.

Versions and sources

Nerulio: docs/PIXEL-LAB.md (Chromium; 4 team variants × 8 frames exported as 32 PNGs in 4 folders, each changing exactly the 3 selected palette slots and leaving the other 13 byte-identical). The ramp above was computed with src/game/palette.js. Aseprite's Replace Color follows its documentation.

Official documentation used

Aseprite docs: Replace Color

Ramp Palette Swap

Map a ramp by lightness order and build team-colour variants in one go.

How it works

Add images
Adjust settings and review the result
Download a new file

Supported formats

PNG / JPG / WebP / AVIF / HEIC → PNG + JSON (ZIP) — Input decoding depends on browser support and optional engines.

What this tool does

Map a shading ramp onto another by lightness order and generate team-colour variants at once.

Implementation and verified quality

advanced · OkLCh ramp position mapping / hue-window replace / index-preserving variants. Quality qualification is in progress. Pro/Flagship quality has not been established.

Before you export

It maps by lightness order only; it does not know which colour is skin, metal or cloth.

Frequently asked questions

What are this tool’s limitations?

It maps by lightness order only; it does not know which colour is skin, metal or cloth.

Are my files uploaded?

This tool processes the files you open on your device without uploading them. Images you explicitly attach to community posts are uploaded separately. Optional engines and models are downloaded from third parties; those requests expose connection information such as your IP address.

Will my work be saved automatically?

No. Images and editing state stay in this tab; media output can use local temporary storage. Changing language preserves your work; reloading, closing the tab, or following a link to another page can clear it.