font-familyの中の、どのフォントが選択されているかわかるツール「What font」

未分類

困ったこと

Walicaの開発で、下記のようにフォントを刷新した。

font-family: 'Hiragino Kaku Gothic Pro', 'Meiryo', 'Yu Gothic', "Segoe UI", "Helvetica Neue", -apple-system, BlinkMacSystemFont, sans-serif !important;

ブラウザで確認したものの、正直目で見てもデザイナーの指定したフォントが適用されているかわからない。
ちなみに、Chromeの開発者ツールを見ても、下記のように指定したスタイルがそのまま表示されているだけなので、結局どのfont-familyが選択されているかわからない

WhatFontでフォントを確認

「これは自分が困っているだけなのか。。?」と調べてみると、WhatFontというChromeのExtension(拡張機能)が見つかった。

インストールして、拡張機能のアイコンをクリックすると、ブラウザ内の文字のフォントを教えてくれるポップオーバーが出るようになった。

ポップオーバーがやや奇妙な振る舞いをするものの、便利に使えそうなのでメモ代わりに記事を残す。

自分の気になったサイトのフォントを見たりするのにも使えるので(むしろそっちがメイン?)、デザイナーにもおすすめできそう。

開発者に感謝

未分類

Posted by kyogom