かわいい手書きフォントおすすめ15選｜無料の日本語書体も紹介

「投稿画像をもっとかわいくしたい」「いつもの文字では少し物足りない」と感じたときに役立つのが、あたたかみのある手書きフォントです。

ただし、かわいい書体は種類が多く、自分の作りたい雰囲気に合うものや、読みやすく使えるものを選ぶのは意外と迷いやすいですよね。

この記事では、無料で使える日本語対応のかわいい手書きフォントを、ゆるくナチュラルなものからポップで個性的なものまで15種類紹介します。

フォント選びのポイント、SNS画像やバナーで見やすく見せるコツ、利用条件の確認方法もまとめているので、初めて追加する方にもおすすめです。

お気に入りの文字を見つけて、投稿やデザインに自分らしいかわいさを添えてみましょう。

この記事でわかること

無料で使えるかわいい日本語手書きフォント15選
作りたい雰囲気や用途に合わせたフォントの選び方
SNS画像・バナー・ブログで読みやすく使うコツ
収録文字や利用条件を確認するポイント

無料で使えるかわいい手書きフォントおすすめ15選
かわいい手書きフォントは雰囲気と用途に合わせて選ぶ
SNS画像・バナー・ブログで読みやすく使うコツ
漢字や記号まで使えるか収録文字を確認する
商用利用やクレジット表記は公式の利用条件で判断する
Windows・Macに手書きフォントをインストールする方法
Google Fontsの日本語手書き風フォントをWebサイトで使う方法
まとめ

無料で使えるかわいい手書きフォントおすすめ15選

かわいい手書きフォントを選ぶなら、やさしい雰囲気の文字からポップで目立つ文字まで、作りたいデザインに合わせて選ぶのがおすすめです。

ここでは、無料で配布されている日本語対応の手書きフォントを中心に、ゆるくナチュラル・丸くポップ・大人かわいい・元気で個性的の4タイプに分けて15種類紹介します。

ひらがなの印象だけでなく、漢字にしたときの読みやすさもイメージしながら、お気に入りを探してみてください。

タイプ	向いているデザイン
ゆるくナチュラル	日記風画像、暮らし系の投稿、やさしいお知らせ
丸くポップ	イベント告知、子ども向け画像、明るい見出し
大人かわいい	カフェ風バナー、美容・雑貨の投稿、上品なタイトル
元気で個性的	注目させたい一言、セール告知、楽しい企画画像

ゆるくナチュラル：kawaii手書き文字・ふい字・あんずもじ・Yomogi

kawaii手書き文字は、手帳に書いたような親しみやすさがあり、ゆるくかわいい雰囲気を出したいときにぴったりです。

ひらがなを中心に短い言葉を入れると、やわらかな印象がより引き立ちます。

ふい字は、少しラフで自然な手書き感が魅力のフォントです。

かしこまりすぎないため、日常のちょっとしたお知らせや、写真に添える一言にもなじみます。

あんずもじは、丸みを感じる素直な字形で、読みやすさとかわいらしさのバランスを取りやすい書体です。

ナチュラル系の雑貨紹介や、やさしい雰囲気のブログ見出しにも合わせやすいでしょう。

Yomogiは、鉛筆やペンでさらっと書いたような軽やかさを持つ手書き風フォントです。

整いすぎない文字の表情が、温かみのあるデザインをつくります。

丸くポップ：うずらフォント・さなフォン丸・Hachi Maru Pop・Mochiy Pop One

うずらフォントは、ころんとした丸みと遊び心のある字形が特徴です。

明るく親しみやすい印象にしたい見出しや、ひとことメッセージに向いています。

さなフォン丸は、丸文字らしいかわいさがありながら、文字の形が見分けやすいフォントです。

女の子らしい配色の画像や、やわらかいポップなデザインとよく合います。

Hachi Maru Popは、太めで丸い文字が目を引く、楽しい雰囲気のフォントです。

小さな文字を詰め込むより、短いタイトルを大きく見せる使い方で魅力が伝わります。

Mochiy Pop Oneは、もちっとした太さと安定感があり、見出しに使いやすい丸文字フォントです。

