***Aya's Guide to Post Colors.

{tl;dr version and useful links found at the bottom}

Raise your hand if you're sick of seeing the following colors in posts:
Black, Red, Yellow, Pink, Green, Orange, Purple, Blue, Beige, Brown, Teal, Navy, Maroon, and Lime Green.

I thought so. These fifteen "preset" colors if you will have the potential to look decent, in some instances. However, they can be boring and unoriginal if not applied well, not to mention blinding (as you can see, the blue, navy, black, and yellow are kind of painful to look at and difficult to read.) I strongly encourage you to veer away from these "dropdown colors."

But how to get a different set of colors for your posts? Ladies and gentlemen, if you've never seen them before, I'd like to present you with the hex code.

Hex codes are six-digit combinations of numbers 0-9 and letters A-F — think of it as having sixteen different one-digit numbers, if you can. These are put together in pairs (ie C6 + C7 + C9) written most commonly as #C6C7C9. The digits range from 0 (being the darkest, corresponding to black) to F (being the lightest, corresponding to white.) The arrangement of hex codes in two-digit pairs allow for manipulation of the RGB (Red-Green-Blue) color balance, or RRGGBB. RR is like a two-digit number controlling the amount of red in a color, GG controls the green in a color, and BB controls the blue in the same manner. #000000 is black, #FFFFFF is white, etc.

Of course, you don't really need to understand how hex codes work, so if that last paragraph went over your head, don't worry about it. As long as you have a good resource for colors, you don't need to worry about it. How, then, do we put Hex Codes into practical application? The same way you would as if it were any drop-down color; that is, treat the six-digit number (disregard the # sign) as if it were the name of the color.

returns as:
This is the color of the links off the Tribute Red and Silver skin.

returns as:
Hex codes are not case-sensitive.

returns as:
Pound (#) signs will fail!


You get the picture. Hex codes can be fantastic, when applied well. How then, do we go about applying them well?

Two words: Color scheming.

Before we delve into this, you must make an important decision: how many colors do you want? People have different preferences to this. Some people prefer all their text to be a single color and then bold their speech so it stands out, some use the base forum color and then use an accent color for the text. Many, however (and I include myself in this number) prefer to have a primary (posting) color and a secondary (speech/accent) color. It also may vary from character to character; some may need more than two colors (ie, schizophrenic characters, Dissociative Identity Disorder characters, etcetera)

This guide will be focused on scheming with two colors, as this is most common. There are two (or so) methods of selecting Very Attractive Colors: a) similar colors; b) complimentary colors.

In method A, colors should be selected that are similar to the point where they match, but are two different shades so that talking can be easily isolated.

{in-text examples: Semper uses tans nicely for Bear; Lulu has a nice use of blues for Sapphire; Ella's darker grey color goes pretty well with the site's baseline text color.}

If you've got a general idea of what color(s) you want, go ahead and skip to the next section. If you don't know what you're after, you can use one of the following methods:

1) Review your character and see if anything comes to you. Maybe they're a cheerful ball of sunshine (try mild yellow colors) or they're frigid and cold (try a greyish blue) or they've got an eye/hair color that is their standout feature (green eyes? red hair?)

If nothing comes to you after thinking of your character, consider their face claim, if they've got one.

2) Find a picture of the face claim you're using that you particularly like and pay a visit to This Generator. Plug in the image's url and see if you like the outcome.

You might also like to get a few colors laid out in front of you, just to see what you think:

3) This generator will give you five colors at a time and give you preview swatches of them, too. Run the generator a few times until you see something that fits or get a better idea of a color.

Hopefully by now you've got an idea of what color(s) you want to go for. If you do, a more basic (not necessarily my preferred method) is to scroll down This List of colors until you find two that look nice. They're sorted for the most part, and it's easy enough to find some nice looking colors in the same neighborhood. If this is enough to satisfy you, great. Go ahead and have at it.

If not, though, it's time to pull out the big guns: The Hues Hub at December.com. These lists are by far the best for selecting colors, better even than the named color list at The Hex Hub. This is because of the way it's formatted:

If you've already got the general idea of what color you're interested in, click on the corresponding column of the four listed. For this example, I'm going to create a yellow color scheme, simply because I've never used yellow before, and yellow can be a bit grating on the eyes if not done appropriately. I'll click on the far left column, which will give me charts that look like so:

