【約物半角専用フォント】Yaku Han JPでウェブデザインを美しく

2025年4月27日

Webサイトやデザイン制作をしていると、日本語の文章で句読点（、や。）だけが妙に大きく見えること、ありませんか？
そんな悩みを解決してくれるのが、Yaku Han JPです！

この記事では、やくはんフォントの特徴や使い方、どんな場面におすすめかをまとめました。

約物だけを半角にする理由

日本語のデザインやレイアウトでは、

といった問題が起こることがあります。
これを防ぐために、約物をコンパクトに見せると、
✔️ 文章のリズムが良くなる
✔️ デザインがスタイリッシュになる
✔️ 読みやすさがアップする
というメリットがあります。

やくはんフォントは、日本語フォントの中で、「約物」だけを半角にした特殊なフォントです。

「約物（やくもの）」とは、
、。！？〈〉《》「」『』【】〔〕・（）：；［］｛｝
など、文章の中に登場する記号類のことを指します。

普通の日本語フォントでは、これらも全角幅（＝大きめ）ですが、
Yaku Han JPを使うと、約物だけスマートに半角幅で表示されます！

Yaku Han JPは、公式サイトからダウンロードできます。
Yaku Han JP 公式サイト

👉 単体で使うのではなく、通常の日本語フォントに合成して使うイメージです。

<!-- HTML：CDNリンクを貼り付け -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/yakuhanjp@4.1.1/dist/css/yakuhanjp.css">

CSSでフォントを指定する時に、Yaku Han JPを組み込む形で指定します。
例えば、こんな感じ👇

// CSS：font-familyを設定
.example {
  font-family: YakuHanJP, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;
}

font-familyは先頭から順に優先されるため、約物のみ「Yaku Han JP」に変換されます。
ゴシック体以外にも明朝体、丸ゴシックも用意されているので指定しているフォントに合わせて変更してみてください。

日本語の文章を「ちょっと洗練された印象にしたい」と思ったら、Yaku Han JPをぜひ試してみてください！
CSS1行追加するだけで、文章全体の見た目がぐっと引き締まりますよ✨