かわいさを出しつつも存在感がほしいときに選びやすいでしょう。

大人かわいい：仕事メモ書き・瀬戸フォント・しょかきさらり・Klee One・Zen Kurenaido

仕事メモ書きは、メモに書いたような自然さを残しながら、落ち着いた印象もつくりやすいフォントです。

大人っぽい手書き感を取り入れたいときや、説明文のアクセントに便利です。

瀬戸フォントは、やさしく上品な表情を持ち、ナチュラルで少し大人っぽいデザインになじみます。

カフェ、ハンドメイド、暮らしに関する投稿のタイトルにも合わせやすいでしょう。

しょかきさらりは、筆でさらりと書いたような流れを感じられるフォントです。

和のテイストをほんのり加えたいときや、季節感のある画像にもおすすめです。

Klee Oneは、すっきりした手書き感と上品な細さが魅力です。

美容、ファッション、雑貨などの大人かわいい世界観を整えたい場面で活躍します。

Zen Kurenaidoは、筆記体のような自然な揺らぎがあり、やわらかく洗練された印象を演出できます。

メインタイトルだけでなく、引用文や気持ちを添える一文にも使いやすいフォントです。

元気で個性的：たぬき油性マジック・851手書き雑フォント

たぬき油性マジックは、太いマーカーで書いたような力強さがあり、元気で楽しい雰囲気を出せます。

キャンペーンの告知や、写真の上で目立たせたい短いフレーズにおすすめです。

851手書き雑フォントは、少しラフで勢いのある文字が特徴のフォントです。

きれいに整えすぎない手書き感がほしいときに使うと、デザインに親近感と個性を加えられます。

どちらも存在感があるため、長文ではなく数文字から十数文字ほどの見出しに取り入れると、読みやすくまとまります。

かわいい手書きフォントは雰囲気と用途に合わせて選ぶ

かわいい手書きフォントは、作りたい雰囲気と文字を使う場所に合わせて選ぶと、デザイン全体がまとまりやすくなります。

ゆるく親しみやすく見せたいのか、上品で大人っぽく見せたいのかによって、似合う文字の太さや丸み、線の揺らぎは異なります。

「かわいい」という印象だけで決めず、届けたい気分から選ぶことが、手書きフォントをおしゃれに取り入れる近道です。

目指す雰囲気	選びやすい書体の特徴	合わせやすい場面
ゆるい・ナチュラル	線にほどよい揺らぎがある文字	日常の記録、カフェ風の画像、暮らしの投稿
大人かわいい	細めで余白を感じるすっきりした文字	美容、ファッション、雑貨の紹介
ポップ・元気	丸みがあり、太さのある文字	イベント告知、学校行事、明るい投稿画像
印象的・個性的	独特な形や勢いを持つ文字	ロゴ、メイン見出し、短いキャッチコピー

ゆるい印象には線の揺らぎがあるナチュラルな書体

ゆるくて親しみやすいデザインには、手で書いたときのような線の揺らぎや、少し不ぞろいな形を感じる書体がよく合います。

かっちり整いすぎていない文字は、作り手の温度を伝えやすく、写真やイラストのやわらかな雰囲気にもなじみます。

たとえば、カフェ巡りの記録、手作りのお菓子、部屋づくり、休日の写真など、日常を切り取るようなテーマと相性がよいでしょう。

文字の線が細すぎず、ほどよく丸みのあるものを選ぶと、素朴でかわいい印象にまとまりやすくなります。

背景に木目や淡い色、紙の質感を取り入れる場合も、自然体に見える手書き感が全体の世界観をつなげてくれます。

大人かわいいデザインには細めですっきりした書体

大人かわいい雰囲気を目指すなら、細めの線で、文字の形がすっきり整った手書きフォントがおすすめです。

丸みが強すぎない書体を選ぶと、かわいらしさを残しながらも、落ち着いた洗練感を演出できます。

美容やコスメ、アクセサリー、ファッション、花に関する画像では、繊細な文字が写真の上品さを引き立てやすいでしょう。

特に、淡いベージュ、くすみピンク、グレー、白などを中心にしたデザインには、主張しすぎない文字が似合います。

