andrew/keyrune
andrew/keyrune
1
0
Fork 0
mirror of https://github.com/andrewgioia/keyrune.git synced 2024-12-22 15:39:56 +00:00
Code Issues Projects Releases Wiki Activity
db2183cab6
keyrune/icons.html
Andrew Gioia db2183cab6 Pulling 3.1.7 and 3.1.8 for new promo icons
2018-01-08 10:23:55 -05:00

899 lines
70 KiB
HTML
Raw Blame History

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
<title>Set Symbol Icons | Keyrune</title>
<link rel="stylesheet" href="node_modules/keyrune/css/keyrune.min.css" />
<link rel="stylesheet" href="css/main.css" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
</head>
<body>
<div id="overlay"></div>
<section id="banner">
<div class="wrapper">
<a href="index.html" class="logo"><i class="ss ss-leg"></i> Keyrune</a>
<a href="index.html" class="item">Home</a>
<a href="icons.html" class="item">Set Icons</a>
<a href="examples.html" class="item">Examples</a>
<a href="http://github.com/andrewgioia/Keyrune" class="item">GitHub Project</a>
<span class="item">
<iframe src="https://ghbtns.com/github-btn.html?user=andrewgioia&repo=keyrune&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" style="margin-bottom: -4px;"></iframe>
</span>
<span class="item">
Created by
<a href="http://andrewgioia.com">Andrew Gioia</a>
</span>
</div>
</section>
<header>
<div class="wrapper">
<h1 class="sub">Set Symbol Icons</h1>
<a class="dl button float-right" href="https://github.com/andrewgioia/Keyrune/archive/master.zip">
<i class="ss ss-pmtg2"></i>
Download
</a>
<h2 class="sub">Complete 216 Magic set symbol font icons</h2>
</div>
</header>
<main>
<div class="wrapper">
<section>
<h3>
View the full list of 216 set and expansion symbols below, for all sets and special edition products up to <strong>Rivals of Ixalan</strong>. To use the symbols on your desktop or just get the vectors, check out the <a href="cheatsheet.html">Cheatsheet</a>.
</h3>
<p style="margin: -15px 0 25px;">
<strong>Note:</strong> you can now link directly to a preview of each symbol's by adding the symbol code at the end of the url like this: <a href="https://andrewgioia.github.io/Keyrune/icons.html?icon=ody">https://andrewgioia.github.io/Keyrune/icons.html?icon=ody</a>.
</p>
</section>
<section class="content">
<h4>Core Sets</h4>
<div class="icons">
<div class="icon" id="lea" name="Alpha" data-name="Alpha" data-class="lea" data-unicode="e600" data-added="v0.1.0">
<span class="name"><i class="ss ss-lea"></i> Alpha <em>(lea)</em></span>
</div>
<div class="icon" id="leb" name="Beta" data-name="Beta" data-class="leb" data-unicode="e601" data-added="v0.1.0">
<span class="name"><i class="ss ss-leb"></i> Beta <em>(leb)</em></span>
</div>
<div class="icon" id="2ed" name="Unlimited" data-name="Unlimited" data-class="2ed" data-unicode="e602" data-added="v0.1.0">
<span class="name"><i class="ss ss-2ed"></i> Unlimited <em>(2ed)</em></span>
</div>
<div class="icon" id="3ed" name="Revised" data-name="Revised" data-class="3ed" data-unicode="e603" data-added="v0.1.0">
<span class="name"><i class="ss ss-3ed"></i> Revised <em>(3ed)</em></span>
</div>
<div class="icon" id="4ed" name="Fourth Edition" data-name="Fourth Edition" data-class="4ed" data-unicode="e604" data-added="v0.1.0">
<span class="name"><i class="ss ss-4ed"></i> Fourth Edition <em>(4ed)</em></span>
</div>
<div class="icon" id="psum" name="Summer Magic" data-name="Summer Magic" data-class="psum" data-unicode="e605" data-added="v0.1.0">
<span class="name"><i class="ss ss-psum"></i> Summer Magic <em>(psum)</em></span>
</div>
<div class="icon" id="5ed" name="Fifth Edition" data-name="Fifth Edition" data-class="5ed" data-unicode="e606" data-added="v0.1.0">
<span class="name"><i class="ss ss-5ed"></i> Fifth Edition <em>(5ed)</em></span>
</div>
<div class="icon" id="6ed" name="Sixth Edition" data-name="Sixth Edition" data-class="6ed" data-unicode="e607" data-added="v0.1.0">
<span class="name"><i class="ss ss-6ed"></i> Sixth Edition <em>(6ed)</em></span>
</div>
<div class="icon" id="7ed" name="Seventh Edition" data-name="Seventh Edition" data-class="7ed" data-unicode="e608" data-added="v0.1.0">
<span class="name"><i class="ss ss-7ed"></i> Seventh Edition <em>(7ed)</em></span>
</div>
<div class="icon" id="8ed" name="Eighth Edition" data-name="Eighth Edition" data-class="8ed" data-unicode="e609" data-added="v0.1.0">
<span class="name"><i class="ss ss-8ed"></i> Eighth Edition <em>(8ed)</em></span>
</div>
<div class="icon" id="9ed" name="Ninth Edition" data-name="Ninth Edition" data-class="9ed" data-unicode="e60a" data-added="v0.1.0">
<span class="name"><i class="ss ss-9ed"></i> Ninth Edition <em>(9ed)</em></span>
</div>
<div class="icon" id="10e" name="Tenth Edition" data-name="Tenth Edition" data-class="10e" data-unicode="e60b" data-added="v0.1.0">
<span class="name"><i class="ss ss-10e"></i> Tenth Edition <em>(10e)</em></span>
</div>
<div class="icon" id="m10" name="Magic 2010" data-name="Magic 2010" data-class="m10" data-unicode="e60c" data-added="v0.1.0">
<span class="name"><i class="ss ss-m10"></i> Magic 2010 <em>(m10)</em></span>
</div>
<div class="icon" id="m11" name="Magic 2011" data-name="Magic 2011" data-class="m11" data-unicode="e60d" data-added="v0.1.0">
<span class="name"><i class="ss ss-m11"></i> Magic 2011 <em>(m11)</em></span>
</div>
<div class="icon" id="m12" name="Magic 2012" data-name="Magic 2012" data-class="m12" data-unicode="e60e" data-added="v0.1.0">
<span class="name"><i class="ss ss-m12"></i> Magic 2012 <em>(m12)</em></span>
</div>
<div class="icon" id="m13" name="Magic 2013" data-name="Magic 2013" data-class="m13" data-unicode="e60f" data-added="v0.1.0">
<span class="name"><i class="ss ss-m13"></i> Magic 2013 <em>(m13)</em></span>
</div>
<div class="icon" id="m14" name="Magic 2014" data-name="Magic 2014" data-class="m14" data-unicode="e610" data-added="v0.1.0">
<span class="name"><i class="ss ss-m14"></i> Magic 2014 <em>(m14)</em></span>
</div>
<div class="icon" id="m15" name="Magic 2015" data-name="Magic 2010" data-class="m10" data-unicode="e611" data-added="v0.1.0">
<span class="name"><i class="ss ss-m15"></i> Magic 2015 <em>(m15)</em></span>
</div>
<div class="icon" id="bcore" name="Blank Core Set" data-name="Blank Core Set" data-class="bcore" data-unicode="e612" data-added="v0.1.0">
<span class="name"><i class="ss ss-bcore"></i> Blank Core Set <em>(bcore)</em></span>
</div>
<div class="icon" id="ori" name="Magic Origins" data-name="Magic Origins" data-class="ori" data-unicode="e697" data-added="v1.3.0">
<span class="name"><i class="ss ss-ori"></i> Magic Origins <em>(ori)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Expansion Sets</h4>
<div class="icons">
<div class="icon" id="arn" name="Arabian Nights" data-name="Arabian Nights" data-class="arn" data-unicode="e613" data-added="v0.1.0">
<span class="name"><i class="ss ss-arn"></i> Arabian Nights <em>(arn)</em></span>
</div>
<div class="icon" id="atq" name="Antiquities" data-name="Antiquities" data-class="atq" data-unicode="e614" data-added="v0.1.0">
<span class="name"><i class="ss ss-atq"></i> Antiquities <em>(atq)</em></span>
</div>
<div class="icon" id="leg" name="Legends" data-name="Legends" data-class="leg" data-unicode="e615" data-added="v0.1.0">
<span class="name"><i class="ss ss-leg"></i> Legends <em>(leg)</em></span>
</div>
<div class="icon" id="drk" name="The Dark" data-name="The Dark" data-class="drk" data-unicode="e616" data-added="v0.1.0">
<span class="name"><i class="ss ss-drk"></i> The Dark <em>(drk)</em></span>
</div>
<div class="icon" id="fem" name="Fallen Empires" data-name="Fallen Empires" data-class="fem" data-unicode="e617" data-added="v0.1.0">
<span class="name"><i class="ss ss-fem"></i> Fallen Empires <em>(fem)</em></span>
</div>
<div class="icon" id="hml" name="Homelands" data-name="Homelands" data-class="hml" data-unicode="e618" data-added="v0.1.0">
<span class="name"><i class="ss ss-hml"></i> Homelands <em>(hml)</em></span>
</div>
<div class="icon" id="ice" name="Ice Age" data-name="Ice Age" data-class="ice" data-unicode="e619" data-added="v0.1.0">
<span class="name"><i class="ss ss-ice"></i> Ice Age <em>(ice)</em></span>
</div>
<div class="icon" id="ice2" name="Ice Age (Original)" data-name="Ice Ag (Original)" data-class="ice2" data-unicode="e925" data-added="v3.0.0">
<span class="name"><i class="ss ss-ice2"></i> Ice Age (Original) <em>(ice2)</em></span>
</div>
<div class="icon" id="all" name="Alliances" data-name="Alliances" data-class="all" data-unicode="e61a" data-added="v0.1.0">
<span class="name"><i class="ss ss-all"></i> Alliances <em>(all)</em></span>
</div>
<div class="icon" id="csp" name="Coldsnap" data-name="Coldsnap" data-class="csp" data-unicode="e61b" data-added="v0.1.0">
<span class="name"><i class="ss ss-csp"></i> Coldsnap <em>(csp)</em></span>
</div>
<div class="icon" id="mir" name="Mirage" data-name="Mirage" data-class="mir" data-unicode="e61c" data-added="v0.1.0">
<span class="name"><i class="ss ss-mir"></i> Mirage <em>(mir)</em></span>
</div>
<div class="icon" id="vis" name="Visions" data-name="Visions" data-class="vis" data-unicode="e61d" data-added="v0.1.0">
<span class="name"><i class="ss ss-vis"></i> Visions <em>(vis)</em></span>
</div>
<div class="icon" id="wth" name="Weatherlight" data-name="Weatherlight" data-class="wth" data-unicode="e61e" data-added="v0.1.0">
<span class="name"><i class="ss ss-wth"></i> Weatherlight <em>(wth)</em></span>
</div>
<div class="icon" id="tmp" name="Tempest" data-name="Tempest" data-class="tmp" data-unicode="e61f" data-added="v0.1.0">
<span class="name"><i class="ss ss-tmp"></i> Tempest <em>(tmp)</em></span>
</div>
<div class="icon" id="sth" name="Stronghold" data-name="Stronghold" data-class="sth" data-unicode="e620" data-added="v0.1.0">
<span class="name"><i class="ss ss-sth"></i> Stronghold <em>(sth)</em></span>
</div>
<div class="icon" id="exo" name="Exodus" data-name="Exodus" data-class="exo" data-unicode="e621" data-added="v0.1.0">
<span class="name"><i class="ss ss-exo"></i> Exodus <em>(exo)</em></span>
</div>
<div class="icon" id="usg" name="Urza's Saga" data-name="Urza's Saga" data-class="usg" data-unicode="e622" data-added="v0.1.0">
<span class="name"><i class="ss ss-usg"></i> Urza's Saga <em>(usg)</em></span>
</div>
<div class="icon" id="ulg" name="Urza's Legacy" data-name="Urza's Legacy" data-class="ulg" data-unicode="e623" data-added="v0.1.0">
<span class="name"><i class="ss ss-ulg"></i> Urza's Legacy <em>(ulg)</em></span>
</div>
<div class="icon" id="uds" name="Urza's Destiny" data-name="Urza's Destiny" data-class="uds" data-unicode="e624" data-added="v0.1.0">
<span class="name"><i class="ss ss-uds"></i> Urza's Destiny <em>(uds)</em></span>
</div>
<div class="icon" id="mmq" name="Mercadian Masques" data-name="Mercadian Masques" data-class="mmq" data-unicode="e625" data-added="v0.1.0">
<span class="name"><i class="ss ss-mmq"></i> Mercadian Masques <em>(mmq)</em></span>
</div>
<div class="icon" id="nem" name="Nemesis" data-name="Nemesis" data-class="nem" data-unicode="e626" data-added="v0.1.0">
<span class="name"><i class="ss ss-nem"></i> Nemesis <em>(nem)</em></span>
</div>
<div class="icon" id="pcy" name="Prophecy" data-name="Prophecy" data-class="pcy" data-unicode="e627" data-added="v0.1.0">
<span class="name"><i class="ss ss-pcy"></i> Prophecy <em>(pcy)</em></span>
</div>
<div class="icon" id="inv" name="Invasion" data-name="Invasion" data-class="inv" data-unicode="e628" data-added="v0.1.0">
<span class="name"><i class="ss ss-inv"></i> Invasion <em>(inv)</em></span>
</div>
<div class="icon" id="pls" name="Planeshift" data-name="Planeshift" data-class="pls" data-unicode="e629" data-added="v0.1.0">
<span class="name"><i class="ss ss-pls"></i> Planeshift <em>(pls)</em></span>
</div>
<div class="icon" id="apc" name="Apocalypse" data-name="Apocalypse" data-class="apc" data-unicode="e62a" data-added="v0.1.0">
<span class="name"><i class="ss ss-apc"></i> Apocalypse <em>(apc)</em></span>
</div>
<div class="icon" id="ody" name="Odyssey" data-name="Odyssey" data-class="ody" data-unicode="e62b" data-added="v0.1.0">
<span class="name"><i class="ss ss-ody"></i> Odyssey <em>(ody)</em></span>
</div>
<div class="icon" id="tor" name="Torment" data-name="Torment" data-class="tor" data-unicode="e62c" data-added="v0.1.0">
<span class="name"><i class="ss ss-tor"></i> Torment <em>(tor)</em></span>
</div>
<div class="icon" id="jud" name="Judgement" data-name="Judgement" data-class="jud" data-unicode="e62d" data-added="v0.1.0">
<span class="name"><i class="ss ss-jud"></i> Judgement <em>(jud)</em></span>
</div>
<div class="icon" id="ons" name="Onslaught" data-name="Onslaught" data-class="ons" data-unicode="e62e" data-added="v0.1.0">
<span class="name"><i class="ss ss-ons"></i> Onslaught <em>(ons)</em></span>
</div>
<div class="icon" id="lgn" name="Legions" data-name="Legions" data-class="lgn" data-unicode="e62f" data-added="v0.1.0">
<span class="name"><i class="ss ss-lgn"></i> Legions <em>(lgn)</em></span>
</div>
<div class="icon" id="scg" name="Scourge" data-name="Scourge" data-class="scg" data-unicode="e630" data-added="v0.1.0">
<span class="name"><i class="ss ss-scg"></i> Scourge <em>(scg)</em></span>
</div>
<div class="icon" id="mrd" name="Mirrodin" data-name="Mirrodin" data-class="mrd" data-unicode="e631" data-added="v0.1.0">
<span class="name"><i class="ss ss-mrd"></i> Mirrodin <em>(mrd)</em></span>
</div>
<div class="icon" id="dst" name="Darksteel" data-name="Darksteel" data-class="dst" data-unicode="e632" data-added="v0.1.0">
<span class="name"><i class="ss ss-dst"></i> Darksteel <em>(dst)</em></span>
</div>
<div class="icon" id="5dn" name="Fifth Dawn" data-name="Fifth Dawn" data-class="5dn" data-unicode="e633" data-added="v0.1.0">
<span class="name"><i class="ss ss-5dn"></i> Fifth Dawn <em>(5dn)</em></span>
</div>
<div class="icon" id="chk" name="Champions of Kamigawa" data-name="Champions of Kamigawa" data-class="chk" data-unicode="e634" data-added="v0.1.0">
<span class="name"><i class="ss ss-chk"></i> Champions of Kamigawa <em>(chk)</em></span>
</div>
<div class="icon" id="bok" name="Betrayers of Kamigawa" data-name="Betrayers of Kamigawa" data-class="bok" data-unicode="e635" data-added="v0.1.0">
<span class="name"><i class="ss ss-bok"></i> Betrayers of Kamigawa <em>(bok)</em></span>
</div>
<div class="icon" id="sok" name="Saviors of Kamigawa" data-name="Saviors of Kamigawa" data-class="sok" data-unicode="e636" data-added="v0.1.0">
<span class="name"><i class="ss ss-sok"></i> Saviors of Kamigawa <em>(sok)</em></span>
</div>
<div class="icon" id="rav" name="Ravnica" data-name="Ravnica" data-class="rav" data-unicode="e637" data-added="v0.1.0">
<span class="name"><i class="ss ss-rav"></i> Ravnica <em>(rav)</em></span>
</div>
<div class="icon" id="gpt" name="Guildpact" data-name="Guildpact" data-class="gpt" data-unicode="e638" data-added="v0.1.0">
<span class="name"><i class="ss ss-gpt"></i> Guildpact <em>(gpt)</em></span>
</div>
<div class="icon" id="dis" name="Dissension" data-name="Dissension" data-class="dis" data-unicode="e639" data-added="v0.1.0">
<span class="name"><i class="ss ss-dis"></i> Dissension <em>(dis)</em></span>
</div>
<div class="icon" id="tsp" name="Time Spiral" data-name="Time Spiral" data-class="tsp" data-unicode="e63a" data-added="v0.1.0">
<span class="name"><i class="ss ss-tsp"></i> Time Spiral <em>(tsp)</em></span>
</div>
<div class="icon" id="plc" name="Planar Chaos" data-name="Planar Chaos" data-class="plc" data-unicode="e63b" data-added="v0.1.0">
<span class="name"><i class="ss ss-plc"></i> Planar Chaos <em>(plc)</em></span>
</div>
<div class="icon" id="fut" name="Future Sight" data-name="Future Sight" data-class="fut" data-unicode="e63c" data-added="v0.1.0">
<span class="name"><i class="ss ss-fut"></i> Future Sight <em>(fut)</em></span>
</div>
<div class="icon" id="lrw" name="Lorwyn" data-name="Lorwyn" data-class="lrw" data-unicode="e63d" data-added="v0.1.0">
<span class="name"><i class="ss ss-lrw"></i> Lorwyn <em>(lrw)</em></span>
</div>
<div class="icon" id="mor" name="Morningtide" data-name="Morningtide" data-class="mor" data-unicode="e63e" data-added="v0.1.0">
<span class="name"><i class="ss ss-mor"></i> Morningtide <em>(mor)</em></span>
</div>
<div class="icon" id="shm" name="Shadowmore" data-name="Shadowmore" data-class="shm" data-unicode="e63f" data-added="v0.1.0">
<span class="name"><i class="ss ss-shm"></i> Shadowmore <em>(shm)</em></span>
</div>
<div class="icon" id="eve" name="Eventide" data-name="Eventide" data-class="eve" data-unicode="e640" data-added="v0.1.0">
<span class="name"><i class="ss ss-eve"></i> Eventide <em>(eve)</em></span>
</div>
<div class="icon" id="ala" name="Shards of Alara" data-name="Shards of Alara" data-class="ala" data-unicode="e641" data-added="v0.1.0">
<span class="name"><i class="ss ss-ala"></i> Shards of Alara <em>(ala)</em></span>
</div>
<div class="icon" id="con" name="Conflux" data-name="Conflux" data-class="con" data-unicode="e642" data-added="v0.1.0">
<span class="name"><i class="ss ss-con"></i> Conflux <em>(con)</em></span>
</div>
<div class="icon" id="arb" name="Alara Reborn" data-name="Alara Reborn" data-class="arb" data-unicode="e643" data-added="v0.1.0">
<span class="name"><i class="ss ss-arb"></i> Alara Reborn <em>(arb)</em></span>
</div>
<div class="icon" id="zen" name="Zendikar" data-name="Zendikar" data-class="zen" data-unicode="e644" data-added="v0.1.0">
<span class="name"><i class="ss ss-zen"></i> Zendikar <em>(zen)</em></span>
</div>
<div class="icon" id="wwk" name="Worldwake" data-name="Worldwake" data-class="wwk" data-unicode="e645" data-added="v0.1.0">
<span class="name"><i class="ss ss-wwk"></i> Worldwake <em>(wwk)</em></span>
</div>
<div class="icon" id="roe" name="Rise of the Eldrazi" data-name="Rise of the Eldrazi" data-class="roe" data-unicode="e646" data-added="v0.1.0">
<span class="name"><i class="ss ss-roe"></i> Rise of the Eldrazi <em>(roe)</em></span>
</div>
<div class="icon" id="som" name="Scars of Mirrodin" data-name="Scars of Mirrodin" data-class="som" data-unicode="e647" data-added="v0.1.0">
<span class="name"><i class="ss ss-som"></i> Scars of Mirrodin <em>(som)</em></span>
</div>
<div class="icon" id="mbs" name="Mirrodin Besieged" data-name="Mirrodin Besieged" data-class="mbs" data-unicode="e648" data-added="v0.1.0">
<span class="name"><i class="ss ss-mbs"></i> Mirrodin Besieged <em>(mbs)</em></span>
</div>
<div class="icon" id="nph" name="New Phyrexia" data-name="New Phyrexia" data-class="nph" data-unicode="e649" data-added="v0.1.0">
<span class="name"><i class="ss ss-nph"></i> New Phyrexia <em>(nph)</em></span>
</div>
<div class="icon" id="isd" name="Innistrad" data-name="Innistrad" data-class="isd" data-unicode="e64a" data-added="v0.1.0">
<span class="name"><i class="ss ss-isd"></i> Innistrad <em>(isd)</em></span>
</div>
<div class="icon" id="dka" name="Dark Ascension" data-name="Dark Ascension" data-class="dka" data-unicode="e64b" data-added="v0.1.0">
<span class="name"><i class="ss ss-dka"></i> Dark Ascension <em>(dka)</em></span>
</div>
<div class="icon" id="avr" name="Avacyn Restored" data-name="Avacyn Restored" data-class="avr" data-unicode="e64c" data-added="v0.1.0">
<span class="name"><i class="ss ss-avr"></i> Avacyn Restored <em>(avr)</em></span>
</div>
<div class="icon" id="rtr" name="Return to Ravnica" data-name="Return to Ravnica" data-class="rtr" data-unicode="e64d" data-added="v0.1.0">
<span class="name"><i class="ss ss-rtr"></i> Return to Ravnica <em>(rtr)</em></span>
</div>
<div class="icon" id="gtc" name="Gatecrash" data-name="Gatecrash" data-class="gtc" data-unicode="e64e" data-added="v0.1.0">
<span class="name"><i class="ss ss-gtc"></i> Gatecrash <em>(gtc)</em></span>
</div>
<div class="icon" id="dgm" name="Dragon's Maze" data-name="Dragon's Maze" data-class="dgm" data-unicode="e64f" data-added="v0.1.0">
<span class="name"><i class="ss ss-dgm"></i> Dragon's Maze <em>(dgm)</em></span>
</div>
<div class="icon" id="ths" name="Theros" data-name="Theros" data-class="ths" data-unicode="e650" data-added="v0.1.0">
<span class="name"><i class="ss ss-ths"></i> Theros <em>(ths)</em></span>
</div>
<div class="icon" id="bng" name="Born of the Gods" data-name="Born of the Gods" data-class="bng" data-unicode="e651" data-added="v0.1.0">
<span class="name"><i class="ss ss-bng"></i> Born of the Gods <em>(bng)</em></span>
</div>
<div class="icon" id="jou" name="Journey into Nyx" data-name="Journey into Nix" data-class="jou" data-unicode="e652" data-added="v0.1.0">
<span class="name"><i class="ss ss-jou"></i> Journey into Nyx <em>(jou)</em></span>
</div>
<div class="icon" id="ktk" name="Khans of Tarkir" data-name="Khans of Tarkir" data-class="ktk" data-unicode="e653" data-added="v0.1.0">
<span class="name"><i class="ss ss-ktk"></i> Khans of Tarkir <em>(ktk)</em></span>
</div>
<div class="icon" id="frf" name="Fate Reforged" data-name="Fate Reforged" data-class="frf" data-unicode="e654" data-added="v0.1.0">
<span class="name"><i class="ss ss-frf"></i> Fate Reforged <em>(frf)</em></span>
</div>
<div class="icon" id="dtk" name="Dragons of Tarkir" name="Unhinged" data-name="Dragons of Tarkir" data-class="dtk" data-unicode="e693" data-added="v1.0.0">
<span class="name"><i class="ss ss-dtk"></i> Dragons of Tarkir <em>(dtk)</em></span>
</div>
<div class="icon" id="bfz" name="Battle for Zendikar" data-name="Battle for Zendikar" data-class="bfz" data-unicode="e699" data-added="v1.4.0">
<span class="name"><i class="ss ss-bfz"></i> Battle for Zendikar <em>(bfz)</em></span>
</div>
<div class="icon" id="ogw" name="Oath of the Gatewatch" data-name="Oath of the Gatewatch" data-class="ogw" data-unicode="e901" data-added="v1.5.0">
<span class="name"><i class="ss ss-ogw"></i> Oath of the Gatewatch <em>(ogw)</em></span>
</div>
<div class="icon" id="soi" name="Shadows Over Innistrad" data-name="Shadows Over Innistrad" data-class="soi" data-unicode="e902" data-added="v1.5.0">
<span class="name"><i class="ss ss-soi"></i> Shadows Over Innistrad <em>(soi)</em></span>
</div>
<div class="icon" id="emn" name="Eldritch Moon" data-name="Eldritch Moon" data-class="emn" data-unicode="e90b" data-added="v1.6.0">
<span class="name"><i class="ss ss-emn"></i> Eldritch Moon <em>(emn)</em></span>
</div>
<div class="icon" id="kld" name="Kaladesh" data-name="Kaladesh" data-class="kld" data-unicode="e90e" data-added="v1.7.0">
<span class="name"><i class="ss ss-kld"></i> Kaladesh <em>(kld)</em></span>
</div>
<div class="icon" id="aer" name="Aether Revolt" data-name="Aether Revolt" data-class="aer" data-unicode="e90f" data-added="v1.7.0">
<span class="name"><i class="ss ss-aer"></i> Aether Revolt <em>(aer)</em></span>
</div>
<div class="icon" id="akh" name="Amonkhet" data-name="Amonkhet" data-class="akh" data-unicode="e914" data-added="v1.8.0">
<span class="name"><i class="ss ss-akh"></i> Amonkhet <em>(akh)</em></span>
</div>
<div class="icon" id="hou" name="Hour of Devastation" data-name="Hour of Devastation" data-class="hou" data-unicode="e924" data-added="v2.3.0">
<span class="name"><i class="ss ss-hou"></i> Hour of Devastation <em>(hou)</em></span>
</div>
<div class="icon" id="xln" name="Ixalan" data-name="Ixalan" data-class="xln" data-unicode="e92e" data-added="v3.1.0">
<span class="name"><i class="ss ss-xln"></i> Ixalan <em>(xln)</em></span>
</div>
<div class="icon" id="rix" name="Rivals of Ixalan" data-name="Rivals of Ixalan" data-class="rix" data-unicode="e92f" data-added="v3.1.0">
<span class="name"><i class="ss ss-rix"></i> Rivals of Ixalan <em>(rix)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Command Zone Sets</h4>
<div class="icons">
<div class="icon" id="van" name="Vanguard" data-name="Vanguard" data-class="van" data-unicode="e655" data-added="v0.1.0">
<span class="name"><i class="ss ss-van"></i> Vanguard <em>(van)</em></span>
</div>
<div class="icon" id="hop" name="Planechase" data-name="Planechase" data-class="hop" data-unicode="e656" data-added="v0.1.0">
<span class="name"><i class="ss ss-hop"></i> Planechase <em>(hop)</em></span>
</div>
<div class="icon" id="arc" name="Archenemy" data-name="Archenemy" data-class="arc" data-unicode="e657" data-added="v0.1.0">
<span class="name"><i class="ss ss-arc"></i> Archenemy <em>(arc)</em></span>
</div>
<div class="icon" id="cmd" name="Commander" data-name="Commander" data-class="cmd" data-unicode="e658" data-added="v0.1.0">
<span class="name"><i class="ss ss-cmd"></i> Commander <em>(cmd)</em></span>
</div>
<div class="icon" id="pc2" name="Planechase 2012" data-name="Planechase 2012" data-class="pc2" data-unicode="e659" data-added="v0.1.0">
<span class="name"><i class="ss ss-pc2"></i> Planechase 2012 <em>(pc2)</em></span>
</div>
<div class="icon" id="cm1" name="Commander's Arsenal" data-name="Commander's Arsenal" data-class="cm1" data-unicode="e65a" data-added="v0.1.0">
<span class="name"><i class="ss ss-cm1"></i> Commander's Arsenal <em>(cm1)</em></span>
</div>
<div class="icon" id="c13" name="Commander 2013" data-name="Commander 2013" data-class="c13" data-unicode="e65b" data-added="v0.1.0">
<span class="name"><i class="ss ss-c13"></i> Commander 2013 <em>(c13)</em></span>
</div>
<div class="icon" id="cns" name="Conspiracy" data-name="Conspiracy" data-class="cns" data-unicode="e65c" data-added="v0.1.0">
<span class="name"><i class="ss ss-cns"></i> Conspiracy <em>(cns)</em></span>
</div>
<div class="icon" id="c14" name="Commander 2014" data-name="Commander 2014" data-class="c14" data-unicode="e65d" data-added="v0.1.0">
<span class="name"><i class="ss ss-c14"></i> Commander 2014 <em>(c14)</em></span>
</div>
<div class="icon" id="c15" name="Commander 2015" data-name="Commander 2015" data-class="c15" data-unicode="e900" data-added="v1.4.2">
<span class="name"><i class="ss ss-c15"></i> Commander 2015 <em>(c15)</em></span>
</div>
<div class="icon" id="cn2" name="Conspiracy 2: Take the Crown" data-name="Conspiracy 2: Take the Crown" data-class="cn2" data-unicode="e904" data-added="v1.5.2">
<span class="name"><i class="ss ss-cn2"></i> Conspiracy 2: Take the Crown <em>(cn2)</em></span>
</div>
<div class="icon" id="c16" name="Commander 2016" data-name="Commander 2016" data-class="c16" data-unicode="e910" data-added="v1.7.0">
<span class="name"><i class="ss ss-c16"></i> Commander 2016 <em>(c16)</em></span>
</div>
<div class="icon" id="pca" name="Planechase Anthology" data-name="Planechase Anthology" data-class="pca" data-unicode="e911" data-added="v1.7.0">
<span class="name"><i class="ss ss-pca"></i> Planechase Anthology <em>(pca)</em></span>
</div>
<div class="icon" id="cma" name="Commander Anthology" data-name="Commander Anthology" data-class="cma" data-unicode="e916" data-added="v2.1.1">
<span class="name"><i class="ss ss-cma"></i> Commander Anthology <em>(cma)</em></span>
</div>
<div class="icon" id="e01" name="Archenemy: Nicol Bolas" data-name="Archenemy: Nicol Bolas" data-class="e01" data-unicode="e92d" data-added="v3.0.3">
<span class="name"><i class="ss ss-e01"></i> Archenemy: Nicol Bolas <em>(e01)</em></span>
</div>
<div class="icon" id="e02" name="Explorers of Ixalan" data-name="Explorers of Ixalan" data-class="e02" data-unicode="e931" data-added="v3.1.0">
<span class="name"><i class="ss ss-e02"></i> Explorers of Ixalan <em>(e02)</em></span>
</div>
<div class="icon" id="c17" name="Commander 2017" data-name="Commander 2017" data-class="c17" data-unicode="e934" data-added="v3.1.4">
<span class="name"><i class="ss ss-c17"></i> Commander 2017 <em>(c17)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Reprint Sets</h4>
<div class="icons">
<div class="icon" id="chr" name="Chronicles" data-name="Chronicles" data-class="chr" data-unicode="e65e" data-added="v0.1.0">
<span class="name"><i class="ss ss-chr"></i> Chronicles <em>(chr)</em></span>
</div>
<div class="icon" id="ath" name="Anthologies" data-name="Anthologies" data-class="ath" data-unicode="e65f" data-added="v0.1.0">
<span class="name"><i class="ss ss-ath"></i> Anthologies <em>(ath)</em></span>
</div>
<div class="icon" id="brb" name="Battle Royale" data-name="Battle Royale" data-class="brb" data-unicode="e660" data-added="v0.1.0">
<span class="name"><i class="ss ss-brb"></i> Battle Royale <em>(brb)</em></span>
</div>
<div class="icon" id="btd" name="Beatdown" data-name="Beatdown" data-class="btd" data-unicode="e661" data-added="v0.1.0">
<span class="name"><i class="ss ss-btd"></i> Beatdown <em>(btd)</em></span>
</div>
<div class="icon" id="dkm" name="Deckmasters" data-name="Deckmasters" data-class="dkm" data-unicode="e662" data-added="v0.1.0">
<span class="name"><i class="ss ss-dkm"></i> Deckmasters <em>(dkm)</em></span>
</div>
<div class="icon" id="mma" name="Modern Masters" data-name="Modern Masters" data-class="mma" data-unicode="e663" data-added="v0.1.0">
<span class="name"><i class="ss ss-mma"></i> Modern Masters <em>(mma)</em></span>
</div>
<div class="icon" id="mm2" name="Modern Masters 2015" data-name="Modern Masters 2015" data-class="mm2" data-unicode="e695" data-added="v1.0.2">
<span class="name"><i class="ss ss-mm2"></i> Modern Masters 2015 <em>(mm2)</em></span>
</div>
<div class="icon" id="ema" name="Eternal Masters" data-name="Eternal Masters" data-class="ema" data-unicode="e903" data-added="v1.5.1">
<span class="name"><i class="ss ss-ema"></i> Eternal Masters <em>(ema)</em></span>
</div>
<div class="icon" id="mm3" name="Modern Masters 2017" data-name="Modern Masters 2017" data-class="mm3" data-unicode="e912" data-added="v1.7.0">
<span class="name"><i class="ss ss-mm3"></i> Modern Masters 2017 <em>(mm3)</em></span>
</div>
<div class="icon" id="xren" name="Renaissance" data-name="Renaissance" data-class="xren" data-unicode="e917" data-added="v2.1.0">
<span class="name"><i class="ss ss-xren"></i> Renaissance <em>(xren)</em></span>
</div>
<div class="icon" id="xrin" name="Rinascimento" data-name="Rinascimento" data-class="xrin" data-unicode="e918" data-added="v2.1.0">
<span class="name"><i class="ss ss-xrin"></i> Rinascimento <em>(xrin)</em></span>
</div>
<div class="icon" id="ima" name="Iconic Masters" data-name="Iconic Masters" data-class="ima" data-unicode="e935" data-added="v3.1.4">
<span class="name"><i class="ss ss-ima"></i> Iconic Masters <em>(ima)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Beginner Sets</h4>
<div class="icons">
<div class="icon" id="por" name="Portal" data-name="Portal" data-class="por" data-unicode="e664" data-added="v0.1.0">
<span class="name"><i class="ss ss-por"></i> Portal <em>(por)</em></span>
</div>
<div class="icon" id="p02" name="Portal 2" data-name="Portal 2" data-class="p02" data-unicode="e665" data-added="v0.1.0">
<span class="name"><i class="ss ss-p02"></i> Portal 2 <em>(p02)</em></span>
</div>
<div class="icon" id="ptk" name="Portal Three Kingdoms" data-name="Portal Three Kingdoms" data-class="ptk" data-unicode="e666" data-added="v0.1.0">
<span class="name"><i class="ss ss-ptk"></i> Portal Three Kingdoms <em>(ptk)</em></span>
</div>
<div class="icon" id="s99" name="Starter 1999" data-name="Starter 1999" data-class="s99" data-unicode="e667" data-added="v0.1.0">
<span class="name"><i class="ss ss-s99"></i> Starter 1999 <em>(s99)</em></span>
</div>
<div class="icon" id="s00" name="Starter 2000" data-name="Starter 2000" data-class="s00" data-unicode="e668" data-added="v0.1.0">
<span class="name"><i class="ss ss-s00"></i> Starter 2000 <em>(s00)</em></span>
</div>
<div class="icon" id="w16" name="Welcome Deck 2016" data-name="Welcome Deck 2016" data-class="w16" data-unicode="e907" data-added="v1.5.4">
<span class="name"><i class="ss ss-w16"></i> Welcome Deck 2016 <em>(w16)</em></span>
</div>
<div class="icon" id="w17" name="Welcome Deck 2017" data-name="Welcome Deck 2017" data-class="w17" data-unicode="e923" data-added="v2.2.3">
<span class="name"><i class="ss ss-w17"></i> Welcome Deck 2017 <em>(w17)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Duel Decks</h4>
<div class="icons">
<div class="icon" id="evg" name="Elves v. Goblins" data-name="Elves v. Goblins" data-class="evg" data-unicode="e669" data-added="v0.1.0">
<span class="name"><i class="ss ss-evg"></i> Elves v. Goblins <em>(evg)</em></span>
</div>
<div class="icon" id="dd2" name="Jace v. Chandra" data-name="Jace v. Chandra" data-class="dd2" data-unicode="e66a" data-added="v0.1.0">
<span class="name"><i class="ss ss-dd2"></i> Jace v. Chandra <em>(dd2)</em></span>
</div>
<div class="icon" id="ddc" name="Divine v. Demonic" data-name="Divine v. Demonic" data-class="ddc" data-unicode="e66b" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddc"></i> Divine v. Demonic <em>(ddc)</em></span>
</div>
<div class="icon" id="ddd" name="Garruk v. Liliana" data-name="Garruk v. Liliana" data-class="ddd" data-unicode="e66c" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddd"></i> Garruk v. Liliana <em>(ddd)</em></span>
</div>
<div class="icon" id="dde" name="Phyrexia v. Coalition" data-name="Phyrexia v. Coalition" data-class="dde" data-unicode="e66d" data-added="v0.1.0">
<span class="name"><i class="ss ss-dde"></i> Phyrexia v. Coalition <em>(dde)</em></span>
</div>
<div class="icon" id="ddf" name="Elspeth v. Tezzeret" data-name="Elspeth v. Tezzeret" data-class="ddf" data-unicode="e66e" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddf"></i> Elspeth v. Tezzeret <em>(ddf)</em></span>
</div>
<div class="icon" id="ddg" name="Knights v. Dragons" data-name="Knights v. Dragons" data-class="ddg" data-unicode="e66f" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddg"></i> Knights v. Dragons <em>(ddg)</em></span>
</div>
<div class="icon" id="ddh" name="Ajani v. Nicol Bolas" data-name="Ajani v. Nicol Bolas" data-class="ddh" data-unicode="e670" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddh"></i> Ajani v. Nicol Bolas <em>(ddh)</em></span>
</div>
<div class="icon" id="ddi" name="Venser v. Koth" data-name="Venser v. Koth" data-class="ddi" data-unicode="e671" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddi"></i> Venser v. Koth <em>(ddi)</em></span>
</div>
<div class="icon" id="ddj" name="Izzet v. Golgari" data-name="Izzet v. Golgari" data-class="ddj" data-unicode="e672" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddj"></i> Izzet v. Golgari <em>(ddj)</em></span>
</div>
<div class="icon" id="ddk" name="Sorin v. Tibalt" data-name="Sorin v. Tibalt" data-class="ddk" data-unicode="e673" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddk"></i> Sorin v. Tibalt <em>(ddk)</em></span>
</div>
<div class="icon" id="ddl" name="Heroes v. Monsters" data-name="Heroes v. Monsters" data-class="ddl" data-unicode="e674" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddl"></i> Heroes v. Monsters <em>(ddl)</em></span>
</div>
<div class="icon" id="ddm" name="Jace v. Vraska" data-name="Jace v. Vraska" data-class="ddm" data-unicode="e675" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddm"></i> Jace v. Vraska <em>(ddm)</em></span>
</div>
<div class="icon" id="ddn" name="Speed v. Cunning" data-name="Speed v. Cunning" data-class="ddn" data-unicode="e676" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddn"></i> Speed v. Cunning <em>(ddn)</em></span>
</div>
<div class="icon" id="ddo" name="Kiora v. Elspeth" data-name="Kiora v. Elspeth" data-class="ddo" data-unicode="e677" data-added="v0.1.0">
<span class="name"><i class="ss ss-ddo"></i> Kiora v. Elspeth <em>(ddo)</em></span>
</div>
<div class="icon" id="ddp" name="Zendikar v. Eldrazi" data-name="Zendikar v. Eldrazi" data-class="ddp" data-unicode="e698" data-added="v1.3.1">
<span class="name"><i class="ss ss-ddp"></i> Zendikar v. Eldrazi <em>(ddp)</em></span>
</div>
<div class="icon" id="ddq" name="Zendikar v. Eldrazi" data-name="Blessed v. Cursed" data-class="ddq" data-unicode="e908" data-added="v1.5.5">
<span class="name"><i class="ss ss-ddq"></i> Blessed v. Cursed <em>(ddq)</em></span>
</div>
<div class="icon" id="ddr" name="Nissa v. Ob Nixilis" data-name="Nissa v. Ob Nixilis" data-class="ddr" data-unicode="e90d" data-added="v1.7.0">
<span class="name"><i class="ss ss-ddr"></i> Nissa v. Ob Nixilis <em>(ddr)</em></span>
</div>
<div class="icon" id="td2" name="New Phyrexia v. Mirrodin Pure" data-name="New Phyrexia v. Mirrodin Pure" data-class="td2" data-unicode="e91c" data-added="v2.1.0">
<span class="name"><i class="ss ss-td2"></i> New Phyrexia v. Mirrodin Pure <em>(td2)</em></span>
</div>
<div class="icon" id="dds" name="Mind v. Might" data-name="Mind v. Might" data-class="dds" data-unicode="e921" data-added="v2.2.0">
<span class="name"><i class="ss ss-dds"></i> Mind v. Might <em>(dds)</em></span>
</div>
<div class="icon" id="ddt" name="Merfolk v. Goblins" data-name="Merfolk v. Goblins" data-class="ddt" data-unicode="e933" data-added="v3.1.4">
<span class="name"><i class="ss ss-ddt"></i> Merfolk v. Goblins <em>(ddt)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>From the Vault Sets</h4>
<div class="icons">
<div class="icon" id="drb" name="FTV: Dragons" data-name="FTV: Dragons" data-class="drb" data-unicode="e678" data-added="v0.1.0">
<span class="name"><i class="ss ss-drb"></i> FTV: Dragons <em>(drb)</em></span>
</div>
<div class="icon" id="v09" name="FTV: Exiled" data-name="FTV: Exiled" data-class="v09" data-unicode="e679" data-added="v0.1.0">
<span class="name"><i class="ss ss-v09"></i> FTV: Exiled <em>(v09)</em></span>
</div>
<div class="icon" id="v0x" name="FTV: Vaults" data-name="FTV: Vaults" data-class="v0x" data-unicode="e920" data-added="v2.1.5">
<span class="name"><i class="ss ss-v0x"></i> FTV: Vaults <em>(v0x)</em></span>
</div>
<div class="icon" id="v10" name="FTV: Relics" data-name="FTV: Relics" data-class="v10" data-unicode="e67a" data-added="v0.1.0">
<span class="name"><i class="ss ss-v10"></i> FTV: Relics <em>(v10)</em></span>
</div>
<div class="icon" id="v11" name="FTV: Legends" data-name="FTV: Legends" data-class="v11" data-unicode="e67b" data-added="v0.1.0">
<span class="name"><i class="ss ss-v11"></i> FTV: Legends <em>(v11)</em></span>
</div>
<div class="icon" id="v12" name="FTV: Realms" data-name="FTV: Realms" data-class="v12" data-unicode="e67c" data-added="v0.1.0">
<span class="name"><i class="ss ss-v12"></i> FTV: Realms <em>(v12)</em></span>
</div>
<div class="icon" id="v13" name="FTV: Twenty" data-name="FTV: Twenty" data-class="v13" data-unicode="e67d" data-added="v0.1.0">
<span class="name"><i class="ss ss-v13"></i> FTV: Twenty <em>(v13)</em></span>
</div>
<div class="icon" id="v14" name="FTV: Annihilation" data-name="FTV: Annihilation" data-class="v14" data-unicode="e67e" data-added="v0.1.0">
<span class="name"><i class="ss ss-v14"></i> FTV: Annihilation <em>(v14)</em></span>
</div>
<div class="icon" id="v15" name="FTV: Angels" data-name="FTV: Angels" data-class="v15" data-unicode="e905" data-added="v1.5.3">
<span class="name"><i class="ss ss-v15"></i> FTV: Angels <em>(v15)</em></span>
</div>
<div class="icon" id="v16" name="FTV: Lore" data-name="FTV: Lore" data-class="v16" data-unicode="e906" data-added="v1.5.3">
<span class="name"><i class="ss ss-v16"></i> FTV: Lore <em>(v16)</em></span>
</div>
<div class="icon" id="v17" name="FTV: Transform" data-name="FTV: Transform" data-class="v17" data-unicode="e939" data-added="v3.1.6">
<span class="name"><i class="ss ss-v17"></i> FTV: Transform <em>(v17)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Premium Deck Series and Other Decks</h4>
<div class="icons">
<div class="icon" id="h09" name="FTV: Slivers" data-name="PDS: Slivers" data-class="h09" data-unicode="e67f" data-added="v0.1.0">
<span class="name"><i class="ss ss-h09"></i> PDS: Slivers <em>(h09)</em></span>
</div>
<div class="icon" id="pd2" name="FTV: Fire &amp; Lightning" data-name="PDS: Fire" data-class="pd2" data-unicode="e680" data-added="v0.1.0">
<span class="name"><i class="ss ss-pd2"></i> PDS: Fire &amp; Lightning <em>(pd2)</em></span>
</div>
<div class="icon" id="pd3" name="PDS: Graveborn" data-name="PDS: Graveborn" data-class="pd3" data-unicode="e681" data-added="v0.1.0">
<span class="name"><i class="ss ss-pd3"></i> PDS: Graveborn <em>(pd3)</em></span>
</div>
<div class="icon" id="md1" name="Modern Event Deck" data-name="Modern Event Deck" data-class="md1" data-unicode="e682" data-added="v0.1.0">
<span class="name"><i class="ss ss-md1"></i> Modern Event Deck <em>(md1)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Promotional Sets</h4>
<div class="icons">
<div class="icon" id="pgru" name="Guru" data-name="Guru Lands" data-class="pgru" data-unicode="e683" data-added="v0.1.0">
<span class="name"><i class="ss ss-pgru"></i> Guru Lands <em>(pgru)</em></span>
</div>
<div class="icon" id="pmtg1" name="MtG Promo" data-name="MtG Promo" data-class="pmtg1" data-unicode="e684" data-added="v0.1.0">
<span class="name"><i class="ss ss-pmtg1"></i> MtG Promo <em>(pmtg1)</em></span>
</div>
<div class="icon" id="pmtg2" name="MtG Promo (Alternate)" data-name="MtG Promo (Alt)" data-class="pmtg2" data-unicode="e685" data-added="v0.1.0">
<span class="name"><i class="ss ss-pmtg2"></i> MtG Promo (Alt) <em>(pmtg2)</em></span>
</div>
<div class="icon" id="pleaf" name="Leaf Promo" data-name="Leaf Promo" data-class="pleaf" data-unicode="e686" data-added="v0.1.0">
<span class="name"><i class="ss ss-pleaf"></i> Leaf Promo <em>(pleaf)</em></span>
</div>
<div class="icon" id="pmei" name="Media Insert" data-name="Media Insert" data-class="pmei" data-unicode="e687" data-added="v0.1.0">
<span class="name"><i class="ss ss-pmei"></i> Media Insert <em>(pmei)</em></span>
</div>
<div class="icon" id="parl" name="Arena Promo (DCI)" data-name="Arena Promo (DCI)" data-class="parl" data-unicode="e688" data-added="v0.1.0">
<span class="name"><i class="ss ss-parl"></i> Arena Promo (DCI) <em>(parl)</em></span>
</div>
<div class="icon" id="dpa" name="Duels of the Planeswalkers" data-name="Duels of the Planeswalkers" data-class="dpa" data-unicode="e689" data-added="v0.1.0">
<span class="name"><i class="ss ss-dpa"></i> Duels of the Planeswalkers <em>(dpa)</em></span>
</div>
<div class="icon" id="pbook" name="Book Inserts" data-name="Book Inserts" data-class="pbook" data-unicode="e68a" data-added="v0.1.0">
<span class="name"><i class="ss ss-pbook"></i> Book Inserts <em>(pbook)</em></span>
</div>
<div class="icon" id="past" name="Astral" data-name="Astral" data-class="past" data-unicode="e68b" data-added="v0.1.0">
<span class="name"><i class="ss ss-past"></i> Astral <em>(past)</em></span>
</div>
<div class="icon" id="parl2" name="Arena League" data-name="Arena League" data-class="parl2" data-unicode="e68c" data-added="v0.1.0">
<span class="name"><i class="ss ss-parl2"></i> Arena League <em>(parl2)</em></span>
</div>
<div class="icon" id="exp" name="Zendikar Expeditions" data-name="Zendikar Expeditions" data-class="exp" data-unicode="e69a" data-added="v1.4.1">
<span class="name"><i class="ss ss-exp"></i> Zendikar Expeditions <em>(exp)</em></span>
</div>
<div class="icon" id="psalvat05" name="Salvat 2005" data-name="Salvat 2005" data-class="psalvat05" data-unicode="e909" data-added="v1.5.6">
<span class="name"><i class="ss ss-psalvat05"></i> Salvat 2005 <em>(psalvat05)</em></span>
</div>
<div class="icon" id="psalvat11" name="Salvat 2011" data-name="Salvat 2011" data-class="psalvat11" data-unicode="e90a" data-added="v1.5.6">
<span class="name"><i class="ss ss-psalvat11"></i> Salvat 2011 <em>(psalvat11)</em></span>
</div>
<div class="icon" id="mp1" name="Kaladesh Inventions" data-name="Kaladesh Inventions" data-class="mp1" data-unicode="e913" data-added="v1.7.2">
<span class="name"><i class="ss ss-mp1"></i> Kaladesh Inventions <em>(mp1)</em></span>
</div>
<div class="icon" id="pxbox" name="Xbox Media Promo" data-name="Xbox Media Promo" data-class="pxbox" data-unicode="e915" data-added="v2.0.1">
<span class="name"><i class="ss ss-pxbox"></i> Xbox Media Promo <em>(pxbox)</em></span>
</div>
<div class="icon" id="pmps" name="Magic Premiere Shop" data-name="Magic Premeire Shop" data-class="pmps" data-unicode="e919" data-added="v2.1.0">
<span class="name"><i class="ss ss-pmps"></i> Magic Premiere Shop <em>(pmps)</em></span>
</div>
<div class="icon" id="pmpu" name="Mirrodin Pure" data-name="Mirrodin Pure" data-class="pmpu" data-unicode="e91a" data-added="v2.1.0">
<span class="name"><i class="ss ss-pmpu"></i> Mirrodin Pure <em>(pmpu)</em></span>
</div>
<div class="icon" id="mp2" name="Amonkhet Invocations"data-name="Amonkhet Invocations" data-class="mp2" data-unicode="e922" data-added="v2.2.2">
<span class="name"><i class="ss ss-mp2"></i> Amonkhet Invocations <em>(mp2)</em></span>
</div>
<div class="icon" id="pidw" name="IDW Promo"data-name="IDW Promo" data-class="pidw" data-unicode="e92c" data-added="v3.0.1">
<span class="name"><i class="ss ss-pidw"></i> IDW Promo <em>(pidw)</em></span>
</div>
<div class="icon" id="pdrc" name="Dragon*Con Promo"data-name="Dragon*Con Promo" data-class="pdrc" data-unicode="e932" data-added="v3.1.2">
<span class="name"><i class="ss ss-pdrc"></i> Dragon*Con Promo <em>(pdrc)</em></span>
</div>
<div class="icon" id="pheart" name="Phoenix Heart Celebration Card" data-name="Phoenix Heart (card)" data-class="pheart" data-unicode="e936" data-added="v3.1.5">
<span class="name"><i class="ss ss-pheart"></i> Phoenix Heart (card) <em>(pheart)</em></span>
</div>
<div class="icon" id="h17" name="HasCon 2017" data-name="HasCon 2017" data-class="h17" data-unicode="e938" data-added="v3.1.6">
<span class="name"><i class="ss ss-h17"></i> HasCon 2017 <em>(h17)</em></span>
</div>
<div class="icon" id="pdep" name="Duelist: Extra Pulled" data-name="Duelist: Extra Pulled" data-class="pdep" data-unicode="e93a" data-added="v3.1.7">
<span class="name"><i class="ss ss-pdep"></i> Duelist: Extra Pulled <em>(pdep)</em></span>
</div>
<div class="icon" id="psega" name="SEGA Dreamcast" data-name="SEGA Dreamcast" data-class="psega" data-unicode="e93b" data-added="v3.1.7">
<span class="name"><i class="ss ss-psega"></i> SEGA Dreamcast <em>(psega)</em></span>
</div>
<div class="icon" id="ptsa" name="The Sorcerer's Apprentice" data-name="The Sorcerer's Apprentice" data-class="ptsa" data-unicode="e93c" data-added="v3.1.7">
<span class="name"><i class="ss ss-ptsa"></i> The Sorcerer's Apprentice <em>(ptsa)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Online Sets</h4>
<div class="icons">
<div class="icon" id="med" name="Masters Edition" data-name="Masters Edition" data-class="med" data-unicode="e68d" data-added="v0.1.0">
<span class="name"><i class="ss ss-med"></i> Masters Edition <em>(med)</em></span>
</div>
<div class="icon" id="me2" name="Masters Edition II" data-name="Masters Edition II" data-class="me2" data-unicode="e68e" data-added="v0.1.0">
<span class="name"><i class="ss ss-me2"></i> Masters Edition II <em>(me2)</em></span>
</div>
<div class="icon" id="me3" name="Masters Edition III" data-name="Masters Edition III" data-class="me3" data-unicode="e68f" data-added="v0.1.0">
<span class="name"><i class="ss ss-me3"></i> Masters Edition III <em>(me3)</em></span>
</div>
<div class="icon" id="me4" name="Masters Edition IV" data-name="Masters Edition IV" data-class="me4" data-unicode="e690" data-added="v0.1.0">
<span class="name"><i class="ss ss-me4"></i> Masters Edition IV <em>(me4)</em></span>
</div>
<div class="icon" id="vma" name="Vintage Masters" data-name="Vintage Masters" data-class="vma" data-unicode="e696" data-added="v1.1.0">
<span class="name"><i class="ss ss-vma"></i> Vintage Masters <em>(vma)</em></span>
</div>
<div class="icon" id="tpr" name="Tempest Remastered" data-name="Tempest Remastered" data-class="tpr" data-unicode="e694" data-added="v1.0.1">
<span class="name"><i class="ss ss-tpr"></i> Tempest Remastered <em>(tpr)</em></span>
</div>
<div class="icon" id="pz1" name="Legendary Cube" data-name="Legendary Cube" data-class="pz1" data-unicode="e90c" data-added="v1.6.2">
<span class="name"><i class="ss ss-xlcu"></i> Legendary Cube <em>(pz1)</em></span>
</div>
<div class="icon" id="pmodo" name="Magic Online" data-name="Magic Online" data-class="pmodo" data-unicode="e91b" data-added="v2.1.0">
<span class="name"><i class="ss ss-pmodo"></i> Magic Online <em>(pmodo)</em></span>
</div>
<div class="icon" id="xduels" name="Magic Duels" data-name="Magic Duels" data-class="xduels" data-unicode="e91d" data-added="v2.1.0">
<span class="name"><i class="ss ss-xduels"></i> Magic Duels <em>(xduels)</em></span>
</div>
<div class="icon" id="xmods" name="Magic Online Deck Series" data-name="Magic Online Deck Series" data-class="xmods" data-unicode="e91e" data-added="v2.1.0">
<span class="name"><i class="ss ss-xmods"></i> Magic Online Deck Series <em>(xmods)</em></span>
</div>
<div class="icon" id="pz2" name="Treasure Chests" data-name="Treasure Chests" data-class="pz2" data-unicode="e91f" data-added="v2.1.2">
<span class="name"><i class="ss ss-pz2"></i> Treasure Chests <em>(pz2)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Un-Serious Sets</h4>
<div class="icons">
<div class="icon" id="ugl" name="Unglued" data-name="Unglued" data-class="ugl" data-unicode="e691" data-added="v0.1.0">
<span class="name"><i class="ss ss-ugl"></i> Unglued <em>(ugl)</em></span>
</div>
<div class="icon" id="unh" name="Unhinged" data-name="Unhinged" data-class="unh" data-unicode="e692" data-added="v0.1.0">
<span class="name"><i class="ss ss-unh"></i> Unhinged <em>(unh)</em></span>
</div>
<div class="icon" id="ust" name="Unstable" data-name="Unstable" data-class="ust" data-unicode="e930" data-added="v3.1.0">
<span class="name"><i class="ss ss-ust"></i> Unstable <em>(ust)</em></span>
</div>
</div>
</section>
<section class="content">
<h4>Unofficial Symbols</h4>
<div class="icons">
<div class="icon" id="xcle" name="Collector's Edition" data-name="Collector's Edition" data-class="xcle" data-unicode="e926" data-added="v3.0.0">
<span class="name"><i class="ss ss-xcle"></i> Collector's Edition <em>(xcle)</em></span>
</div>
<div class="icon" id="xice" name="International Collector's Edition" data-name="International Collector's Edition" data-class="xice" data-unicode="e927" data-added="v3.0.0">
<span class="name"><i class="ss ss-xice"></i> International Collector's Edition <em>(xice)</em></span>
</div>
<div class="icon" id="x2ps" name="Two Player Introductory Set" data-name="Two Player Introductory Set" data-class="x2ps" data-unicode="e928" data-added="v3.0.0">
<span class="name"><i class="ss ss-x2ps"></i> Two Player Introductory Set <em>(x2ps)</em></span>
</div>
<div class="icon" id="x4ea" name="Alternate 4th Edition" data-name="Alternate 4th Edition" data-class="x4ea" data-unicode="e929" data-added="v3.0.0">
<span class="name"><i class="ss ss-x4ea"></i> Alternate 4th Edition <em>(x4ea)</em></span>
</div>
<div class="icon" id="papac" name="APAC Lands" data-name="APAC Lands" data-class="papac" data-unicode="e92a" data-added="v3.0.0">
<span class="name"><i class="ss ss-papac"></i> APAC Lands <em>(papac)</em></span>
</div>
<div class="icon" id="peuro" name="Euro Lands" data-name="Euro Lands" data-class="peuro" data-unicode="e92b" data-added="v3.0.0">
<span class="name"><i class="ss ss-peuro"></i> Euro Lands <em>(peuro)</em></span>
</div>
<div class="icon" id="pfnm" name="Friday Night Magic" data-name="Friday Night Magic" data-class="pfnm" data-unicode="e937" data-added="v3.1.5">
<span class="name"><i class="ss ss-pfnm"></i> Friday Night Magic <em>(pfnm)</em></span>
</div>
</div>
</section>
</div>
</main>
<footer>
<div class="wrapper">
<div class="float-left">
<p>Made with &hearts; by <a href="http://andrewgioia.com">Andrew Gioia</a></p>
</div>
<div class="float-right" style="text-align: right;">
<p>
All set images &copy; <a href="http://magicthegathering.com">Wizards of the Coast</a><br />
The Keyrune font is licensed under the the <a href="http://scripts.sil.org/OFL">SIL OFL 1.1</a><br />
Keyrune CSS, LESS, and Sass files are licensed under the <a href="http://opensource.org/licenses/mit-license.html">MIT License</a><br />
</p>
</div>
<div class="clear"></div>
</div>
</footer>
<!-- Icon preview -->
<div id="modal">
<div id="closeModalContainer">
<a href="javascript:;" id="closeModal"><i class="ss ss-10e ss-2x"></i></a>
</div>
<div id="iconPreview">
<i class="ss ss-fw ss-common ss-mtg"></i>
</div>
<div id="iconMeta">
<h3><span id="setName">Set</span> <span id="setCode">(Code)</span></h3>
<ul id="metaInfo">
<li class="html">
<strong>HTML:</strong>
<code>&lt;i class="ss <span>ss-mtg</span>"&gt;&lt;/i&gt;</code>
</li>
<li class="class">
<strong>Class:</strong>
<span>.ss-mtg</span>
</li>
<li class="unicode">
<strong>Unicode:</strong>
<span>e600</span>
</li>
<li class="added">
<strong>Added:</strong>
<span>v0.1.0</span>
</li>
</ul>
<ul id="toggleRarity" class="clearfix">
<li><a href="javascript:;" class="left active" data-rarity="common">Common</a></li>
<li><a href="javascript:;" data-rarity="uncommon">Uncommon</a></li>
<li><a href="javascript:;" data-rarity="rare">Rare</a></li>
<li><a href="javascript:;" data-rarity="mythic">Mythic</a></li>
<li><a href="javascript:;" class="right" data-rarity="foil">Foil</a></li>
</ul>
<div id="withGradient">
<input type="checkbox" name="withGradient" id="toggleGradient" /> Show rarity gradient
</div>
</div>
</div>
<script type="text/javascript" src="node_modules/zepto/dist/zepto.min.js"></script>
<script type="text/javascript">
$( function (e) {
var loadModal = function( icon )
{
// if we have an icon, build the modal
var el = $( '#'+icon );
var name = el.data( 'name' ),
classname = el.data( 'class' ),
unicode = el.data( 'unicode' ),
added = el.data( 'added' );
$( '#iconPreview i' ).removeClass().addClass( 'ss ss-fw ss-common ss-'+icon );
$( '#setName' ).html( name );
$( '#setCode' ).html( '('+icon+')' );
$( '#metaInfo .html span' ).html( 'ss-'+icon );
$( '#metaInfo .class span' ).html( classname );
$( '#metaInfo .unicode span' ).html( unicode );
$( '#metaInfo .added span' ).html( added );
// show the modal
$( '#overlay' ).show();
$( '#modal' ).show();
// update the url query string
var newurl = window.location.origin + window.location.pathname + '?icon='+icon;
window.history.pushState( {path:newurl}, '', newurl );
}
// toggle rarity controls
$( '#toggleRarity' ).on( 'click', 'a', function( e ) {
var rarity = $( this ).data( 'rarity' );
$( '#iconPreview i' )
.removeClass( 'ss-common ss-uncommon ss-rare ss-mythic ss-foil' )
.addClass( 'ss-'+rarity );
$( '#toggleRarity a.active' ).removeClass( 'active' );
$( this ).addClass( 'active' );
});
// gradient toggle
$( '#toggleGradient' ).on( 'click', function( e ) {
$( '#iconPreview i' ).toggleClass( 'ss-grad' );
});
// close modal button
$( '#closeModal' ).on( 'click', function( e ) {
$( '#overlay' ).hide();
$( '#toggleGradient' ).prop( 'checked', false );
$( '#toggleRarity a.active' ).removeClass( 'active' );
$( '#toggleRarity a[data-rarity="common"]' ).addClass( 'active' );
$( '#modal' ).hide();
});
// get icon from url, if there is one
var url = window.location.href;
var name = 'icon';
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url),
icon = '';
if ( results && results[2] ) {
icon = decodeURIComponent( results[2].replace(/\+/g, " ") );
}
if ( icon.length > 0 ) {
loadModal( icon );
}
// load modal from icon clicks
$( 'main' ).on( 'click', '.icon', function (e) {
var icon = $( this ).attr( 'id' );
loadModal( icon );
});
});
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink