Simple colors and palettes
A pixel has a simple color if it is not black and if its non-zero RGB components are all equal. Or described in terms of the HSV color model: it has a hue divisible by 60, full saturation, and any value other than zero.
There are seven simple colors:
- Red
- Green
- Blue
- Cyan
- Magenta
- Yellow
- White (gray, that is)
For a given color, there are 255 different intensities (from 1 to 255). For RGB, the non-zero value is the intensity. For HSV, the volume is the intensity, scaled to 255.
A palette is a sequence of RGB colors, for example #8c4b41,da9041,ffff41
. An intensity of 255 becomes color #ffff41
. An intensity of 0 is left unchanged (as black, #000000
). Intensities with no explicit color are linearly interpolated between the two closest value. Black is implicitly the first color of the palette. For example:
intensity | color |
---|---|
50 | #522C26
|
85 | #8c4b41
|
100 | #995741
|
170 | #da9041
|
Palettes can have from one to 255 colors.
Pixels with complicated colors or without any dedicated palette are left unchanged by the dye process. The system can dye up to 1785 different colors.
Dye Channels
RGBCMYW Dyes
Usage:
Single Channel Inline xml: image.png|R:#ColorCode Multi-Channel Inline xml: image.png|R:#ColorCode;B:#ColorCode Single Channel Preset xml: image.png|R Multi-Channel Preset xml: image.png|R;B
Swap dye
This swaps a single specific color on a channel regardless of transparency for another
Use:
Inline xml: image.png|S:#StartingColor,#ResultColor; Preset xml: image.png|S
Example:
image.png|S:#FF0000,#00FF00; Starting color: #FF0000 (pure red) Result color: #00FF00 (pure green)
Alpha dye
This swaps a single specific color on a channel taking transparency into account
Use:
Inline Xml: image.png|S:#StartingColor,#ResultColor; Preset Xml: image.png|S
Example:
image.png|S:#FF000088,#00FF0088; Starting color: #FF000088 (pure red with ~half transparency) Result color: #00FF0088 (pure green with ~half transparency)
One-channel example
Here is a simple example taken from actual game data. The data/monsters.xml
file contains the descriptions of all the monsters. For black scorpions, the definition begins with
<monster id="1009" name="Black scorpion"> <sprite>monster-scorpion.xml|#0d1313,435a5a,879999,ffffff</sprite> <sound event="hit">scorpion-hit1.ogg</sound> ...
The data/graphics/sprite/monster-scorpion.xml
then describes the animation of any scorpion, whatever its color. It contains this line:
<imageset name="base" src="graphics/sprites/monster-scorpion.png|W" width="48" height="45" />
The monster-scorpion.png
file is a grayscale image, hence the W color specifier, so that all its pixels are blackened (or dyed to brown or red for other species of scorpions). If it contained some non-gray pixels, these would not be recolored by the palette specified in the monsters.xml
file.
Multi-channel example
Here an example for multi-channel dyeing of an equipment sprite. This example recolors the gray sections of the image to green and the red sections to a gray-blue.
head-devcap.xml:
<imageset name="base" src="graphics/sprites/head-devcap.png|W;R" width="28" height="19" />
items.xml:
<sprite>head-devcap.xml|#22ff22,ffffff;#9999ff</sprite>
Designing graphics to be dyeable
The easy way to make an existing graphic recolorable is to select the parts you want to be recolored and run it through a convert-to-greyscale filter and voilà , you have a recolorable 'W' channel. For optimum results you should then adjust the levels of the grey area so that the darkest color is RGB 127, 127, 127 and the brightest color RGB 255, 255, 255. That way you can very simply define the darkest and the brightest color of the color ramp in items.xml.
When you want to use another dye channel than 'W' you can use "color channels" afterwards and remove one or two of the red, green and blue channel completely.
Test dyes without restarting Manaplus
In-Game
You can reload some of the client-data by typing the following command into chat. You may have to unequip items then use the command then equip them again.
/cleangraphics
dyecmd
After version 1.3.10.27 of manaplus: the dyecmd is supported.
Usage:
dyecmd srcfile dyestring dstfile dyecmd srcdyestring dstfile
examples:
dyecmd cottonshirt.png W:#a4b2b2,ffffff test.png dyecmd "cottonshirt.png|W:#a4b2b2,ffffff" test2.png
From Source get manaplus source git clone https://bitbucket.org/akaras/manaplus.git
autoreconf -i ./configure make src/dyecmd