かわいさを足しすぎず、余白まで含めて見せると、大人っぽい印象を作りやすくなります。

見出しだけを手書きフォントにして、補足する文字はシンプルな書体にすると、きれいめな雰囲気を保ちやすいです。

女子高生風やポップなデザインには丸文字や太めの書体

明るく元気な女子高生風やポップなデザインには、丸文字や太めの手書きフォントがぴったりです。

ぷっくりとした丸みや、マーカーで書いたような太さがある文字は、楽しさやにぎやかさをひと目で伝えやすくなります。

友だちとの思い出、推し活、季節のイベント、プレゼントの紹介など、気持ちを前向きに見せたいテーマにも合わせやすいでしょう。

ハートや星、手描き風の囲み線などを少し添えると、文字のポップさがより引き立ちます。

ただし、装飾の多い文字とカラフルな背景を重ねると、全体がにぎやかになりすぎることがあります。

文字を目立たせたいときは、背景の色数を少なめにします。
かわいいモチーフを使うときは、同じテイストのものに絞ります。
元気な雰囲気にしたいときは、短い言葉を大きく配置します。

ロゴや見出しにはひと目で印象に残る個性的な書体

ロゴや画像のメイン見出しには、少し個性があり、ひと目で印象に残る手書きフォントを選ぶと効果的です。

線の太さにメリハリがあるものや、文字の一部に特徴的な形があるものは、短い言葉でも世界観を伝えやすくなります。

ショップ名、企画名、シリーズのタイトルなど、覚えてほしい言葉に取り入れると、オリジナル感を出しやすいでしょう。

一方で、個性的な書体をたくさんの文字に使うと、デザインの印象が散らばることがあります。

個性の強いフォントは、主役になる言葉だけに使うと、かわいさと見やすさのバランスを取りやすくなります。

迷ったときは、まず「この画像でいちばん伝えたい言葉」を決めてから、その言葉の気分に合う書体を選んでみてください。

SNS画像・バナー・ブログで読みやすく使うコツ

かわいい手書きフォントは、目立たせたい短い言葉にしぼって使うと、読みやすさと世界観を両立しやすくなります。

SNS画像やバナーではひと目で伝わる文字数を意識し、ブログでは本文用の書体と役割を分けるのがコツです。

さらに、文字の大きさと背景との見え方を整えるだけでも、手書き文字の魅力が自然に引き立ちます。

SNS投稿やバナーでは短い見出しに取り入れる

SNS投稿やバナーは、スマートフォンで小さく表示されることも多いため、手書きフォントを使う言葉は短くまとめるのがおすすめです。

たとえば「新作」「お知らせ」「期間限定」「おすすめ」など、内容の入口になる言葉に使うと、視線を集めやすくなります。

手書きフォントは、画像内のすべての文字ではなく、主役のひと言に使うと、情報の優先順位がわかりやすくなります。

補足説明や日時、価格帯、案内文などは、すっきりした書体にすると、読み取るときの負担を抑えやすいでしょう。

手書きフォント：企画名、短いキャッチコピー、感情を伝えるひと言
読みやすい書体：日時、場所、詳細、補足説明
太めの文字：小さな画面でも見せたい重要な情報

画像を作ったら、投稿前に縮小表示して、最初に見せたい言葉が読めるか確認してみてください。

ロゴやチラシではデザインの雰囲気をそろえる

ロゴやチラシに手書きフォントを使うときは、文字だけをかわいくするのではなく、写真、イラスト、色、装飾の雰囲気もそろえることが大切です。

たとえば、やわらかな手書き文字には淡い色合いや丸みのあるイラストがなじみやすく、元気な文字には明るい配色やシンプルな図形が合わせやすいでしょう。

デザインのテイストを二つか三つの要素にしぼると、まとまりのある印象をつくりやすくなります。

目指す雰囲気	合わせやすい要素
やさしい・ナチュラル	くすみカラー、紙や布のような質感、やわらかな線のイラスト
ポップ・楽しい	明るい配色、丸い図形、シンプルなアイコン
大人かわいい	余白を広めに取った配置、落ち着いた色、細めの装飾

