'Souls RPG

Full Version: Custom Title and Icon Guide
You're currently viewing a stripped down version of our content. View the full version with proper formatting.

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

  • Titles should be requested in HTML format.
    • You can use an online HTML editor to check your code.
  • 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 27x27 pixels or smaller, 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:
<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:
<span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span>
+font-style: Fiery Skies
Code:
<span style="font-style:italic"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-variant: Fiery Skies
Code:
<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:
<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:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+font-family: Fiery Skies
Code:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; font-family:arial, helvetica, serif"><span style="color:#6C171A">Fiery</span> <span style="color:#C8CC20">Skies</span></span>
+letter-spacing: Fiery Skies
Code:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; 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:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; 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:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; 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:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; 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:
<span style="font-style:italic; font-variant:small-caps; font-weight:bold; font-size:16px; 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>