Adobe MAX Japan 2018の開催に伴い、Creative Cloudの有償メンバー向けに日本語フォント環境がアップデートされました。新作フォント「貂明朝テキスト」、新ゴ・ロダンも含まれた日本語パックなど、CCユーザーは完全無料ですぐに利用できます。 Adobeのフォントはすべて、商用でもクライアントのプロジェクトでも利用できます。ロゴの商標登録、電子書籍への埋め込みなども可です。 ご利用の前に必ず、ライセンスページをご確認ください。 Adobe フォントのライセンス アドビの新作フォント「貂明朝テキスト」 アドビフォントの日本語パック 源ノ角ゴシックのバージョンアップの注意点 アドビの新作フォント「貂明朝テキスト」 まずは、新作フォント。 昨年リリースされた「貂明朝」のより長文に適した本文用のフォントです。 カラーのSVGフォントも含まれており、かわいい貂をはじめ、十二支、太

フォントやデザイン素材を99%オフの特大セールで販売するDesign Cutsから、ついに日本語の有料フォントがセールに初登場です！ 販売期間は、7月31日12時まで。 【朗報】Design Cuts5周年記念で、5日間だけ復活！ 販売期間は、10月16日12時までです。 計233,000円分の日本語の有料フォントが、99%オフの3,200円で購入できます。日本語の有料フォントはWebデザイン、アプリ、動画、ゲーム、紙のデザインなどに利用でき、クライアントのプロジェクトでも販売する同人誌に使用してもOK。 デザインで差がつく日本語フォント集 画像の「豪龍」だけでダウンロード版定価18,000円！ 去年暮れにリリースされたばかりの「バサころ」も定価18,000円！ 一つ欲しいのがあるだけで、充分に元が取れてしまいます。 セットに含まれてる日本語の有料フォント Design Cutsでの購入方

フォントの色というか、塗りはベタが常識でした。 手書き風のフォントでも、隙間があるだけで、ベタ塗りです。 そんな今までのフォントの常識を打ち破る、SVGフォントを紹介します。 SVGフォントの塗りには高精細な水彩テクスチャが使用されており、透明感のある美しい文字が利用できます。

Flat UI Colorsがバージョンアップし、世界各国の有名デザイナーと協力して作成されたフラットなUIデザインに合うカラーパレットを紹介します。 Flat UI Colors 2 カラーパレットはFlat UI Color本家のを含めて、全部で14種類、トータルで280色のカラーがまとめられています。カラーはコピペで簡単に取得することができ、すぐにデザインやプロジェクト、プレゼンに利用できます。 まずは、本家のカラーパレットから。

ビジネス系のサイトをはじめ、ランディングページ、ポートフォリオ、もちろん個人ブログにもぴったりなイラストのSVG素材が無料でダウンロードできるサイトを紹介します。 シンプルでセンスのあるイラストが揃っており、しかもクレジット表記不要の太っ腹ライセンスなので、使い勝手がよいと思います。 unDraw unDrawの特徴 イラストのSVG素材 素材のダウンロード unDrawの特徴 unDrawではランディングページ、スマホアプリ、プロダクトなどで利用できるイラストのSVG素材が無料でダウンロードできます。 イラストのフォーマットは、SVGと透過PNG イラストのテーマカラーは変更可能 MITライセンスで、使用時のクレジット表記は不要 テーマカラーの変更は、オンラインで簡単にできます。SVGだけでなく、PNGにも対応しています。

2017年にリリースされた日本語のフリーフォント、英語のフリーフォントを紹介します。個人でも商用でも無料で利用できるフォントを厳選しました。 日本語のフリーフォント 英語のフリーフォント 日本語のフリーフォント まずは、先日のまとめ2018年用、日本語のフリーフォント312種類のまとめには含まれていないフリーフォントから。 しっぽりアンチック 個人・商用サイトで無料利用可。同人誌や各種印刷物なども可。 しっぽりフォントシリーズ第2弾で、コミック・マンガのセリフや絵本の文に最適なフリーフォント。筆文字感のある正統派アンチック体は、縦書きでも非常に読みやすいデザインになっています。