反対に、手書き文字、写真、背景柄、イラストのすべてに強い個性があると、伝えたい情報が埋もれることがあります。

ロゴやタイトルを主役にしたい場合は、周りの装飾を控えめにして、文字のまわりに余白を残すとよいでしょう。

ブログ本文では手書き文字を使いすぎない

ブログ本文のように長い文章を読む場所では、手書きフォントの連続使用は控えめにするのが安心です。

手書き文字は親しみを添えやすい一方で、文字数が増えると形の特徴が気になり、読むペースがゆっくりになる場合があります。

本文は読みやすい標準的な書体を基本にして、手書きフォントは見出し、吹き出し、ポイント解説などに使い分けるとバランスが整います。

長文では「かわいさ」よりも「読み進めやすさ」を優先することが、内容をきちんと届けるポイントです。

使いやすい場所：記事タイトル、章の見出し、ひと言メモ、画像内のコメント
控えたい場所：本文全体、注意書き、手順説明、長い引用文

見出しに手書きフォントを使った場合も、本文とのサイズ差をつけると、どこから読めばよいかが伝わりやすくなります。

文字サイズや背景とのコントラストを調整する

かわいい手書きフォントを見やすく見せるには、文字の形だけでなく、文字サイズと背景とのコントラストも重要です。

細い線の書体や淡い色の文字は、写真や柄の上では見えにくくなることがあります。

背景がにぎやかなときは、文字の後ろに半透明の帯や白い囲みを入れると、文字の輪郭を捉えやすくなります。

文字色と背景色は、明るさの差を意識して選び、投稿前には実際に使う画面で確認するのがおすすめです。

画像を少し縮小して、見出しがすぐ読めるか見る
背景の上で文字の線が消えていないか確認する
大事な情報ほど大きく、短く配置する
色や装飾を足す前に、文字だけで内容が伝わるか確かめる

迷ったときは、装飾を増やすよりも、文字を少し大きくして余白を取るほうが、すっきりかわいく仕上がりやすいでしょう。

漢字や記号まで使えるか収録文字を確認する

かわいい手書きフォントは、見た目だけで選ばず、使いたい文字がきちんと収録されているかを確認することが大切です。

ひらがな中心の書体もあれば、漢字・英数字・記号まで幅広くそろう書体もあるため、投稿や画像に入れたい文章を想定して選びましょう。

作り始めてから文字が表示できないことに気づくと、書体の変更やレイアウトの調整が必要になります。

気になるフォントを見つけたら、配布ページの見本や文字一覧で収録範囲を見ておくと、安心して使いやすくなります。

ひらがな・カタカナ・漢字の収録範囲を確認する

手書き風フォントには、ひらがな・カタカナを中心に作られたものと、日常的に使う漢字まで収録されたものがあります。

たとえば「ありがとう」「新作のお知らせ」のような短い言葉なら、ひらがなやカタカナ中心の書体でも表現しやすいでしょう。

一方で、名前・住所・商品の詳しい説明・季節のあいさつなどを入れる場合は、漢字の収録状況が重要になります。

特に人名や地名には、一般的な書体では見かけにくい漢字が含まれることもあります。

使いたい文章を実際に入力して、文字が欠けずに表示されるか確認するのが、もっとも確実な方法です。

使いたい内容	確認しておきたい文字
短い見出し・ひと言メッセージ	ひらがな、カタカナ、よく使う漢字
プロフィール画像・ショップカード	氏名、屋号、地名、数字
イベント告知・案内画像	日時、会場名、曜日、案内に必要な漢字
ブログや説明用の画像	見出しに使う漢字、句読点、かぎ括弧

配布ページに「教育漢字まで」「常用漢字の一部」などの案内がある場合は、目安として確認できます。

ただし、収録される漢字の範囲は書体ごとに異なるため、案内だけで判断せず、必要な語句を試し打ちするのがおすすめです。

旧字体や異体字、少し珍しい漢字を使いたいときは、文字一覧にその字があるかも見ておきましょう。

英数字・記号・絵文字の対応状況も確認する

日本語の手書きフォントを使うときは、漢字だけでなく英数字や記号も意外と大切です。

