Custom Title and Icon Guide

POSTED: Sun Oct 21, 2012 12:53 am

Custom Title and Icon Guide

This post details the effects one can use in custom titles and icons as well as transfer information.

General Title Guidelines

  • Max one line per title. Your title can be as many words/characters as you'd like -- but your CSS styling has to make it so that the title does not stretch the board. E.g., "supercalifragilisticexpialidocious" is acceptable as a title, as long as your title's style makes it so that word does not stretch the board or break onto two lines.
  • Links are prohibited in custom titles (and similarly, custom icons)
  • Can't be edited/changed except where a change token is purchased
  • Can't be transferred from active characters except where a change token is purchased
  • Can be transferred from inactive characters (not edited)
  • Title and icon ORDER may be changed if the person is requesting another change to their title area

General Icon Guidelines

  • Icons need to be less than 27x27 pixels, including black+white outlines. Black + white outlines are highly preferred, but other alternatives (e.g., drop-shadow) are acceptable on case-by-case basis.
  • Transfer rules same as with titles: free transferring only from inactive/dead; transfer from active requires token; order shuffles permitted when adding new icons.
  • Custom icons can never be edited.

Allowed CSS Properties*

* Some titles may be restricted in the number of effects (e.g., some contest prizes specify "two CSS effects" or similar)
** Some titles may be limited in the number of colors (e.g., some contest prizes specify "two color fade" whereas others are "three color fades" etc.)

Examples

Color Fade: fiery skies
Code: Select all
<span style="color:#6C171A">F</span><span style="color:#75291B">i</span><span style="color:#7E3B1B">e</span><span style="color:#884D1C">r</span><span style="color:#915F1C">y</span><span style="color:#9A721D"> </span><span style="color:#A3841E">S</span><span style="color:#AC961E">k</span><span style="color:#B6A81F">i</span><span style="color:#BFBA1F">e</span><span style="color:#C8CC20">s</span>
Multiple Colors: Fiery Skies
Code: Select all
<span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span>
+font-style: Fiery Skies
Code: Select all
<span style="font-style:italic;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-variant: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-weight: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-size: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-family: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+letter-spacing: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif; letter-spacing:1px;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+word-spacing: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif; letter-spacing:1px; word-spacing:3px;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+text-shadow: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif; letter-spacing:1px; word-spacing:3px; text-shadow:#2D2D2D 1px 1px 2px;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+text-transform*: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif; letter-spacing:1px; word-spacing:3px; text-shadow:#2D2D2D 1px 1px 2px;  text-transform:uppercase;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
* negates font-variant:small-caps
+text-decoration: Fiery Skies
Code: Select all
<span style="font-style:italic; font-variant:small-caps; font-weight:bold;  font-size:14px; font-family:arial, helvetica, serif; letter-spacing:1px; word-spacing:3px; text-shadow:#2D2D2D 1px 1px 2px;  text-transform:uppercase; text-decoration:underline;"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
'Souls Assemblage
The Few, The Proud
User avatar
'Souls Assemblage
'Souls Assemblage

Talents