mirror of
https://github.com/andrewgioia/mana.git
synced 2025-11-04 00:50:45 +00:00
139 lines
8.4 KiB
HTML
139 lines
8.4 KiB
HTML
<head>
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
|
|
<title>Icon Cheatsheet | Mana</title>
|
|
<link rel="stylesheet" href="bower_components/mana/css/mana.css" />
|
|
<link rel="stylesheet" href="css/main.css" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
|
|
</head>
|
|
<body>
|
|
|
|
<section id="banner">
|
|
<div class="wrapper">
|
|
<a href="index.html" class="item">Home</a>
|
|
<a href="icons.html" class="item">Mana Icons</a>
|
|
<a href="attributes.html" class="item">Attributes</a>
|
|
<a href="http://github.com/andrewgioia/Mana" class="item">GitHub Project</a>
|
|
<span class="item">
|
|
<iframe src="https://ghbtns.com/github-btn.html?user=andrewgioia&repo=mana&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">Mana & Card Icons</h1>
|
|
<a class="dl button float-right" href="https://github.com/andrewgioia/Mana/archive/master.zip">
|
|
<i class="ms ms-instant"></i>
|
|
Download
|
|
</a>
|
|
<h2 class="sub">Complete set of Magic mana and card symbol font icons</h2>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<div class="wrapper">
|
|
<section>
|
|
<h3>
|
|
To use Mana on the desktop, install mana.otf, set it
|
|
as the font in your application, then copy and paste the
|
|
icons (not the unicode) directly from this page into
|
|
your designs. The UTF8 representation is provided as
|
|
a reference as well.
|
|
</h3>
|
|
</section>
|
|
<section class="content">
|
|
<h4>Icons, CSS Class, and Unicode</h4>
|
|
<div class="vectors">
|
|
<span class="utf"><i></i> ms-w <code>&#xe600;</code></span>
|
|
<span class="utf"><i></i> ms-u <code>&#xe601;</code></span>
|
|
<span class="utf"><i></i> ms-b <code>&#xe602;</code></span>
|
|
<span class="utf"><i></i> ms-r <code>&#xe603;</code></span>
|
|
<span class="utf"><i></i> ms-g <code>&#xe604;</code></span>
|
|
<span class="utf"><i></i> ms-c <code>&#xe904;</code></span>
|
|
<span class="utf"><i></i> ms-0 <code>&#xe605;</code></span>
|
|
<span class="utf"><i></i> ms-1 <code>&#xe606;</code></span>
|
|
<span class="utf"><i></i> ms-2 <code>&#xe607;</code></span>
|
|
<span class="utf"><i></i> ms-3 <code>&#xe608;</code></span>
|
|
<span class="utf"><i></i> ms-4 <code>&#xe609;</code></span>
|
|
<span class="utf"><i></i> ms-5 <code>&#xe60a;</code></span>
|
|
<span class="utf"><i></i> ms-6 <code>&#xe60b;</code></span>
|
|
<span class="utf"><i></i> ms-7 <code>&#xe60c;</code></span>
|
|
<span class="utf"><i></i> ms-8 <code>&#xe60d;</code></span>
|
|
<span class="utf"><i></i> ms-9 <code>&#xe60e;</code></span>
|
|
<span class="utf"><i></i> ms-10 <code>&#xe60f;</code></span>
|
|
<span class="utf"><i></i> ms-11 <code>&#xe610;</code></span>
|
|
<span class="utf"><i></i> ms-12 <code>&#xe611;</code></span>
|
|
<span class="utf"><i></i> ms-13 <code>&#xe612;</code></span>
|
|
<span class="utf"><i></i> ms-14 <code>&#xe613;</code></span>
|
|
<span class="utf"><i></i> ms-15 <code>&#xe614;</code></span>
|
|
<span class="utf"><i></i> ms-16 <code>&#xe62a;</code></span>
|
|
<span class="utf"><i></i> ms-17 <code>&#xe62b;</code></span>
|
|
<span class="utf"><i></i> ms-18 <code>&#xe62c;</code></span>
|
|
<span class="utf"><i></i> ms-19 <code>&#xe62d;</code></span>
|
|
<span class="utf"><i></i> ms-20 <code>&#xe62e;</code></span>
|
|
<span class="utf"><i></i> ms-x <code>&#xe615;</code></span>
|
|
<span class="utf"><i></i> ms-y <code>&#xe616;</code></span>
|
|
<span class="utf"><i></i> ms-z <code>&#xe617;</code></span>
|
|
<span class="utf"><i></i> ms-p <code>&#xe618;</code></span>
|
|
<span class="utf"><i></i> ms-s <code>&#xe619;</code></span>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<div class="vectors">
|
|
<span class="utf"><i></i> ms-tap <code>&#xe61a;</code></span>
|
|
<span class="utf"><i></i> ms-untap <code>&#xe61b;</code></span>
|
|
<span class="utf"><i></i> ms-tap-alt <code>&#xe61c;</code></span>
|
|
<span class="utf"><i></i> ms-chaos <code>&#xe616;</code></span>
|
|
<span class="utf"><i></i> ms-1-2 <code>&#xe61d;</code></span>
|
|
<span class="utf"><i></i> ms-infinity <code>&#xe902;</code></span>
|
|
<span class="utf"><i></i> ms-s <code>&#xe903;</code></span>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<div class="vectors">
|
|
<span class="utf"><i style="width:auto;"></i> ms-100 <code>&#xe900;</code></span>
|
|
<span class="utf long"><i class="long"></i> ms-100000 <code>&#xe901;</code></span>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<div class="vectors overflow">
|
|
<span class="utf"><i></i> ms-artifact <code>&#xe61e;</code></span>
|
|
<span class="utf"><i></i> ms-creature <code>&#xe61f;</code></span>
|
|
<span class="utf"><i></i> ms-enchantment <code>&#xe620;</code></span>
|
|
<span class="utf"><i></i> ms-instant <code>&#xe621;</code></span>
|
|
<span class="utf"><i></i> ms-land <code>&#xe622;</code></span>
|
|
<span class="utf"><i></i> ms-planeswalker <code>&#xe623;</code></span>
|
|
<span class="utf"><i></i> ms-sorcery <code>&#xe624;</code></span>
|
|
<span class="utf"><i></i> ms-loyalty-up <code>&#xe627;</code></span>
|
|
<span class="utf"><i></i> ms-loyalty-down <code>&#xe625;</code></span>
|
|
<span class="utf"><i></i> ms-loyalty-zero <code>&#xe626;</code></span>
|
|
<span class="utf"><i></i> ms-loyalty-start <code>&#xe628;</code></span>
|
|
<span class="utf"><i></i> ms-flashback <code>&#xe629;</code></span>
|
|
<span class="utf"><i></i> ms-dfc-night <code>&#xe905;</code></span>
|
|
<span class="utf"><i></i> ms-dfc-day <code>&#xe906;</code></span>
|
|
<div class="clear"></div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer>
|
|
<div class="wrapper">
|
|
<div class="float-left">
|
|
<p>Made with ♥ by <a href="http://andrewgioia.com">Andrew Gioia</a></p>
|
|
</div>
|
|
<div class="float-right" style="text-align: right;">
|
|
<p>
|
|
All mana images and card symbols © <a href="http://magicthegathering.com">Wizards of the Coast</a><br />
|
|
The Mana font is licensed under the the <a href="http://scripts.sil.org/OFL">SIL OFL 1.1</a><br />
|
|
Mana 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>
|
|
|
|
</body>
|
|
</html>
|