日付、時刻、価格、アカウント名、ハッシュタグなどを入れる画像では、数字や記号の印象が全体の雰囲気を左右します。

丸みのある日本語文字に対して、英数字だけが極端にかたい印象になることもあるため、見本で組み合わせを確認するとまとまりやすくなります。

数字：0〜9、日付や時刻に使う表記
アルファベット：大文字・小文字、アカウント名や商品名に必要な文字
基本記号：！、？、％、＆、＠、＃、☆、♪
日本語記号：、。、「」、・、〜、ー、（）、［］
通貨や単位：￥、円、℃など、必要に応じた記号

記号は収録されていても、書体によって形や位置が異なる場合があります。

たとえば波線、長音符、ハイフンは似て見えても別の文字として扱われるため、入力したい表記をそのまま試すと安心です。

また、顔文字や絵文字はフォント内に含まれていないことが多く、端末や作成アプリ側の表示に切り替わることがあります。

絵文字まで手書き風にそろえたい場合は、完成画面で見た目を確認してから使うと、文字だけが浮くのを防ぎやすくなります。

収録されていない文字は別の書体で補う

お気に入りの手書きフォントに必要な文字がない場合でも、すべてを別の書体へ変える必要はありません。

足りない文字だけを、雰囲気の近い別の書体で補う方法があります。

このときは、文字の太さ、丸み、線の揺れ方が近い書体を選ぶと、組み合わせてもなじみやすくなります。

まず手書きフォントで、使いたい文章を入力します。
表示できない文字や、形が合わない文字を確認します。
不足部分だけを、読みやすく雰囲気の近い書体に変更します。
全体を少し離れて見て、文字の大きさや太さを整えます。

漢字だけを別の書体にするときは、手書き感が強すぎる書体同士を重ねるより、素直でやわらかな書体を合わせると読みやすくなります。

英数字や記号も同様に、本文用の標準的な書体ではなく、線の太さが近いものを選ぶと違和感を抑えやすいでしょう。

ただし、1つの短い見出しの中で書体を増やしすぎると、まとまりがなく見えることがあります。

基本は「手書きフォント1種類＋補助用1種類」程度に絞ると、かわいらしさと読みやすさのバランスを取りやすくなります。

商用利用やクレジット表記は公式の利用条件で判断する

かわいい手書きフォントを作品づくりに使う前に、配布元が示す利用条件を確認することが大切です。

無料で配布されている書体でも、販売用のデザインや広告、動画などへの利用条件はそれぞれ異なります。

「無料＝どんな用途にも使える」とは限らないため、フォントを入手したページや同梱ファイルにある案内を、使う直前にも見直しましょう。

個人利用と商用利用の範囲を確認する

利用条件では、「個人利用のみ」「商用利用可」「条件付きで商用利用可」など、使える範囲が分けて案内されていることがあります。

個人利用は、趣味の投稿、友人へのメッセージ、家庭内で楽しむ制作などを指すことが一般的です。

一方で商用利用には、商品やサービスの販売につながる制作、集客を目的とした発信、依頼を受けて作るデザインなどが含まれる場合があります。

たとえば、ハンドメイド商品の台紙、ショップのバナー、収益化している動画の文字入れ、企業から依頼された投稿画像などは、事前に確認しておくと安心です。

使い方の例	確認しておきたい点
趣味のSNS投稿	個人利用の範囲に含まれるか
ネットショップの商品画像	販売や宣伝目的での利用が認められているか
依頼を受けたデザイン制作	制作代行やクライアントワークへの利用が可能か
収益が発生する動画・配信	広告収益や案件を含む利用に条件があるか

判断に迷うときは、利用予定の内容を簡潔にまとめて配布元へ問い合わせる方法もあります。

利用条件の記載が見つからない場合は、商用での使用を急がないことが大切です

クレジット表記や利用報告の要否を確認する

商用利用が認められているフォントでも、作者名やフォント名の記載を求めている場合があります。

クレジット表記とは、作品の説明欄や奥付などに、使用した書体の名前と配布元を記載することです。

また、使用前後に連絡すること、利用報告フォームを送ることなどが条件になっているケースもあります。