個人でも商用でも無料利用できる、日本語のフリーフォント332種類を紹介します（公開時より、3+18個増えました）。 ビジネスからプライベートまで、幅広く利用できる無料フォントが満載です！ 去年は260種類だったので、今年は大幅に増えています。 中には、配布先が変更されたフォント、配布終了になってしまったフォント、無料でなくなったフォント、ライセンスが変更されたフォントもいくつかあります。 最新版を公開！フォントの数が大幅に増えています。 2020年用、日本語のフリーフォント 417種類のまとめ 初紹介のフォントから既存フォントも改めてリンク・ライセンスを確認しています（※情報はこの記事の執筆時のもの）。ライセンスはWebデザインだけでなく、同人誌や印刷物などでの利用も確認しました。

IBMと聞くと、ThinkPadを思い浮かべる人も多いと思います。 堅牢な作りは、使用していて安心感・信頼感があり、わたしも長年愛用していました。 そんなIBMから、コーポレートフォントがオープンソースフォントとして公開されました。「IBM Plex」と名付けられたフォントは、カジュアルなHelveticaという位置づけで、さまざまなデザインに合うフォントです。 安心・信頼に加え、洗練された美しさも備えています。 Win/Mac用、Webフォントがダウンロードでき、TrueType, OpenTypeも揃っています。 IBM Type IBM Type -GitHub ライセンスはSIL OPEN FONT LICENSEで、個人でも商用でも無料。Webデザイン、スマホアプリ、ゲーム、動画、紙デザイン、同人誌など、さまざまな媒体で利用できます。 IBM Plexにはサンセリフ、セリフ、モノ

文字をぴったり揃えたのにしっくりこない、正方形なのに長方形に見えてしまう、シャドウを与えていないのにぼんやりとシャドウが見える、ボーダーを加えただけなのに塗りも変わったように見える、そんな経験はありませんか？ WebサイトのUI、アイコン、ロゴ、イラストなどでデザインしている時に誰しも経験したことがあると思います。これらの原因は目の錯覚によるもので、その仕組みを理解することで困惑されることなく、効果的に利用することもできます。 11 Optical Illusions Found in Visual Design by Balraj Chana 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 三角形の交点による錯覚 垂直の水平方向による錯覚 明度による錯覚 奥行きによる錯覚 格子による錯覚 コントラストによる錯覚 カラーによる錯

文字サイズが小さくても、くっきり綺麗に表示されるようデザインされたフリーフォント -Interface font family

何気ない日常の中でも、別の視点から見ることで、印象が変わります。 同じ被写体をアマチュアとプロのカメラマンで、どのように違って見えて、写真が撮影されるのか、印象的な写真を撮る秘訣を紹介します。 Phillip Haumesser Photography Amateur Vs. Pro 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、作者様にライセンスを得て翻訳しています。 約2年前、私は周りの美しさに気づかずに、多くの人と同じように日常の生活を過ごしていました。そんなある日、カメラを手に取り、子ども達の写真を撮り始めると、まったく新しい世界が見え始めたのです。それが見えた途端に、見逃すことができなくなりました。 被写体に光がどのように影響を与えるのかが分かり、同じ被写体でも別の視点から見ることで、全体の印象が変わることに気がつきました。 世界は美しさにあふれ、色鮮やかに伝え

昔懐かしい、懐かしすぎる、GAME BOY版のポケモンで使用されていたフォントを現代のフォントフォーマットにした、オープンソースのポケモンフォントを紹介します。 アンノーンなどの絵文字もあり、なかなか楽しめると思います。 pokemon font pokemon font -GitHub pokemon fontはGAME BOY版のポケモン赤・緑・青・黄で使用されていたフォントの拡張クローンで、Unicodeに対応させたものです。 GAME BOYの画面はドットで構成されているので、表示されるフォントはピクセルフォントですが、現代のフォントはベクターが主流なので、それに合わせて、ベクターで小さな四角形をつくり、フォントにしたそうです。