This chart makes it astoundingly easy to tweak colors and pick good secondary colors that compliment the first nicely. As you can see by the annotations I've added to the chart in the below column, the colors are arranged by dullness to colorfulness (left to right) and blackness to whiteness (up and down)

Once you've settled on one color (I'm going to use #E6A819) you can move up a few squares, down a few squares, left or right a few squares, or any which way you'd like to get a nice speaking color (I'm going to try #D6B15C for the speaking color)

The next thing you have, have, have to do is test them! Make sure they're not blinding! Make sure they don't clash horribly! Make sure they're not too similar. Make sure they look nice! If you're going through all the effort, why would you not make a quick preview post to see? Just write a quick paragraph, or even copy one from somewhere randomly.

{text taken from NPR.org}
The Tea Party's core values of wanting to pay less in taxes and have a smaller government are broad themes, he says. But when factions start to try to funnel the group's energy, Beckstrom says that there will likely be less camaraderie.

Many in the Tea Party believe in its broad themes, Beckstrom says. "But the more you get down into the details, then you start getting into fighting lines, or debate lines. And so, it's going to be very interesting to watch this, to see how it develops.

"And I don't think this movement is going away for a while," he says. "It'll be with us for quite some years."

Now, I preview my post and... I don't really like it all that much. The colors are okay; none too blinding, not too dark. But I don't really like how similar the two are. I'm going to try a more drastic difference, setting my previous speech color as my text color and picking a new speech color. What do I do now? I just move away a few squares more.

This time, it's a little different. I'm writing my own sample paragraph because I don't really have much to say; I'm just tweaking. "I wonder if this color is going to be too bright. I think it might be too bright," mused Aya, worried (but not really) about her color selection this time. Fortunately, it looked pretty nice.

If the colors go well but something still seems off, try switching their places; put the secondary color as the base color and the base as the secondary. This gives your posts a whole new feel. It can even give your character a slightly different dynamic.

Often, more drastic differences in lightness/darkness will look cleaner, if they stand out more. A dark blue would be paired more neatly with a paler, grayer blue for example.

When using the Hues Hub, try to avoid the rightmost few columns for most colors, as they are simply too blindingly bright. Instead, stick to the middle and the left of the charts, where the colors are more grey. Personally, I think they look more sophisticated.

Another way to get a speaking color after you've got your base color (or vise versa) is to use a color schemer. Plug in the hex for your first number and it'll give you a few similar colors. Personally, I like Color Scheme Designer 3 the best, as it's got more options — it can help you select a similar secondary color, or one that it quite different yet still matches. However, it is slightly more advanced to use. If you want to give it a go, you can enter your own hex color by clicking on the oner that's already there (see the diagram below)

If you want to use this tool to get a completely different color for a secondary/primary color, click on the little wheels at the top that say "compliment, triad, tetrad, analogic, accented analogic" and see what looks good.

A more simpler color scheme tool is Infohound's color tool. It's fairly basic, but it generates nice results.

Sometimes, you might want to give a character a completely different color for their speech than they've got for their other text. I don't really have much to say on that, except it can be pulled off very nicely; just make sure the colors match. Try to match their grayness (if you're using the Hues Hub chart, pick two colors from the same column, even if they're on different pages altogether.) as best you can, and that should make them work even better.


If you're unsure as to whether or not a color is blinding, either ask someone or examine the hex number. Are there a lot of 0s, 3s, 6s, 9s, Cs, or Fs? This is not a surefire way to tell, but a lot of times, the trashier colors will have these numbers listed in pairs, ie #0000FF. Just get someone's opinion. If you can't find anyone to ask, PM me a sample and I'll let you know for sure.

This concludes my rant colors guide. I'll wrap things up with a TL;DR summary:

>Use the charts found here.
>Using two similar colors of different shades/hues looks very nice.
>Try to stick to the middle and leftmost columns of the above link.
>Colors with more gray mixed in look more sophisticated and are typically easier to read.
>Type in hex codes as you would any other color. (ie: [*color=10141A]Except without the asterisks[/color*]
>Do not blind the membership.

>Color palette from image tool
>Random colors generator
>List of Colors
>Other List of Colors
>Best List of Colors
>Best Color Scheme Tool
>Simplest Color Scheme Tool