384 lines
14 KiB
HTML
384 lines
14 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<title>Cryptocoins Webfont Demo</title>
|
||
|
|
|
||
|
|
<!-- CSS defining icons (required) -->
|
||
|
|
<link rel="stylesheet" href="webfont/cryptocoins.css">
|
||
|
|
|
||
|
|
<!-- CSS defining icon/coin colors (optional) -->
|
||
|
|
<!--link rel="stylesheet" href="webfont/cryptocoins-colors.css"-->
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<div id="demo">
|
||
|
|
|
||
|
|
<h1>Cryptocoins Webfont Demo</h1>
|
||
|
|
<p>
|
||
|
|
Check the HTML if you're not sure how to include the icons to your project.
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Don't forget that every icon is available as a separate SVG file as well.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<div class="icons">
|
||
|
|
<h2>A</h2>
|
||
|
|
<i class="cc ADA" title="ADA"></i>
|
||
|
|
<i class="cc ADA-alt" title="ADA"></i>
|
||
|
|
<i class="cc ADC" title="ADC"></i>
|
||
|
|
<i class="cc ADC-alt" title="ADC"></i>
|
||
|
|
<i class="cc AEON" title="AEON"></i>
|
||
|
|
<i class="cc AEON-alt" title="AEON"></i>
|
||
|
|
<i class="cc AMP" title="AMP"></i>
|
||
|
|
<i class="cc AMP-alt" title="AMP"></i>
|
||
|
|
<i class="cc ANC" title="ANC"></i>
|
||
|
|
<i class="cc ANC-alt" title="ANC"></i>
|
||
|
|
<i class="cc ARCH" title="ARCH"></i>
|
||
|
|
<i class="cc ARCH-alt" title="ARCH"></i>
|
||
|
|
<i class="cc ARDR" title="ARDR"></i>
|
||
|
|
<i class="cc ARDR-alt" title="ARDR"></i>
|
||
|
|
<i class="cc ARK" title="ARK"></i>
|
||
|
|
<i class="cc ARK-alt" title="ARK"></i>
|
||
|
|
<i class="cc AUR" title="AUR"></i>
|
||
|
|
<i class="cc AUR-alt" title="AUR"></i>
|
||
|
|
|
||
|
|
<h2>B</h2>
|
||
|
|
<i class="cc BANX" title="BANX"></i>
|
||
|
|
<i class="cc BANX-alt" title="BANX"></i>
|
||
|
|
<i class="cc BAT" title="BAT"></i>
|
||
|
|
<i class="cc BAT-alt" title="BAT"></i>
|
||
|
|
<i class="cc BAY" title="BAY"></i>
|
||
|
|
<i class="cc BAY-alt" title="BAY"></i>
|
||
|
|
<i class="cc BC" title="BC"></i>
|
||
|
|
<i class="cc BC-alt" title="BC"></i>
|
||
|
|
<i class="cc BCN" title="BCN"></i>
|
||
|
|
<i class="cc BCN-alt" title="BCN"></i>
|
||
|
|
<i class="cc BFT" title="BFT"></i>
|
||
|
|
<i class="cc BFT-alt" title="BFT"></i>
|
||
|
|
<i class="cc BRK" title="BRK"></i>
|
||
|
|
<i class="cc BRK-alt" title="BRK"></i>
|
||
|
|
<i class="cc BRX" title="BRX"></i>
|
||
|
|
<i class="cc BRX-alt" title="BRX"></i>
|
||
|
|
<i class="cc BSD" title="BSD"></i>
|
||
|
|
<i class="cc BSD-alt" title="BSD"></i>
|
||
|
|
<i class="cc BTA" title="BTA"></i>
|
||
|
|
<i class="cc BTC" title="BTC"></i>
|
||
|
|
<i class="cc BTC-alt" title="BTC"></i>
|
||
|
|
<i class="cc BCC" title="BCC"></i>
|
||
|
|
<i class="cc BCC-alt" title="BCC"></i>
|
||
|
|
<i class="cc BTCD" title="BTCD"></i>
|
||
|
|
<i class="cc BTCD-alt" title="BTCD"></i>
|
||
|
|
<i class="cc BTM" title="BTM"></i>
|
||
|
|
<i class="cc BTM-alt" title="BTM"></i>
|
||
|
|
<i class="cc BTS" title="BTS"></i>
|
||
|
|
<i class="cc BTS-alt" title="BTS"></i>
|
||
|
|
|
||
|
|
<h2>C</h2>
|
||
|
|
<i class="cc CLAM" title="CLAM"></i>
|
||
|
|
<i class="cc CLAM-alt" title="CLAM"></i>
|
||
|
|
<i class="cc CLOAK" title="CLOAK"></i>
|
||
|
|
<i class="cc CLOAK-alt" title="CLOAK"></i>
|
||
|
|
|
||
|
|
<h2>D</h2>
|
||
|
|
<i class="cc DAO" title="DAO"></i>
|
||
|
|
<i class="cc DAO-alt" title="DAO"></i>
|
||
|
|
<i class="cc DASH" title="DASH"></i>
|
||
|
|
<i class="cc DASH-alt" title="DASH"></i>
|
||
|
|
<i class="cc DCR" title="DCR"></i>
|
||
|
|
<i class="cc DCR-alt" title="DCR"></i>
|
||
|
|
<i class="cc DCT" title="DCT"></i>
|
||
|
|
<i class="cc DCT-alt" title="DCT"></i>
|
||
|
|
<i class="cc DGB" title="DGB"></i>
|
||
|
|
<i class="cc DGB-alt" title="DGB"></i>
|
||
|
|
<i class="cc DGD" title="DGD"></i>
|
||
|
|
<i class="cc DGX" title="DGX"></i>
|
||
|
|
<i class="cc DMD" title="DMD"></i>
|
||
|
|
<i class="cc DMD-alt" title="DMD"></i>
|
||
|
|
<i class="cc DOGE" title="DOGE"></i>
|
||
|
|
<i class="cc DOGE-alt" title="DOGE"></i>
|
||
|
|
|
||
|
|
<h2>E</h2>
|
||
|
|
<i class="cc EMC" title="EMC"></i>
|
||
|
|
<i class="cc EMC-alt" title="EMC"></i>
|
||
|
|
<i class="cc EOS" title="EOS"></i>
|
||
|
|
<i class="cc EOS-alt" title="EOS"></i>
|
||
|
|
<i class="cc ERC" title="ERC"></i>
|
||
|
|
<i class="cc ERC-alt" title="ERC"></i>
|
||
|
|
<i class="cc ETC" title="ETC"></i>
|
||
|
|
<i class="cc ETC-alt" title="ETC"></i>
|
||
|
|
<i class="cc ETH" title="ETH"></i>
|
||
|
|
<i class="cc ETH-alt" title="ETH"></i>
|
||
|
|
|
||
|
|
<h2>F</h2>
|
||
|
|
<i class="cc FC2" title="FC2"></i>
|
||
|
|
<i class="cc FC2-alt" title="FC2"></i>
|
||
|
|
<i class="cc FCT" title="FCT"></i>
|
||
|
|
<i class="cc FCT-alt" title="FCT"></i>
|
||
|
|
<i class="cc FLO" title="FLO"></i>
|
||
|
|
<i class="cc FLO-alt" title="FLO"></i>
|
||
|
|
<i class="cc FRK" title="FRK"></i>
|
||
|
|
<i class="cc FRK-alt" title="FRK"></i>
|
||
|
|
<i class="cc FTC" title="FTC"></i>
|
||
|
|
<i class="cc FTC-alt" title="FTC"></i>
|
||
|
|
|
||
|
|
<h2>G</h2>
|
||
|
|
<i class="cc GAME" title="GAME"></i>
|
||
|
|
<i class="cc GAME-alt" title="GAME"></i>
|
||
|
|
<i class="cc GBYTE" title="GBYTE"></i>
|
||
|
|
<i class="cc GBYTE-alt" title="GBYTE"></i>
|
||
|
|
<i class="cc GDC" title="GDC"></i>
|
||
|
|
<i class="cc GDC-alt" title="GDC"></i>
|
||
|
|
<i class="cc GEMZ" title="GEMZ"></i>
|
||
|
|
<i class="cc GEMZ-alt" title="GEMZ"></i>
|
||
|
|
<i class="cc GLD" title="GLD"></i>
|
||
|
|
<i class="cc GLD-alt" title="GLD"></i>
|
||
|
|
<i class="cc GNO" title="GNO"></i>
|
||
|
|
<i class="cc GNO-alt" title="GNO"></i>
|
||
|
|
<i class="cc GNT" title="GNT"></i>
|
||
|
|
<i class="cc GNT-alt" title="GNT"></i>
|
||
|
|
<i class="cc GOLOS" title="GOLOS"></i>
|
||
|
|
<i class="cc GOLOS-alt" title="GOLOS"></i>
|
||
|
|
<i class="cc GRC" title="GRC"></i>
|
||
|
|
<i class="cc GRC-alt" title="GRC"></i>
|
||
|
|
<i class="cc GRS" title="GRS"></i>
|
||
|
|
|
||
|
|
<h2>H</h2>
|
||
|
|
<i class="cc HEAT" title="HEAT"></i>
|
||
|
|
<i class="cc HEAT-alt" title="HEAT"></i>
|
||
|
|
|
||
|
|
<h2>I</h2>
|
||
|
|
<i class="cc ICN" title="ICN"></i>
|
||
|
|
<i class="cc ICN-alt" title="ICN"></i>
|
||
|
|
<i class="cc IFC" title="IFC"></i>
|
||
|
|
<i class="cc IFC-alt" title="IFC"></i>
|
||
|
|
<i class="cc INCNT" title="INCNT"></i>
|
||
|
|
<i class="cc INCNT-alt" title="INCNT"></i>
|
||
|
|
<i class="cc IOC" title="IOC"></i>
|
||
|
|
<i class="cc IOC-alt" title="IOC"></i>
|
||
|
|
<i class="cc IOTA" title="IOTA"></i>
|
||
|
|
<i class="cc IOTA-alt" title="IOTA"></i>
|
||
|
|
|
||
|
|
<h2>J</h2>
|
||
|
|
<i class="cc JBS" title="JBS"></i>
|
||
|
|
<i class="cc JBS-alt" title="JBS"></i>
|
||
|
|
|
||
|
|
<h2>K</h2>
|
||
|
|
<i class="cc KMD" title="KMD"></i>
|
||
|
|
<i class="cc KMD-alt" title="KMD"></i>
|
||
|
|
<i class="cc KOBO" title="KOBO"></i>
|
||
|
|
<i class="cc KORE" title="KORE"></i>
|
||
|
|
<i class="cc KORE-alt" title="KORE"></i>
|
||
|
|
|
||
|
|
<h2>L</h2>
|
||
|
|
<i class="cc LBC" title="LBC"></i>
|
||
|
|
<i class="cc LBC-alt" title="LBC"></i>
|
||
|
|
<i class="cc LDOGE" title="LDOGE"></i>
|
||
|
|
<i class="cc LDOGE-alt" title="LDOGE"></i>
|
||
|
|
<i class="cc LSK" title="LSK"></i>
|
||
|
|
<i class="cc LSK-alt" title="LSK"></i>
|
||
|
|
<i class="cc LTC" title="LTC"></i>
|
||
|
|
<i class="cc LTC-alt" title="LTC"></i>
|
||
|
|
|
||
|
|
<h2>M</h2>
|
||
|
|
<i class="cc MAID" title="MAID"></i>
|
||
|
|
<i class="cc MAID-alt" title="MAID"></i>
|
||
|
|
<i class="cc MCO" title="MCO"></i>
|
||
|
|
<i class="cc MCO-alt" title="MCO"></i>
|
||
|
|
<i class="cc MINT" title="MINT"></i>
|
||
|
|
<i class="cc MINT-alt" title="MINT"></i>
|
||
|
|
<i class="cc MONA" title="MONA"></i>
|
||
|
|
<i class="cc MONA-alt" title="MONA"></i>
|
||
|
|
<i class="cc MRC" title="MRC"></i>
|
||
|
|
<i class="cc MSC" title="MSC"></i>
|
||
|
|
<i class="cc MSC-alt" title="MSC"></i>
|
||
|
|
<i class="cc MTR" title="MTR"></i>
|
||
|
|
<i class="cc MTR-alt" title="MTR"></i>
|
||
|
|
<i class="cc MUE" title="MUE"></i>
|
||
|
|
<i class="cc MUE-alt" title="MUE"></i>
|
||
|
|
|
||
|
|
<h2>N</h2>
|
||
|
|
<i class="cc NBT" title="NBT"></i>
|
||
|
|
<i class="cc NEO" title="NEO"></i>
|
||
|
|
<i class="cc NEO-alt" title="NEO"></i>
|
||
|
|
<i class="cc NEOS" title="NEOS"></i>
|
||
|
|
<i class="cc NEOS-alt" title="NEOS"></i>
|
||
|
|
<i class="cc NEU" title="NEU"></i>
|
||
|
|
<i class="cc NEU-alt" title="NEU"></i>
|
||
|
|
<i class="cc NLG" title="NLG"></i>
|
||
|
|
<i class="cc NLG-alt" title="NLG"></i>
|
||
|
|
<i class="cc NMC" title="NMC"></i>
|
||
|
|
<i class="cc NMC-alt" title="NMC"></i>
|
||
|
|
<i class="cc NOTE" title="NOTE"></i>
|
||
|
|
<i class="cc NOTE-alt" title="NOTE"></i>
|
||
|
|
<i class="cc NVC" title="NVC"></i>
|
||
|
|
<i class="cc NVC-alt" title="NVC"></i>
|
||
|
|
<i class="cc NXT" title="NXT"></i>
|
||
|
|
<i class="cc NXT-alt" title="NXT"></i>
|
||
|
|
|
||
|
|
<h2>O</h2>
|
||
|
|
<i class="cc OK" title="OK"></i>
|
||
|
|
<i class="cc OK-alt" title="OK"></i>
|
||
|
|
<i class="cc OMG" title="OMG"></i>
|
||
|
|
<i class="cc OMG-alt" title="OMG"></i>
|
||
|
|
<i class="cc OMNI" title="OMNI"></i>
|
||
|
|
<i class="cc OMNI-alt" title="OMNI"></i>
|
||
|
|
<i class="cc OPAL" title="OPAL"></i>
|
||
|
|
<i class="cc OPAL-alt" title="OPAL"></i>
|
||
|
|
|
||
|
|
<h2>P</h2>
|
||
|
|
<i class="cc PART" title="PART"></i>
|
||
|
|
<i class="cc PART-alt" title="PART"></i>
|
||
|
|
<i class="cc PIGGY" title="PIGGY"></i>
|
||
|
|
<i class="cc PIGGY-alt" title="PIGGY"></i>
|
||
|
|
<i class="cc PINK" title="PINK"></i>
|
||
|
|
<i class="cc PINK-alt" title="PINK"></i>
|
||
|
|
<i class="cc PIVX" title="PIVX"></i>
|
||
|
|
<i class="cc PIVX-alt" title="PIVX"></i>
|
||
|
|
<i class="cc POT" title="POT"></i>
|
||
|
|
<i class="cc POT-alt" title="POT"></i>
|
||
|
|
<i class="cc PPC" title="PPC"></i>
|
||
|
|
<i class="cc PPC-alt" title="PPC"></i>
|
||
|
|
|
||
|
|
<h2>Q</h2>
|
||
|
|
<i class="cc QRK" title="QRK"></i>
|
||
|
|
<i class="cc QRK-alt" title="QRK"></i>
|
||
|
|
<i class="cc QTUM" title="QTUM"></i>
|
||
|
|
<i class="cc QTUM-alt" title="QTUM"></i>
|
||
|
|
|
||
|
|
<h2>R</h2>
|
||
|
|
<i class="cc RADS" title="RADS"></i>
|
||
|
|
<i class="cc RADS-alt" title="RADS"></i>
|
||
|
|
<i class="cc RBIES" title="RBIES"></i>
|
||
|
|
<i class="cc RBIES-alt" title="RBIES"></i>
|
||
|
|
<i class="cc RBT" title="RBT"></i>
|
||
|
|
<i class="cc RBT-alt" title="RBT"></i>
|
||
|
|
<i class="cc RBY" title="RBY"></i>
|
||
|
|
<i class="cc RBY-alt" title="RBY"></i>
|
||
|
|
<i class="cc RDD" title="RDD"></i>
|
||
|
|
<i class="cc RDD-alt" title="RDD"></i>
|
||
|
|
<i class="cc REP" title="REP"></i>
|
||
|
|
<i class="cc REP-alt" title="REP"></i>
|
||
|
|
<i class="cc RISE" title="RISE"></i>
|
||
|
|
<i class="cc RISE-alt" title="RISE"></i>
|
||
|
|
|
||
|
|
<h2>S</h2>
|
||
|
|
<i class="cc SALT" title="SALT"></i>
|
||
|
|
<i class="cc SALT-alt" title="SALT"></i>
|
||
|
|
<i class="cc SAR" title="SAR"></i>
|
||
|
|
<i class="cc SAR-alt" title="SAR"></i>
|
||
|
|
<i class="cc SCOT" title="SCOT"></i>
|
||
|
|
<i class="cc SCOT-alt" title="SCOT"></i>
|
||
|
|
<i class="cc SDC" title="SDC"></i>
|
||
|
|
<i class="cc SDC-alt" title="SDC"></i>
|
||
|
|
<i class="cc SIA" title="SIA"></i>
|
||
|
|
<i class="cc SIA-alt" title="SIA"></i>
|
||
|
|
<i class="cc SJCX" title="SJCX"></i>
|
||
|
|
<i class="cc SJCX-alt" title="SJCX"></i>
|
||
|
|
<i class="cc SLG" title="SLG"></i>
|
||
|
|
<i class="cc SLG-alt" title="SLG"></i>
|
||
|
|
<i class="cc SLS" title="SLS"></i>
|
||
|
|
<i class="cc SLS-alt" title="SLS"></i>
|
||
|
|
<i class="cc SNRG" title="SNRG"></i>
|
||
|
|
<i class="cc SNRG-alt" title="SNRG"></i>
|
||
|
|
<i class="cc START" title="START"></i>
|
||
|
|
<i class="cc START-alt" title="START"></i>
|
||
|
|
<i class="cc STEEM" title="STEEM"></i>
|
||
|
|
<i class="cc STEEM-alt" title="STEEM"></i>
|
||
|
|
<i class="cc STR" title="STR"></i>
|
||
|
|
<i class="cc STR-alt" title="STR"></i>
|
||
|
|
<i class="cc STRAT" title="STRAT"></i>
|
||
|
|
<i class="cc STRAT-alt" title="STRAT"></i>
|
||
|
|
<i class="cc SWIFT" title="SWIFT"></i>
|
||
|
|
<i class="cc SWIFT-alt" title="SWIFT"></i>
|
||
|
|
<i class="cc SYNC" title="SYNC"></i>
|
||
|
|
<i class="cc SYNC-alt" title="SYNC"></i>
|
||
|
|
<i class="cc SYS" title="SYS"></i>
|
||
|
|
<i class="cc SYS-alt" title="SYS"></i>
|
||
|
|
|
||
|
|
<h2>T</h2>
|
||
|
|
<i class="cc TRIG" title="TRIG"></i>
|
||
|
|
<i class="cc TRIG-alt" title="TRIG"></i>
|
||
|
|
<i class="cc TX" title="TX"></i>
|
||
|
|
<i class="cc TX-alt" title="TX"></i>
|
||
|
|
|
||
|
|
<h2>U</h2>
|
||
|
|
<i class="cc UBQ" title="UBQ"></i>
|
||
|
|
<i class="cc UBQ-alt" title="UBQ"></i>
|
||
|
|
<i class="cc UNITY" title="UNITY"></i>
|
||
|
|
<i class="cc UNITY-alt" title="UNITY"></i>
|
||
|
|
<i class="cc USDT" title="USDT"></i>
|
||
|
|
<i class="cc USDT-alt" title="USDT"></i>
|
||
|
|
|
||
|
|
<h2>V</h2>
|
||
|
|
<i class="cc VIOR" title="VIOR"></i>
|
||
|
|
<i class="cc VIOR-alt" title="VIOR"></i>
|
||
|
|
<i class="cc VNL" title="VNL"></i>
|
||
|
|
<i class="cc VNL-alt" title="VNL"></i>
|
||
|
|
<i class="cc VPN" title="VPN"></i>
|
||
|
|
<i class="cc VPN-alt" title="VPN"></i>
|
||
|
|
<i class="cc VRC" title="VRC"></i>
|
||
|
|
<i class="cc VRC-alt" title="VRC"></i>
|
||
|
|
<i class="cc VTC" title="VTC"></i>
|
||
|
|
<i class="cc VTC-alt" title="VTC"></i>
|
||
|
|
|
||
|
|
<h2>W</h2>
|
||
|
|
<i class="cc WAVES" title="WAVES"></i>
|
||
|
|
<i class="cc WAVES-alt" title="WAVES"></i>
|
||
|
|
|
||
|
|
<h2>X</h2>
|
||
|
|
<i class="cc XAI" title="XAI"></i>
|
||
|
|
<i class="cc XAI-alt" title="XAI"></i>
|
||
|
|
<i class="cc XBS" title="XBS"></i>
|
||
|
|
<i class="cc XBS-alt" title="XBS"></i>
|
||
|
|
<i class="cc XCP" title="XCP"></i>
|
||
|
|
<i class="cc XCP-alt" title="XCP"></i>
|
||
|
|
<i class="cc XEM" title="XEM"></i>
|
||
|
|
<i class="cc XEM-alt" title="XEM"></i>
|
||
|
|
<i class="cc XMR" title="XMR"></i>
|
||
|
|
<i class="cc XPM" title="XPM"></i>
|
||
|
|
<i class="cc XPM-alt" title="XPM"></i>
|
||
|
|
<i class="cc XRP" title="XRP"></i>
|
||
|
|
<i class="cc XRP-alt" title="XRP"></i>
|
||
|
|
<i class="cc XTZ" title="XTZ"></i>
|
||
|
|
<i class="cc XTZ-alt" title="XTZ"></i>
|
||
|
|
<i class="cc XVG" title="XVG"></i>
|
||
|
|
<i class="cc XVG-alt" title="XVG"></i>
|
||
|
|
<i class="cc XZC" title="XZC"></i>
|
||
|
|
<i class="cc XZC-alt" title="XZC"></i>
|
||
|
|
|
||
|
|
<h2>Y</h2>
|
||
|
|
<i class="cc YBC" title="YBC"></i>
|
||
|
|
<i class="cc YBC-alt" title="YBC"></i>
|
||
|
|
|
||
|
|
<h2>Z</h2>
|
||
|
|
<i class="cc ZEC" title="ZEC"></i>
|
||
|
|
<i class="cc ZEC-alt" title="ZEC"></i>
|
||
|
|
<i class="cc ZEIT" title="ZEIT"></i>
|
||
|
|
<i class="cc ZEIT-alt" title="ZEIT"></i>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
© Martin Allien (<a href="https://twitter.com/AllienWorks">@AllienWorks</a>), released under MIT licence
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
background: #fafafa;
|
||
|
|
font-family: "Montserrat", "Lato", "Helvetica", "Arial", sans-serif;
|
||
|
|
}
|
||
|
|
#demo {
|
||
|
|
width: 100%; max-width: 60rem;
|
||
|
|
margin: 3rem auto;
|
||
|
|
}
|
||
|
|
.icons {
|
||
|
|
margin: 3rem 0;
|
||
|
|
}
|
||
|
|
i.cc { font-size: 4rem; display: inline-block; margin: 0 1.3rem 1.3rem 0; transition: 0.1s ease all; }
|
||
|
|
i.cc:hover { color: #0060BD; transform: rotate(-20deg); transform-origin: 0.49em 0.7em; }
|
||
|
|
</style>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|