表記場所や書き方まで指定されている場合は、その案内に沿って記載しましょう。

フォント名のみでよいかを確認する。
作者名や配布ページへの案内が必要かを確認する。
商品ページ、動画概要欄、印刷物の奥付など、表記する場所を確認する。
利用報告が必要な場合は、報告するタイミングと方法を確認する。

クレジット表記が不要とされていても、作者への感謝として紹介することはできます。

ただし、条件にない情報まで無理に載せる必要はないため、まずは公式の案内を優先しましょう。

ロゴ制作・動画・印刷物への使用条件を確認する

ロゴ、動画、印刷物は、同じ商用利用でも個別の条件が設けられやすい用途です。

とくにロゴは、ブランド名や店名を長く使い続けることが多いため、使用できるかどうかが明記されているか確認しましょう。

動画では、収益化の有無だけでなく、タイトル画面、字幕、サムネイルなど、どの部分に使うかまで条件が分かれていることがあります。

印刷物では、販売するカードやシール、冊子のほか、店舗配布のチラシやイベント用の掲示物なども、利用目的に応じて確認が必要です。

また、ロゴをもとに商標登録を検討している場合は、フォントの利用条件に加えて、手続きに関する専門家へ相談する選択肢もあります。

かわいさを活かしたロゴほど、文字の形そのものが印象に残りやすいため、ロゴ利用に関する案内は特に丁寧に読むとよいでしょう。

再配布やフォントデータの加工に関する制限を確認する

フォントは、文字を画像として使うことと、フォントデータそのものを渡すことでは扱いが異なります。

多くの場合、フォントファイルを友人、取引先、購入者などへそのまま渡したり、別の場所で配布したりすることには制限があります。

デザイン制作を依頼されたときも、完成した画像や入稿用データを納品することと、フォントデータを共有することは分けて考える必要があります。

文字の形を変更したフォントデータの作成、改変版の配布、別の書体としての公開についても、認められていない場合があります。

配布ページと同梱の利用条件を保存しておく。
利用する媒体と公開・販売の予定を書き出す。
商用利用、ロゴ、動画、印刷物、再配布に関する記載を確認する。
不明な点は自己判断せず、配布元の案内や問い合わせ先を確認する。

利用条件は更新されることもあるため、以前に使ったフォントでも新しい制作の前に確認し直すと安心です。

作者が定めたルールを守ることで、お気に入りのかわいい手書きフォントを気持ちよく使い続けやすくなります。

Windows・Macに手書きフォントをインストールする方法

かわいい手書きフォントは、配布元からフォントファイルをダウンロードし、WindowsまたはMacの標準機能で追加すると使えるようになります。

基本の流れは「ダウンロードする・圧縮ファイルを展開する・インストールする」の3ステップなので、初めてでも落ち着いて進めれば大丈夫です。

追加したあとに文字作成ソフトへ反映されない場合は、アプリの再起動やファイル形式の確認をしてみましょう。

配布元からフォントファイルをダウンロードする

まずは配布元の案内に従い、使いたい手書きフォントのファイルをダウンロードします。

フォントは「.ttf」または「.otf」という拡張子のファイルで配布されていることが一般的です。

ダウンロードしたファイルが「.zip」になっている場合は、フォントを追加する前に展開する必要があります。

Windowsでは、ダウンロードしたZIPファイルを右クリックして「すべて展開」を選びます。
Macでは、ZIPファイルをダブルクリックすると、通常は同じ場所に展開済みのフォルダが作成されます。

展開したフォルダの中に、フォントファイルのほか、説明書や見本画像が入っていることもあります。

追加するのは文字データである「.ttf」または「.otf」のファイルです。

フォルダ内に複数の書体があるときは、太字用や細字用などをまとめて追加しておくと、デザインに合わせて選びやすくなります。

拡張子	主な用途	パソコンへの追加
.ttf	一般的なフォントファイル	Windows・Macで追加しやすい形式
.otf	一般的なフォントファイル	Windows・Macで追加しやすい形式
.woff／.woff2	Webサイト用のフォントファイル	通常はパソコンのフォントとして追加しない

