この記事は【2021年3月4日】が最後の更新のため、記事の内容が古い可能性があります。
Googleが提供し始めた無料のアイコンフォント
普段はFont Awesomeにお世話になっていますが、良さそうなのでご紹介。
Font Awesomeについての記事はこちら
WEB FONTの読み込み
<head>〜</head>の間に下記を入力。
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
これでWEB FONTの読み込み環境が整いました。
記述する場所については特に指定はないですが、分からなかったら似たようなコードが書かれている部分でOKですよ。
問題ないだろうけど、うまく表示されなかったら読み込みの順番（行）とか変えてみてください。
ICONの表示方法
Font Awesomeとはちょっと違うのですが、感覚的に扱いやすいかと思います。
<i class="material-icons">xxx</i>
xxxの部分に各ICONに指定されているテキストを入れて表示させます。
表示例
<i class=”material-icons”>pets</i>
pets
<i class=”material-icons”>watch</i>
watch
サイズや色を指定も簡単ですよ
Googleの公式ドキュメントにも記載されていますが、classに追加する事でサイズや装飾なども指定できます。
アイコン数などこれからですが、扱いやすいとは思うので是非お試しください。
「スタードメイン」は、年額100円からの独自ドメイン＋無料サーバーも付いてきます。
WordPressも使えるので、練習も兼ねてお手軽にサイト運営ができちゃいます。
ドメイン取得は同じところで取得しておくと便利ですよ。
お名前.comは1円から購入(1年間)できるドメインがあるので、いろいろと便利で経済的です。
WordPressも使えるので、練習も兼ねてお手軽にサイト運営ができちゃいます。
ドメイン取得は同じところで取得しておくと便利ですよ。
お名前.comは1円から購入(1年間)できるドメインがあるので、いろいろと便利で経済的です。
関連記事
2023/04/10
以前ご紹介した「Photoshopの代替品として使える「Pixelmator Pro」」の記事とは別の画像編集アプリケーションをご紹介します。ブラウザで利用で...
2023/04/07
今更感はありますが、この「RU DESIGN」のサイトでは、Googleアドセンスによる自動広告や各種アフィリエイトへのリンク等を表示・添付させてもらってます...
2023/03/19
GenAi合同会社は、AI技術であるGPTとプロのデザイナーがコラボレーションし、ロゴデザインを素早く提供するサービス「Aden」を開始。画像生成AIを活用し...
2023/03/19
Topaz合同会社は、画像生成AIを始め様々なAIを手軽に利用可能なAIプラットフォーム「AIOne」を通じて、「GPT-4」を2023年3月18日から無制限...
2023/03/02
noteにAI機能が追加されたみたいです。note AIアシスタント(β)と言う名称で、現在は一部のクリエイター向けにのみ提供されている機能になります。ついで...