タグ

web-fontに関するFalkyのブックマーク (9)

  • Webフォント TypeSquare

    TypeSquareは新規会員登録やプランの新規購入を終了し、今後の新書体も含めて書体の追加や更新を予定しておりません。サービス終了に関する今後の予定や詳細はこちらをご覧ください。 後継サービスのMorisawa FontsのWebフォントをご検討ください。 TypeSquareからの移行についてはこちらをご覧ください。 UD新ゴ M Webフォントは新たな 表現力を提供する 文字が伝えるものは言葉の意味だけではなく、用いられる書体によりその印象は大きく異なります。 ウェブデザインにおいて、さまざまな書体の中から目的に合った Webフォントを選び出し、的確に使うことが必要になります。 リュウミン R-KL Webフォントは新たな 表現力を提供する 文字が伝えるものは言葉の意味だけではなく、用いられる書体によりその印象は大きく異なります。 ウェブデザインにおいて、さまざまな書体の中から目的に

    Webフォント TypeSquare
    Falky
    Falky 2016/11/09
    日本語ウェブフォントを実際に任意のサイトに適用してプレビューできるツール
  • リガチャなアイコンフォントをお手軽に作成する - アインシュタインの電話番号

    リガチャなアイコンフォントを自作しようとするとけっこう大変そうで、そのためのアプリを揃えて操れるようになったり、リガチャの仕様を把握したり、専用のCSSを書いたりする必要がある。そういった正攻法のやり方としては、このページがとてもわかりやすかった。また、実際にそのページの方法によって制作されたLigature Symbolsも魅力的。 ところが自分が欲しいのは、Twitterで使っているアバターアイコンと、ブログのボタン等で使う5〜6個のアイコンを含んだ最小のセットで良くて、そのために前述のような気を出して作るのは、なかなか重い腰があがらずにいたところ、アイコンフォントを手軽に生成できるサービスIcoMoonの中に、そのリガチャを作成する機能もあることに気がついた。^1 それを使ってみたら、予想以上に簡単にリガチャなアイコンフォントをサクッと作れた。 上のはそのIcoMoonを使って作っ

    リガチャなアイコンフォントをお手軽に作成する - アインシュタインの電話番号
  • Webフォント TypeSquare

    TypeSquareは、2025年11月25日をもって新規会員登録やプランの新規購入を終了しました。 新規のご契約は、後継サービスのMorisawa FontsのWebフォントをご検討ください。 TypeSquareでは今後の新書体も含めて、書体の追加や更新は予定しておりません。 サービス終了に関する今後の予定や詳細についてはこちらをご覧ください。 UD新ゴ M Webフォントは新たな 表現力を提供する 文字が伝えるものは言葉の意味だけではなく、用いられる書体によりその印象は大きく異なります。 ウェブデザインにおいて、さまざまな書体の中から目的に合った Webフォントを選び出し、的確に使うことが必要になります。 リュウミン R-KL Webフォントは新たな 表現力を提供する 文字が伝えるものは言葉の意味だけではなく、用いられる書体によりその印象は大きく異なります。 ウェブデザインにおいて、

    Webフォント TypeSquare
    Falky
    Falky 2014/04/09
    無料でバナー無しで1書体いける
  • M+Web FONTS Subsetter

    M+Web FONTS SubsetterこのWebアプリケーションはM+ OUTLINE FONTSのサブセットを生成するツールです。 生成したフォントはWebフォント(woff形式,eot形式,ttf形式)としてそのまま利用できます。 M+ OUTLINE FONTSとはM+ OUTLINE FONTS はコンピュータなどでの個人利用をはじめ、商業目的での利用、フォント内容の改変、改変後の再配布にも制限の無い、自由なライセンスで公開されているアウトラインフォントです。 詳細はこちら

  • ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ

    fonts.comの日語Webフォント「AXISフォント」を導入してみたら、学生さんから「どんなフォントを使っているのですか?」と質問が来たのでブログ記事にしてみます。 海外のWebフォントサービスです。海外のベンダーさんには珍しく日語Webフォントを扱っています。ちなみに、日語にローカライズされていますが、翻訳がものすごく変です。 取り扱っている主な日フォントは次の通りです。 AXISフォント(AXIS株式会社) ダイナフォント(ダイナコムウェア株式会社) イワタフォント(株式会社イワタ) モトヤフォント(株式会社モトヤ) 変わったフォントとして、なぜか「MS ゴシック」「MS 明朝」シリーズも取り扱っています。 fonts.comを使ってみるときに知っておく点がいくつかあります。 無料で使えますが、バナーが表示されます。そして、日語Webフォントは使えません。 有料プランに

    ゆめいろデザイン|ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ
    Falky
    Falky 2014/04/09
    fonts.comってAXIS使えたのか!知らなかった!ちゃんとCondensedなんかもあるぞ!!
  • Glyphs Miniでアイコンフォントを作る方法 - MEMOGRAPHIX

    アイコンをwebfontにするの、数年前から流行ってて、確かに便利ということがある。[Font Awesome](http://fontawesome.io/)とかが有名。 アイコンフォント、自分でも作れそうだったので作り方まとめた。 ## 用意するもの - [Glyphs Mini](https://itunes.apple.com/jp/app/glyphs-mini/id469036911?mt=12&uo=4&at=11l8Mb) - Adobe Illustrator Glyphs Miniはフォント作るアプリ。Mac App Storeで買える。 具体的な手順1.Illustratorの準備1792*1792pxのドキュメントを新規作成する環境設定 -> ガイド・グリッド で、グリッド128px、分割数2にする 「グリッドを表示(⌘+¥)」するアートボードにグリッドが14マスで

  • Montserrat - Google Fonts

    The old posters and signs in the traditional Montserrat neighborhood of Buenos Aires inspired Julieta Ulanovsky to design this typeface and rescue the beauty of

    Montserrat - Google Fonts
    Falky
    Falky 2013/05/27
    LIGで数字に使ってた。かわいい
  • Get Started with the Google Fonts API  |  Google for Developers

    Get Started with the Google Fonts API Stay organized with collections Save and categorize content based on your preferences. outlined_flag Add Google Fonts to your webpage by adding a stylesheet link in your HTML and referencing the font in your CSS. You can request multiple font families and specific styles or weights within the stylesheet URL. Use the font-display parameter to control font loadi

    Get Started with the Google Fonts API  |  Google for Developers
    Falky
    Falky 2013/03/23
    Google Font APIは、必要な任意の文字だけをリクエストすることで最適化できる。1グリフだけ持ってくるとか。
  • 安全な@font-faceの書き方(抄訳)

    Internet Explorerではかなり昔からあった埋め込みフォント(@font-faceによるフォントの参照)の機能は、Safari 3とFirefox 3.5で有効になったことから急速に話題になることが増えた。ようやく時代がMicrosoftに追いついてきた感じですね。その書き方は大筋では一緒なのだが、細かな仕様の違い、というかIEがEmbedded OpenTypeしかサポートしていないことから工夫が必要になる。その工夫をBulletproof、つまり将来にわたって安全であろうという観点で短くまとめたBulletproof @font-face syntaxというすごく参考になったエントリがあったので訳しておく。語調などは超訳なので、原文とニュアンスが変わっているかもしれない。 安全な@font-faceの書き方 以下は訳注と私見。 条件付コメント 面倒くさいというのはわからなく

    安全な@font-faceの書き方(抄訳)
    Falky
    Falky 2012/06/30
    どうもOperaとIEで動いていないような気がするのだがよくわからない。
  • 1