The Hitchhiker's Guide to Color Tokens

gaoneng
July 13, 2005

The color tokens discussed in this article are applicable to Bioware's Neverwinter Nights Aurora engine only. Please do not take them out of context. Note also that, while widely practiced, color tokens are not officially supported and you use them at your own risk. Neither Bioware nor I is to be held responsible for damage of any kind should you decide to use the color tokens despite these warnings.

Some fonts not supported in Firefox, best viewed on Internet Explorer.


The Hitchhiker's Guide to Color Tokens

[ Introduction ]]]]]]]]]]]]]]]]]]]]
Ever wonder how Rick Burton made the Ylaam Image's name purple? Want to fake a saving throw message but don't know how to? Everyone speaking in white in cutscenes and making it difficult to tell who's talking? Want to make a Diablo style campaign with blue magic items, orange craft items, and grey slotted items? Color tokens are here to solve all these problems for you.

Before we start, plug this chunk of gibberish into a placeable's or item's or creature's description field and examine the object in-game.

Awesome eh?

Color tokens can be used directly in :-

and indirectly via custom tokens in :- Which is just about everything.

[ Implementation ]]]]]]]]]]]]]]]]]]]]
The way to implement a color token is :-

   <c###>string</c>

where c signals the color token, ### represents the color intensities on the RGB scale, and string stands for the text string to be colored. The </c> closes a color tag, much like html or bbcode, so you can continue with the default white or another color.

[ Colors in general ]]]]]]]]]]]]]]]]]]]]
If you're familiar with the RGB color scale, you can skip this part.

Else, if you think the primary colors are Red, Yellow and Blue, you are wrong. Don't argue that they are the primary colors of pigments either, because you'll still be wrong. The primary colors of pigments are Cyan, Magenta and Yellow, plus Black for contrast, while the primary colors of light are Red, Green and Blue.

The color tokens use the RGB scale, so we'll be talking in RGB terms from now onwards.

A color has three channels, red, green and blue, in that order. What your eyes see depends on the intensity of each of these channels. Intensity range from 0 for none to 255 for full. So, a {255, 0, 0} will give you red and a {0, 0, 255} will give you blue.

Color mixing in terms of light can be funny if you're used to the Red Yellow Blue propaganda. You just have to imagine how a white object will look like if you start flashing colored torch beams on it. Here's a sampling of some common colors in RGB.

In practice, mixing up the primary colors and lowering the intensity of some channels will give your colors a more natural feel, for example, a {40, 60, 230} blue will look much nicer than a pure {0, 0, 255} blue. But this doesn't really matter for colored text strings, since we want all the contrast we can get.

[ The ALT-code, aka the ### part of the color token ]]]]]]]]]]]]]]]]]]]]
Now comes the interesting part. As mentioned, the ### represents the RGB scale, where the first # is the red channel, the second # is the green channel, and the third # is the blue channel.

To assign a value of intensity to any channel, we use the ALT-codes. To type ALT-codes, press and hold the ALT key on your keyboard, type in the numericals using the number pad on the right, and release the ALT key. Make sure Num Lock is on. If you're using a laptop, like me, there should be a Fn key of some sort that will allow you to fake the number pad on your main keyboard. If there isn't a Fn key, uh, congratulations for being the owner of a prehistoric printing press - and go get yourself a USB number pad.

(The script editor doesn't seem to support the keying in of ALT-codes directly on my machine, but simple copy-and-pasting from my plain text editor into the script editor works just fine.)

For any channel in the color tokens, add an extra 0 to the front of the numerical value of the intensity you want. So to define a 255, we press and hold ALT, type 0255 on the number pad, and release. You should end up with the symbol .

A color token for white should therefore be <c> representing {255, 255, 255} and pink be <cd> representing (250, 100, 200). As there isn't any alt-code for the very small values, we use a blank space " " to represent 0. So a green token should be <c > where the spaces represent 0 on both red and blue channels, i.e {0, 255, 0}.

Refer to this table for all the ALT-codes from 0000 to 0255, as well as some extra notes.

[ Examples ]]]]]]]]]]]]]]]]]]]]
To make the name of a dagger purple, put
   <c >A Purple Dagger</c>
in the name field of the dagger. Note the use of space " " to represent 0.

To make a vampire speak a string in yellow, call
   SpeakString("<c >Show me the spoon!</c>");
in the script. Note how the color token resides within the quotation marks. Note also that because the script editor seems to recognize the 0255 symbol as something that we can't use, we use 0254 instead, which is about the same intensity and not really distinguishable by the human eye.

