使い方

カテゴリと文字種は「1つだけ」

2 列のタグは複数選択できそうに見えますが、各列で有効なのは常に 1 つです。別のタグを押すと切り替わり、「すべて」でその列の絞り込みを解除します。

ポイント: 2 列は AND 条件です。「等幅」かつ「繁体字中国語」といった指定ができます。

プレビュー文字は自由に変えられます

検索欄の下の入力欄は検索ではなく「プレビュー文字」です。入力した文字がすべてのカードに反映されるので、自分のブランド名やコピーで見比べられます。

ポイント: 入力が止まってから約 0.5 秒後に反映されます。画面外のカードはスクロールして見えたときに更新されるので、不具合ではありません。

絞り込み結果はそのまま共有できます

絞り込み・検索・並べ替えのたびに URL が更新されます。その URL を渡せば相手も同じ一覧を見られます。

カード全体がリンクです

フォント名を狙う必要はなく、カードのどこを押しても詳細ページへ移動します。

ポイント: 右上の星だけは例外で、押すとお気に入りに追加されページ遷移しません。

フォントはスクロールに応じて読み込まれます

トップページを軽く保つため、各カードは表示直前になってからフォントを読み込みます。速くスクロールすると一瞬だけ代替フォントで表示されることがあります。

デモサイトで実際の組版を確認

疑似ブラウザ内にナビゲーション・ボタン・フォーム・表・数字があり、実際の画面での見え方を判断できます。

ポイント: ボタンやフォームは意図的に静的なサンプルで、押しても反応しません。

サンプル言語の切り替え

複数言語に対応したフォントでは、日本語・繁体字中国語・英語を切り替えるボタンが表示されます。1 言語のみの場合は表示されません。

埋め込みコードをコピー

ページ下部に HTML の `<link>` と CSS の `font-family` が用意されており、それぞれコピーボタンが付いています。

前へ／次へは一周します

下部のボタンは全フォントを固定順で巡回し、最後まで行くと最初に戻ります。

ポイント: この順序はサイト共通で、トップページでの絞り込みとは関係ありません。

何をするツールか

複数のフォントを 1 つの font-family に組み立てます。ブラウザは 1 文字ごとにリストを左から見て「その文字を持つ最初のフォント」を使うため、並び順が和欧混植の見た目を左右します。

ポイント: 定番は「欧文フォントを先、日本語フォントを後」。英数は美しい欧文字形、日本語は自動的に日本語フォントへ落ちます。

プレビューは直接編集できます

中央の大きな文字の枠はクリックしてそのまま入力できます。書き換えると下の 2 列の比較も即座に追従します。

並べ替えは矢印ボタンで

リストの各行に上へ・下へ・削除のボタンがあります。ドラッグ＆ドロップには対応していません。

組み合わせは URL で共有できます

組み立てた内容はそのまま URL に反映されます。「この組み合わせを共有」でリンクをコピーすれば、相手も同じ並び順で開けます。

ポイント: URL に入るのはフォントの並び順だけで、サイズとウェイトは含まれません。

クイック例は現在の組み合わせを上書きします

2 つの例ボタンは、組み立て済みの内容に追加するのではなく置き換えます。

サイズのスライダーはプレビューのみ

下の比較 2 列は字形の違いに集中できるよう固定サイズのままです。

お気に入りはブラウザ内にのみ保存されます

登録もアップロードも不要で、この端末のブラウザに保存されます。端末やブラウザを変えたり、閲覧データを削除すると失われます。

ポイント: 同じブラウザの複数タブ間では即座に同期します。

2 つ以上で左右比較が使えます

2 つ以上お気に入りに入れると 1:1 比較が可能です。同じデモ内容を左右に並べ、一緒にスクロールするので段落が常に揃います。

言語の選択肢は自動的に絞られます

サンプル言語は「両方のフォントが対応する言語」のみ表示されます。片側を変えると選択肢が減ることがあります。

全消去は 2 回押します

「お気に入りを消去」は 1 回目で「本当に消しますか？」に変わり、もう一度押すと実行されます。5 秒操作しないと元に戻ります。

ダーク／ライトテーマ

初期状態では OS の設定に従います。右上のテーマボタンを一度押すと、以降はその選択が優先されます。

言語

初回にトップページへ来たときはブラウザの言語に合わせて自動で切り替わります。メニューから一度言語を選ぶと、以後は自動切り替えされません。