Windowsでフォントを追加する手順

Windowsでは、フォントファイルを右クリックする方法が手軽です。

ファイルを開いて内容を確認してから追加することもできます。

展開済みフォルダから「.ttf」または「.otf」のフォントファイルを見つけます。
フォントファイルを右クリックします。
表示されたメニューから「インストール」を選びます。
パソコンを使うすべての利用者向けに追加したい場合は、「すべてのユーザーに対してインストール」を選びます。
追加が終わったら、文字作成ソフトのフォント一覧で書体名を探します。

右クリックメニューに目的の項目が見つからないときは、フォントファイルをダブルクリックしてみてください。

プレビュー画面が開くため、文字の雰囲気を見ながら上部の「インストール」ボタンを選べます。

フォント名は、ファイル名と少し異なる場合があります。

たとえばファイル名に作者名やバージョン名が含まれていても、アプリの一覧では書体そのものの名前だけが表示されることがあります。

Macでフォントを追加する手順

Macでは、標準搭載されている「Font Book」を使ってフォントを管理できます。

フォントファイルをダブルクリックする方法なら、操作もわかりやすいです。

展開済みフォルダから「.ttf」または「.otf」のフォントファイルを選びます。
フォントファイルをダブルクリックして、プレビュー画面を開きます。
画面右下の「フォントをインストール」を選びます。
Font Bookに追加されたことを確認します。
画像編集ソフトや文書作成ソフトを開き、フォント一覧から書体名を選びます。

複数のフォントを一度に追加したいときは、Font Bookを開き、フォントファイルをウィンドウ内へドラッグして追加することもできます。

似た名前の書体が多い場合は、Font Bookで表示される見本を確認すると、使いたいかわいい手書きフォントを見つけやすくなります。

追加後に不要になった書体を整理したいときも、Font Bookから管理できます。

反映されないときはアプリの再起動や形式を確認する

フォントの追加が完了していても、すでに起動中のアプリにはすぐ表示されないことがあります。

その場合は、いったんアプリを終了してから開き直すと、フォント一覧に反映されることがあります。

画像編集ソフト、文書作成ソフト、デザインツールを完全に終了して開き直します。
フォント一覧を検索できる場合は、書体名の一部を入力して探します。
「.ttf」または「.otf」のファイルを追加したか確認します。
ZIPファイルを展開せず、そのまま追加しようとしていないか確認します。
同名の古いフォントが入っている場合は、Font BookやWindowsのフォント設定で状態を確認します。

特にWebサイト向けの「.woff」や「.woff2」は、パソコンに追加して文章作成ソフトで使うための形式とは用途が異なります。

パソコンで使う手書きフォントを探すなら、「.ttf」か「.otf」かを最初に確認するとスムーズです。

それでも表示されないときは、パソコンを再起動すると反映される場合もあります。

お気に入りの書体を追加できたら、短い言葉を入力して、文字の大きさや行間を変えながら手書きらしいやわらかな印象を楽しんでみてください。

Google Fontsの日本語手書き風フォントをWebサイトで使う方法

Google Fontsの日本語手書き風フォントは、読み込み用のタグをWebサイトの内に追加し、スタイルシートで書体名を指定すると使えます。

代表的な「Yomogi」は、Google Fontsから配信できるため、フォントファイルをサーバーへアップロードしなくてもWebページに反映できます。

表示する文字数や書体の種類を必要な分に抑えることも、読み込みの負担を軽くするポイントです。

Yomogiなど使いたい日本語書体を選ぶ

まずGoogle Fontsで、使いたい日本語書体のページを開きます。

検索欄に「Yomogi」と入力すると、手書きらしい線の揺れがかわいい書体を確認できます。

見出し用の短い言葉を入力してプレビューし、サイトの写真や配色となじむかを見ながら選ぶとイメージしやすいです。

確認する場所	チェックしたいこと
プレビュー欄	サイトで使う予定の見出しや言葉を入力して、読みやすさを確認する
スタイル	通常の太さ以外に、使いたい太さや字形が用意されているかを見る
文字の表示	ひらがなだけでなく、使いたい漢字・数字・記号も表示できるかを確かめる