To create a gradient effect for the description of a white shaft of light, put
   A se<c>arin</c><c>g sh</c><c>aft </c><cxxx>of </c>white<cddd> lig</c><cAAA>ht.</c>
in the description field. The text "white" will stand out brightly against the background gradient. There is no limit to the number of colors you can use in any string, you just need to define a new color token everytime you want a change of color.

And so on. Brainless eh? You can create almost any color you want, as long as you avoid the unavailable numbers noted in the table above.

Have fun!
Erick, gaoneng

 


Appendix

[ Palette ]]]]]]]]]]]]]]]]]]]]
You can use the color palette of graphics programs like Photoshop or MSPaint to test out various channel combinations if you have difficulty imagining the resultant color.

For the lazier folks, here's a table of 140 colors derived from standard html color codes. (Source : "So, You Want A Basic Color Code, Huh?" Joe Burns, HTMLGoodies)

aliceblue
(240, 248, 255)
antiquewhite
(250, 235, 215)
aqua
(0, 255, 255)
aquamarine
(127, 255, 212)
azure
(240, 255, 255)
beige
(245, 245, 220)
bisque
{255, 228, 196}
black
{0, 0, 0}
blanchedalmond
(255, 235, 205)
blue
{0, 0, 255}
blueviolet
{138, 43, 226}
brown
{165, 42, 42}
burlywood
{222, 184, 135}
cadetblue
(95, 158, 160)
chartreuse
{127, 255, 0}
chocolate
{210, 105, 30}
coral
{255, 127, 80}
cornflowerblue
{100, 149, 237}
cornsilk
{255, 248, 220}
crimson
{220, 20, 60}
cyan
{0, 255, 255}
darkblue
{0, 0, 139}
darkcyan
{0, 0, 139, 139}
darkgoldenrod
{184, 134, 11}
darkgray
{169, 169, 169}
darkgreen
{0, 100, 0}
darkkhaki
{189, 183, 107}
darkmagenta
{139, 0, 139}
darkolivegreen
{85, 107, 47}
darkorange
{255, 140, 0}
darkorchid
{153, 50, 204}
darkred
{139, 0, 0}
darksalmon
{233, 150, 122}
darkseagreen
{143, 188, 143}
darkslateblue
{72, 61, 139}
darkslategray
{47, 79, 79}
darkturquoise
{0, 206, 208}
darkviolet
{148, 0, 211}
deeppink
{255, 20, 147}
deepskyblue
{0, 191, 255}
dimgray
{105, 105, 105}
dodgerblue
{30, 144, 255}
firebrick
{178, 34, 34}
floralwhite
{255, 250, 240}
forestgreen
{34, 139, 34}
fuchsia
{255, 0, 255}
gainsboro
{220, 220, 220}
ghostwhite
{248, 248, 255}
gold
{255, 215, 0}
goldenrod
{218, 165, 32}
gray
{128, 128, 128}
green
{0, 128, 0}
greenyellow
{173, 255, 47}
honeydew
{240, 255, 240}
hotpink
{255, 105, 180}
indianred
{205, 92, 92}
indigo
{75, 0, 130}
ivory
{255, 255, 240}
khaki
{240, 230, 140}
lavender
{230, 230, 250}
lavenderblush
{255, 240, 245}
lawngreen
{124, 252, 0}
lemonchiffon
{255, 250, 205}
lightblue
{173, 216, 230}
lightcoral
{240, 128, 128}
lightcyan
{224, 255, 255}
lightgoldenrodyellow
{250, 250, 210}
lightgreen
{144, 238, 144}
lightgrey
{211, 211, 211}
lightpink
{255, 182, 193}
lightsalmon
{255, 160, 122}
lightseagreen
{32, 178, 170}
lightskyblue
{135, 206, 250}
lightslategray
{119, 136, 153}
lightsteelblue
{176, 196, 222}
lightyellow
{255, 255, 224}
lime
{0, 255, 0}
limegreen
{50, 205, 50}
linen
{250, 240, 230}
magenta
{255, 0, 255}
maroon
{128, 0, 0}
mediumauqamarine
{102, 205, 170}
mediumblue
{0, 0, 205}
mediumorchid
{186, 85, 211}
mediumpurple
{147, 112, 216}
mediumseagreen
{60, 179, 113}
mediumslateblue
{123, 104, 238}
mediumspringgreen
{0, 250, 154}
mediumturquoise
{72, 209, 204}
mediumvioletred
{199, 21, 133}
midnightblue
{25, 25, 112}
mintcream
{245, 255, 250}
mistyrose
{255, 228, 225}
moccasin
{255, 228, 181}
navajowhite
{255, 222, 173}
navy
{0, 0, 128}
oldlace
{253, 245, 230}
olive
{128, 128, 0}
olivedrab
{104, 142, 35}
orange
{255, 165, 0}
orangered
{255, 69, 0}
orchid
{218, 112, 214}
palegoldenrod
{238, 232, 170}
palegreen
{152, 251, 152}
paleturquoise
{175, 238, 238}
palevioletred
{216, 112, 147}
papayawhip
{255, 239, 213}
peachpuff
{255, 218, 185}
peru
{205, 133, 63}
pink
{255, 192, 203}
plum
{221, 160, 221}
powderblue
{176, 224, 230}
purple
{128, 0, 128}
red
{255, 0, 0}
rosybrown
{188, 143, 143}
royalblue
{65, 105, 225}
saddlebrown
{139, 69, 19}
salmon
{250, 128, 114}
sandybrown
{244, 164, 96}
seagreen
{46, 139, 87}
seashell
{255, 245, 238}
sienna
{160, 82, 45}
silver
{192, 192, 192}
skyblue
{135, 206, 235}
slateblue
{106, 90, 205}
slategray
{112, 128, 144}
snow
{255,250, 250}
springgreen
{0, 255, 127}
steelblue
{70, 130, 180}
tan
{210, 180, 140}
teal
{0, 128, 128}
thistle
{216, 191, 216}
tomato
{255, 99, 71}
turquoise
{64, 224, 208}
violet
{238, 130, 238}
wheat
{245, 222, 179}
white
{255, 255, 255}
whitesmoke
{245, 245, 245}
yellow
{255, 255, 0}
yellowgreen
{154, 205, 50}

