Icons - Material DesignMaterial Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants.
PWAの作り方をサクッと学ぶ - 「ホーム画面に追加」「キャッシュ操作」「プッシュ通知」の実装 - エンジニアHub｜Webエンジニアのキャリアを考える！
PWAの作り方をサクッと学ぶ - 「ホーム画面に追加」「キャッシュ操作」「プッシュ通知」の実装 PWAをテーマにしたコミュニティ「PWA Night」を運営する菅家大地さんが、既存のWebアプリをPWA化する簡単な実装方法を解説します。 はじめまして、菅家（@kan_dai）といいます。普段は株式会社TAMという会社でフロントエンドをメインに、クライアントのWebサイト制作やWebサービスの開発をしています。PWA（Progressive Web Apps）をテーマにしたコミュニティ「PWA Night」の運営もしています。 さて、2018年ごろからPWAという言葉を聞く機会が多くなってきました。2019年現在、毎月コンスタントにPWAに関する仕事の相談を受けるようになっており、PWAへの関心の高まりを感じます。日本経済新聞やスマートフォン版Yahoo! Japanといった有名サービスでの
Googleフォントの使い方: Webフォントの表示の仕組みと最適化
Googleフォントなど、Webフォントのロードはどういう仕組みなのか、どのように対応できるのか、Googleフォントの表示の最適化について紹介します。 当ブログでも日本語のGoogleフォントを導入して、1ヵ月が経ちました。 文字が読みやすくなったという利点は非常に大きいですが、ロードに時間がかかってしまうという欠点もあります。 Web fonts, boy, I don't know キャプチャ: Google Fonts + 日本語 早期アクセス 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Googleフォントのロードに何を注意すべきか Webフォントの実装に役立つリソース Googleフォントの遅延読み込み まとめ Googleフォントのロードに何を注意すべきか 私はロンドンで開催された「Polymer Summit
SVGでプログラマブルな書体を作る話｜dwango creators' blog（ドワンゴクリエイターズブログ）
こんにちは、2016年度にデザイナー職で新卒入社しました@Ln_northです。新卒研修も終わり、現在はOJTのもとで生放送チームにジョインしています。 さて、Googleのロゴが変わっていくらか経ちますが、このロゴはSVGを使うと少ないデータ量で表現できるというニュースが話題になりました。 この記事を見た際に、厳密には視覚調整が入るはずなので、正確に幾何的図形とは一致しないだろうという感想も抱きました。しかし、SVGで文字を生成するということには非常に興味を持ちました。今までにも、文字のアウトラインを使ったアニメーションや表現はありましたが、文字自体を生成するというものは見たことがなく、そしてSVGはJavaScriptで操作することができるため、書体の印象が動的なフォントを作ることができると考えたからです。 どういうことかというと、例えば であるとか、 といったことができるかもしれない
目を引くアイキャッチ画像の作り方、50の作成事例とデザインのアドバイス
あなたのブランドを魅力的に見せるアイキャッチ画像は、非常に大切です。どんなカラーパレットを使うか、どんなタイプのイメージを選ぶか、どんなフォントが一緒に機能するか、デザインのプロセスは多岐に渡ります。 Webページやブログのヘッダ、プロダクトの打ち出し、ブランドのメッセージなど、見た人の印象に残るアイキャッチ画像の作り方、50の作例とデザインする際に役立つアドバイスを紹介します。 Steal These 50 Branding Kits For Your Startup 下記は各ポイントを意訳したものです。 元記事ではアイキャッチ画像と同テイストの名刺も同時に紹介されています。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 Whimsical: サンプル画像 抑えられたトーンとミニマルなタイポグラフィ 画像にソフトなカラーフィルタを使いトーンを抑え目にし、タイポグラフィ
2015年版！漢字が使えて無料日本語フォント５０種
無料で利用することが出来る日本語フォントを ５０種類ご紹介します。 ゴシック系、丸ゴシック系の日本語フォントから 毛筆系や明朝系など、良質な日本語フォントを まとめてみました。 基本的には、個人・商用利用OKの日本語フリーフォントを ご紹介しておりますが、フォントをご利用の際は必ずライセンスや利用規約など それぞれのフォント製作者のページでご確認下さい。 ※追記：2016/1/5 「2016年版！無料の日本語フォント８０種」も是非合わせてお読み下さい。 ※追記：2016/1/20 「2016年版！欧文フリーフォント５０種」も是非合わせてお読み下さい。 ゴシック系の日本語フォント M+ FONTS ⇒ M＋ FONTS 【個人◯ 商用◯】 直線処理と柔らかな曲線の対比が特徴的なゴシック体フォントです。 さざなみゴシック ⇒ さざなみゴシック 【個人◯ 商用◯】 「東風フォント」の代替フォント
ダウンロードしておきたい！フリーのデザインフォントのまとめ -2014年2月
最近リリースされたものを中心に、高品質なフリーのデザインフォント・タイプフェイスを紹介します。 Glober 個人・商用利用無料。thin, boldの2書体。 ※現在プロモーション中で、全18書体が
【完全版】Ligature Symbols フォントセットの自作方法 - くらげだらけ
今月の初めにLigature Icon フォントセットの自作方法とWebFontというエントリーを書きました。これはsymbolsetというサイトにinspireされて、Ligature機能を使ったSymbol Web Fontを自作しようという試みを書いたものです。しかし、この時はsymbolsetで実現されているようなものには及ばない不完全なものになってしまいました。 その後、いろいろと調べたり試したりする中でsymbolset相当のWebFontを自作することが出来ました。今回はそのプロセスと技術的解説について紹介したいと思います。 Ligature Symbols について まずは今回自作したWeb Fontのデモページをご覧ください。 【DEMO】 Ligature Symbols 今回作成したLigature Symbols FontはOFLライセンスで公開しており、ダウンロー
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
商用利用無料！ 毛筆・筆文字、ペン字、マジック、手書きの日本語フリーフォント 総まとめ
TechCrunch | Startup and Technology News
Icons | Font Awesome
商用利用無料！女子高生が書くような文字をイメージしたかわいい日本語のフリーフォント -JKゴシック
高級感のある配色やデザインを作るコツまとめ
場面に合わせて使いわけよう！デザイナーなら知っておきたい、美しい和文フォント10選 - Moxbit
TechCrunch | Startup and Technology News