WEB掻っ穿じり

WEBデベロッパー備忘録とチャリ

貂明朝リリース さっそくweb fontで使ってみる

  category:general

11/28 Adobe MAX JAPAN 2017で発表されたAdobeの新いフォント、『貂明朝(てんみんちょう)』。

貂明朝1

貂明朝2

アドビのチーフタイプデザイナーである西塚涼子氏がデザインした、アドビオリジナルの新しい和文書体で、明朝体をベースにしており、鳥獣戯画で描かれたイタチ科の小動物「貂(てん)」の姿にもインスパイアされているんだそう。

フォントの中には貂の姿をしたグリフ(絵文字)も隠されています。

LOVE

☀ ☁ ☂ ☃ ☜ ☝ ☞ ☟ 〠 〽︎

かわいいので早速Webフォントで使ってみました。

Typekitの書体ライブラリから貂明朝をWebフォントで利用する

Creative Cloudユーザーであれば無料でTypekitの書体ライブラリーから同期すればデスクトップフォント、Webフォントで利用可能。

Web サイトへのフォントの追加の手順で登録することができます。 ドメインを登録しキットを作成、下記のような埋め込みコードを<head>内に追加します。

        
        
        

そしてcssで目的のセレクタにfont-familyプロパティにten-minchoを指定します。

        body {
          font-family: "ten-mincho", serif;
        }
        

全角の,,,を貂の姿をしたグリフ(絵文字)使う場合は以下のように設定。

        body {
          font-family: "ten-mincho", serif;
          font-feature-settings: "ss02";
        }
        

主要なブラウザで動作、今後…

和文書体である貂明朝の漢字は、JIS X 0208の第一水準と第二水準の漢字、最新の常用漢字と人名用漢字の文字集合を含む6,469文字が含まれています。

2018年には色付きのSVGグリフにしたバージョンの貂明朝が2018年には導入される予定で、貂明朝のOpenType Collection(OTC)版も入手可能となるが、源ノ明朝や源ノ角ゴシックのようなオープンソースのOTCフォントとは異なって有償での販売だけの製品になるとしています。

すでにローンチされているwebフォントはChrome、Firefox、Safari、Edge、iOS Safari、Android Chrome、で動作します。

当サイトも源ノ角ゴシックから貂明朝に試しに変更してみました。

comments powered by Disqus