SVGファイルを作成し、アップローダーでアップするだけで、オリジナルのWebフォントを作成できるサイトです。ありがたい。
SVG Icon Libraries and Custom Icon Font Organizer
❍ IcoMoon
Easily mange your icons and integrate them in your projects. Browse free icons or import your own SVG icons to export as...
icomoon.io
SVGファイルを登録
右上のIcoMoonAppをクリックして画面移動します。
作成したsvgファイルをアップロードします。
今回アップしたのは４つの円を作成したものをアップロード。
アップロードしたら、ファイルを選択します。
クリックするとオレンジ色で選択されます。
右下のGenerate Fontを選択します。
画面が表示されて、右下のDownloadボタンからダウンロードできます。
ちなみに、アップロードしたファイルにマウスを当てると、Get Codeがでてきて、クリックするとHTMLやCSSをコピーできます。
HTML、CSSもコピーできて便利ですね。
ダウンロードしたファイル
zip解凍後のファイルです。
fontsフォルダ、style.css、htmlファイルで確認できました。
必要なファイルやフォルダは、fonts、style.cssとhtmlのコードでした。
HTML
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>IcoMoon Demo</title>
<link rel="stylesheet" href="style.css"></head>
<body>
<span class="icon-ashikitaico_circle"></span>
</body>
</html>
拡大してもいい感じです。
コメント