ルーン文字が大好き！ 魔法陣が大好物な人には激しくオススメです！ 古代ゲルマン人が使用していたルーン文字を現代風にデザインした美しいフリーフォントを紹介します。 フォントにはおまけとして、そのルーン文字を使用して、精密に描かれた魔法陣が含まれています。そのクオリティは、おまけレベルではありません！ しかも、AI, SVGのベクター完備！ ルーン文字フォントと魔法陣のセット 2020/2/7 追記: 同作者による魔法陣のジェネレーターがリリースされました！ 商用利用無料！クリックするだけで、魔法陣を無限に組み合わせて生成できるジェネレーター -daisy bell ダウンロードファイルには、以下が含まれています。 ルーン文字: 8書体 魔法陣: 90ファイル ダウンロードできるファイルのいくつかを紹介します。

Googleフォントを探す時には通常、フォント名やセリフ・サンセリフなど分類するための用語が必要ですが、このオンラインサービスでは特に必要ありません。 フォントの見た目、デザイン面から無料で利用できるGoogleフォントを探すことができるオンラインサービスを紹介します。 better font finder 英語のフォントだけでなく、日本語の有料フォントや無料フォントで、フォント名が分からない時は下記が便利です。 フォント名が分からない日本語・英語のフォントを検索できる無料サービスのまとめ better font finderは先日ローンチしたばかりの無料サービスです。使い方は簡単、登録など面倒なことも不要です。 まずは、サイトにアクセスします。

写真や映画、人気が高いアートなどから学び、それらメディアで異なるビジュアルスタイルに合ったカラーの組み合わせを生成するオンラインツールを紹介します。 カラーセオリーに基づいた学習型のAIで、色の組み合わせをゼロから、そして指定色から作成することができます。

文字や図形、そしてイラストやロゴなどを一筆書きのように、線・ラインで描くSVGのアニメーションが驚くほど簡単に作成できるオンラインツールを紹介します。 下記のように一つずつ順番に描いたり、3つを同時に描いたり、タイミングをずらしたりもできます。 ※キャッチ画像なので、SVGアニメーションをGIFアニメにしたものです。 ラインで描くSVGのアニメーションをいくつか作成してみました。 まずは、SVGファイルを用意します。 シンプルな図形を描いたSVGのキャプチャ ※キャプチャなので、PNG画像です。 3つの図形を順番にラインのアニメーションで描いてみます。 イラストやモックアップをラインで描くアニメーションをよく見かけますね。

ブラウザごとに異なるHTMLの各要素のスタイルを消去（Reset）するのではなく、スタイルを正常化（Normalize）するNormalize.cssが、2017年3月26日にアップデートされました。 2016年10月3日リリースされたv5.0.0から、いくつか重要な変更点があります。 Normalize.css Normalize.css -GitHub Normalize.cssの特徴 Normalize.css v6.0.0のアップデート内容 v5.0.0からの変更箇所 Normalize.cssの特徴 Normalize.cssとはブラウザごとに異なる要素のスタイルの相違を吸収し、各要素のデフォルトのスタイルを提供する小さなCSSファイルです。HTML5にも対応しており、従来のCSSリセットに代わるものです。 有用なデフォルトはそのまま 多くのリセット用スタイルシートは異なり、有用

オリジナルのアイコンを作るシンプルで簡単なデザインテクニックを紹介します。 円や矩形などの基本的な形を組み合わせたり、変形させたりして、さまざまなアイコンを作成します。 作業に慣れてしまえば、どれも1分もかからずにアイコンを作成できます。 The Super Simple Guide to Iconography 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 目のアイコンの作り方 矢印のアイコンの作り方 バッテリーのアイコンの作り方 箇条書きリストのアイコンの作り方 クラウドのアイコンの作り方 次に進むのアイコンの作り方 ファンネルのアイコンの作り方 プレイ・ポーズのアイコンの作り方 位置矢印のアイコンの作り方 位置ピンのアイコンの作り方 サウンドのアイコンの作り方 ウェーブのアイコンの作り方 Toptalのアイコンの作り方

フォントサイズをレスポンシブ対応で変化させるには通常、スクリーンのサイズごとに数種類のフォントサイズを用意していると思います。 CSSだけで、ルートのフォントサイズを元に最小値と最大値を指定し、その間のサイズはビューポート幅（vw）に対して自動で変化させるテクニックを紹介します。