As mentioned earlier in the table for alt-codes, some alt-codes are not useable in the toolset. If the color you want to use happens to have an intensity value that falls into the unuseable range, you can safely bump the value up or down to the nearest legit value without affecting the color much.

[ Color tokens in journals, conversations and placeable names, aka the custom tokens ]]]]]]]]]]]]]]]]]]]]
When you attempt to use color tokens directly in journals, conversation bodies or placeable names, you get that <UNRECOGNIZED TOKEN> string in-game. Only custom tokens can be used in these three things, and for us to trick them into using color tokens, we set the color tokens directly as custom tokens.

Here's a sample script you can use. We set the all the color custom tokens OnModuleLoad so that all these custom tokens will start working even before the player enters the mod. In here, I predefined several general colors, which can always be dynamically changed later on.

Once set, we can start using these color custom tokens like normal custom tokens. For example, if I want my vampire's conversation to be very colorful, I do this :-

and the in-game effect will look something like :-
  1. And you love it so...
  2. And it follows wherever I go...
Be sure to use the close tag, in this case <CUSTOM100> to close a color tag everytime you want to return the color to normal. As you can probably see, it's a bit of a hassle to use color tokens in journals, conversations and placeable names, but the outcome will be well worth the effort.

[ Color tokens in scripts ]]]]]]]]]]]]]]]]]]]]
There are several factors going against using color tokens directly in scripts :-

The existing script-based color token systems on the vault by-pass this by using only legal symbols, or by using preset string variables somewhere in the module, together with readymade color constants. However, and as far as I know, the purpose of these existing systems is mainly to fake combat statuses and server messages, and hence come in only several commonly seen standard preset colors. You should know by now that there are way lot more colors than the standard few. Here's an alternative approach inspired by community member rdjparadis that will allow the end user to define the values of intensities directly. You can copy-and-paste this into an include file, or use it directly in any script.

This will enable us to create properly coded strings of almost any color on the fly both in the script editor as well as in-game. The constant string COLORTOKEN has 256 characters where each character correspond to a particular intensity. As mentioned, because some symbols are not useable in the script editor, I've replaced them with the next nearest legit symbol. The effect of this is negligible, but if you are really particular, you can try setting a string variable similar to the COLORTOKEN line somewhere in your module with those missing symbols and call a GetLocalString to retrieve that string instead. (The variables editor accepts more symbols, such as " and , than the script editor.)

So for example, if I want my vampire to speak a string colored based on the alignment of the player :-

This approach has a much wider spectrum of applications, so be sure to take your time to explore and come up with more creative ideas.


Special thanks and extra huggles to loved ones at the Builder's Project. :)


Neverwinter Nights is trademark of Wizards of the Coast, Inc. BioWare and BioWare Aurora Engine are trademarks of BioWare Corp. All other trademarks are the property of their respective owners. The author is not an employee of, or otherwise affiliated with, any of these organizations.
The moral rights of the author has been asserted. Comments and queries to gaoneng [at] yahoo [dot] com

2005 gaoneng