+ Displaying a Set Icon
+
+ ss-zen
+
+
+
You can place Keyrune icons anywhere using the CSS classname prefix ss
(for set symbol) and then the set icon's code. Inline elements like <i>
and <span>
are preferred, but any can be used.
+
+ <i class="ss ss-zen"></i> ss-zen
+
+
+
+
+ Icon Sizes
+
+ ss-2x
+ ss-3x
+ ss-4x
+ ss-5x
+ ss-6x
+
+
+
To conveniently increase the size of a set symbol you can append the classes ss-2x
, ss-3x
, ss-4x
, ss-4x
, and ss-6x
. These classes increase the size by a factor equal to class name number.
+
+ <i class="ss ss-zen ss-2x"></i> ss-2x
+ <i class="ss ss-zen ss-3x"></i> ss-3x
+ <i class="ss ss-zen ss-4x"></i> ss-4x
+ <i class="ss ss-zen ss-5x"></i> ss-5x
+ <i class="ss ss-zen ss-6x"></i> ss-6x
+
+
+
+
+ Rarity Colors
+
+ ss-common
+ ss-uncommon
+ ss-rare
+ ss-mythic
+
+
+
You can add a rarity color to each set symbol by appending the classes ss-common
, ss-uncommon
, ss-rare
, and ss-mythic
.
+
+ <i class="ss ss-ons ss-common"></i> ss-common
+ <i class="ss ss-ons ss-uncommon"></i> ss-uncommon
+ <i class="ss ss-ons ss-rare"></i> ss-rare
+ <i class="ss ss-ons ss-mythic"></i> ss-mythic
+
+
+
+