Google Fontsの書体ページでは、使用したいスタイルを選ぶと、Webサイトに追加するためのコードが表示されます。

複数のフォントを一度に選ぶこともできますが、最初は手書き風フォントを1種類だけにして表示を確認すると管理しやすいです。

読み込み用の設定をWebサイトに追加する

書体を選んだら、Google Fontsで表示される読み込み用のタグをコピーし、Webサイトの内へ貼り付けます。

たとえばYomogiを読み込む設定は、次のような形です。

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Yomogi&display=swap" rel="stylesheet">

Google Fontsの画面からコピーした内容をそのまま使うと、書体名や指定の間違いを減らせます。

HTMLを直接編集するサイトならタグの中へ追加し、サイト作成サービスやブログでは「ヘッダー用コード」「追加CSS」などの設定欄を確認します。

テーマや編集画面によっては内へコードを追加できない場合もあるため、そのときは利用しているサービスの案内に沿って設定してください。

display=swapは、フォントの読み込みを待っている間も文字が見えやすいようにする指定です。

スタイルシートで表示する書体を指定する

読み込み設定を追加しただけでは、ページ内の文字すべてが自動で手書き風になるわけではありません。

スタイルシートで、手書きフォントを使いたい要素にfont-familyを指定します。

.handwritten-title {
  font-family: "Yomogi", sans-serif;
}

上記の例では、handwritten-titleというクラスを付けた見出しにだけYomogiが適用されます。

HTML側では、たとえば<h1 class="handwritten-title">春の新作アイテム</h1>のように指定します。

本文全体に手書き風フォントを使うこともできますが、長い文章では読みづらく感じることがあります。

サイト名・見出し・ボタンなど、短い文字に絞って使うと、かわいらしさと読みやすさを両立しやすいです。

また、指定したWebフォントが一時的に読み込めない場合に備え、sans-serifのような代替書体も続けて指定しておくと安心です。

表示速度を考えて使用する文字の種類を絞る

日本語フォントは、ひらがな・カタカナ・漢字など多くの文字を含むため、英字だけのフォントより読み込み量が大きくなることがあります。

そのため、必要以上にたくさんの書体や太さを読み込まないことが大切です。

手書き風フォントは見出し用に1種類へ絞る。
使わない太さや斜体のスタイルは追加しない。
本文用には、すでにサイトで使っている読みやすい書体を活用する。
トップページの大きな見出しなど、特に見せたい場所から使い始める。

決まった短いフレーズだけに使う場合は、Google Fontsの指定で使用文字を限定できることもあります。

ただし、あとから文言を変更すると必要な文字が表示されない可能性があるため、更新が多い見出しでは無理に限定しすぎないほうが扱いやすいです。

公開後はスマートフォンでもページを開き、文字が表示されるまでの印象や見出しの読みやすさを確認してみてください。

まとめ

この記事のポイントをまとめます。

かわいい手書きフォントは、ゆるい・ポップ・大人かわいいなど目指す雰囲気で選ぶ
無料で使える日本語対応フォントは、ひらがなだけでなく漢字の読みやすさも確認する
SNS画像やバナーでは、短い見出しに使うと文字が見やすく印象に残りやすい
ブログ本文は読みやすい書体を基本にして、手書きフォントはアクセントに取り入れる
使いたい漢字・英数字・記号が収録されているか、配布ページの見本で確認する
販売用デザインや広告などに使う場合は、商用利用やクレジット表記の条件を確認する
フォントはダウンロード後に展開し、Windows・Macの機能から追加できる
WebサイトではGoogle Fontsを活用すると、日本語の手書き風フォントを取り入れやすい

かわいい手書きフォントは、いつもの投稿やデザインにあたたかさと自分らしさを添えてくれるアイテムです。

まずは作りたい画像や文章に合いそうな書体をひとつ選び、短い見出しから試してみてください。

文字の大きさや色、背景との組み合わせを少し調整するだけでも、ぐっと見やすくかわいい印象に近づきます。

利用条件と収録文字を確認しながら、お気に入りの手書きフォントであなたらしいデザインを楽しんでみてください。