無料で商用利用可能な「けいおん！」のロゴ風フォント「けいふぉんと！」 - GIGAZINE
かきふらいさん作の人気四コマ漫画「けいおん！」のロゴタイプをヒントに作成された、無料で商用利用も可能なフォントが「けいふぉんと！」です。ロゴのトレースなどは一切行っていないそうで、「け」「い」「お」「ん」の四文字も実際のロゴとは若干異なるものになっているとのことですが、フォントは全体的にポップな印象で「けいおん！」のイメージを見事に再現しています。 無料のポップ体フォント「けいふぉんと！」 http://font.sumomo.ne.jp/index.html フォントをインストールして使用したい場合は、上記ページの上部にある「K-Font! Download」をクリック。 「ダウンロード」をクリック。 次に「OK」をクリック。 ダウンロードした「keifont.zip」ファイルを、「Explzh」などを使って解凍。 解凍したファイルの中にある「keifont.ttf」をクリック。 そして
いまさらだけど、font-sizeを比較してみた - entacl Lab.
css font 投稿日： 2012.09.27 投稿者： 小平 yahoo YUIファンは、パーセントかな？ ピクセルはもうなかなかいないのかな？ emでやってると、結構らくちんなのかな？ remでやってるのは、css3できりすてなのかな？ などなど 思っていたら比較してみよってことで比較しました。 font-sizeの種類比較 各デモもつくってみました、なんとなくですがw ブラウザ間にてもきれいにサイズは表示できるようしている状態です。 ピクセル - px 往年のご隠居的存在ですね あえてピクセルを使う必要ってないですよね メリット ピクセルの世界のweb屋にとってはわかりやすい デメリット IEで文字拡大できない パーセント yahoo!YUIリセットcssなどを使用している場合は、わかりやすそうです。 とりあえず、↓のcssをデモしてみました→ body { font-size:
HTML5, CSS3, jQueryを使用したフロントエンド開発用のフレームワーク -G5 Framework
CSSのキャッシュ対策 クロスブラウザ対応の角丸、ボックスシャドウ、不透明 ショートハンドCSS、再利用可能なclass ページ下部に固定表示されるSticky Footer CSS（Reset関連） リセットはHTML5ベースのEric Meyer's Reset Reloaded フォントのノーマライゼーション Webkit系ブラウザのフォントのスムージング フォーススクロールバー ラベルの一列化 クリック可能なインプット要素 スクリーンリーダー対応 IE7のイメージリサイジング 印刷時のスタイル X(HTML) クリーンなコード構造 コンテンツ幅は940px F型レイアウト 古いバージョンのIEからイメージツールバーの削除 最新のIEのレンダリングエンジン jQuey 1.5.2ベース（1.4.4も可） ページ上部へスムーズにスクロール HTML5のプレースホルダー機能 ナビゲーショ
数多くの無料アイコンから必要なものだけをセットにして、軽量化されたWebフォントやSVGを作成できるサービスのまとめ
セットになったアイコンはデザインが統一されており、それはそれで便利ですが、全部のアイコンを使うことはほとんどないと思います。 自分が必要なアイコンだけをセットにし、軽量化されたセットにして、WebフォントやSVGとして利用できるオンラインサービスを紹介します。 用意されたアイコンからセットを作ってもよし、自分のアイコンを加えてセットにすることもできます。 flat icon フォーマット：font(woff, eot, ttf, svg), png, svg, eps, psd 462種類のパック、55,000個のアイコンから使用するアイコンだけを選択し、セットにすることができます。チェックしたアイコンはクッキーで保存されているので、ログインしないでも利用できます。
パワーポイントや同人誌などでの見栄えがグッとよくなる日本語のフリーフォント -源真・源柔ゴシック
自家製 Rounded M+の作者様がこの夏、新たにリリースされた普段使う時でも見栄えがグッとよくなる日本語のフリーフォントを3つ紹介します。 もちろん個人でも商用でも無料で、Webでも紙でも利用でき、成果物またはその派生成果物のコピーを複製したり頒布することもできます。 源真ゴシック・源柔ゴシックは先日Adobeからリリースされた「源ノ角ゴシック」をベースに、ビジネスやホビーなどでの使い勝手を重視し、細部を改善したフリーの日本語フォントです。 フォントはOpenTypeではなくTrueTypeで用意されているので、パワーポイントのスライドなどにもフォントの埋め込みができるようになっています。 パワーポイントのスライドにフォントを使用 プロポーショナルフォント（等幅フォントも）が用意されているので、そのまま文字を入力するだけで、間延びせずいい感じに詰められて表示されます。 「フリーフォント
私のブログカスタマイズと、Webデザイン独学方法まとめ（初心者向け） - にんじんの塔
／^o^＼ヤッホォ！みんなー！久しぶりに普通の文体が続いてびっくりしたかー！？ 普通の文体で書くと、むしろ「完璧な文章などといったものは存在しない。完璧な絶望が存在しないようにね」って言葉を思い出しちゃう私だよ！やれやれ。（風の歌を聴け☆） さて、今日は個人的まとめなので雑で～す(∩^o^)⊃━☆ﾟ.*･｡ﾟ そして初心者向けだよー。本当はライブドアブログ（人参より茄子が好き）で書こうと思ったのですが、はてなブログはリンク機能がすんばらしいので、はてなブログで書きますね。暑いのでトマトを食べながら阿波踊りしています。 ◆ブログカスタマイズ テキストサイトや、MovableTypeやWordpressでブログをやっていた頃は凝っていたけれども、通常のブログサービスを使う場合、いろいろデザインするのダルいので、提供されているものの中から使います。 ヘッダ画像のインパクトが強いと他のブログと印象
Noto Fonts - 全ての言語をサポートする美しいフォント
オープンソースの日本語フォントは選択肢がとても少ないです。Webシステムと組み合わせたり、Web Fontとして安心して使える日本語フォントがあれば、Web上での表現も向上するでしょう。 そこでGoogleとAdobeが協力して開発されたフォントがNoto Fontsです。英語だけでなく、アラビア語や日本語、韓国語、中国語もサポートされたフォントになります。 Google Noto Fontsの使い方 幾つかのフォントデザインを見ていきます。 Noto Fontsのコンセプトは美しく、かつフリーなフォントを全ての言語にとなっています。それに恥じない美しさ、読みやすさをもったフォントだと思います。Webシステムと連携して文字を出力したり、Linuxなどで使うと良さそうです。 Noto FontsはApache License 2.0のオープンソース・ソフトウェアです。 Google Noto
2014年上半期、日本語の 新作フリーフォントのまとめ -商用サイトだけでなく紙・同人誌の利用も明記！
2014年にリリースされた漢字・ひらがな・カタカナが使える日本語のフリーフォントを紹介します。 使えるフォントのバリエーションが増えると、デザインの幅が広がりますね！ 最新版を公開！フォントの数が大幅に増えています。 2019年用、日本語のフリーフォント 366種類のまとめ 各フォントの個人商用利用、同人誌など各種印刷物での利用、ライセンスを明記しました。ご利用の際にはライセンスを必ずご確認ください。 源ノ角ゴシック（Source Han Sans） 個人・商用利用無料（Apache License 2.0）、同人誌や各種印刷物なども可。 Adobeによる4番目のオープンソースフォントで、日本語・韓国語・中国語（繁体/簡体字）など複数の言語、50万のグリフに対応したサンセリフゴシック体。ExtraLight, Light, Normal, Regular, Medium, Bold, He
トータル56,000円以上の有料フォントやグラフィック素材が無料でダウンロードできます！
先日、Twitter（@colisscom）でお知らせしたプレゼント！ InkyDealsさんとコリスの初コラボ、日本では初かな、という訳で、コリスのビジター全員にトータル56,000円以上（$558分）の有料フォントやグラフィック素材が無料でダウンロードできます！ ※$558はこれを書いている現在、日本円で56,643円です。 ダウンロードできる素材には、計471のリソースが入っています！ ↑のキャプチャにあるように、フォント、テクスチャ、インフォグラフィック、アイコン、バッジ、WordPressのテーマ、モックアップ、Photoshopのアクションなど、さまざまなものが揃っています。 ライセンスは基本的には全て、個人でも商用でも無料で利用でき、販売や再配布は禁止です。ご利用時には個々のライセンスをご確認ください。 素材の詳しい紹介は後にして、まずはダウンロード方法から紹介します。 下記
CSSの詳細度をうまく操る - ワザノバ | wazanova
http://csswizardry.com/2014/07/hacks-for-dealing-with-specificity/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約4時間前 Harry Robertsがブログで、CSSのプロジェクトをうまくスケールさせるためには、詳細度の影響をうまく抑えて、メンテナンス性を高めることがポイントだと解説しています。 どれだけ思慮深くソースの順や継承関係を整理しても、詳細度がトリガーになった上書き起きると、それまでの努力が台無しになる。詳細度のタチが悪いのはオプトアウトできないこと。 であるが、その悪影響をうまくコントロールする策としては、 CSSにおいてセレクタとしてIDは使わないこと。クラスを使うことを上回るメリットはない。そもそも、IDでできることはクラスで
見ないと絶対損する！プレゼン資料の印象がグッと上がる良質記事10選 | SIROKグロースハックブログ
誰もがかっこいいプレゼン資料をつくりたいと考えていますが、とても難しいことです。今回はプレゼン資料の印象を簡単によくする方法について書かれた記事をまとめました！ 伝わるデザイン｜研究発表のユニバーサルデザイン どうすれば伝えるデザインにできるかについてとても分かりやすく説明されています ビジネスデザイナーZIBA濱口秀司さん のシンプルな図解とフレームワーク プレゼンにも活かせるシンプルで伝わる図解について分かりやすく書かれています。 パワポでの提案書作りに役立つデザイン基礎知識まとめ 時間をかけずに優れたプレゼンを作れる方法が載っています。ビジネスマンにおすすめです プレゼン資料の印象がグッと上がるフォントの法則 フォントの使い方一つでプレゼンの見た目が大きく変わります。 [Webデザイン] 文字組みについて本気出して考えてみた 文字組みの仕方でプレゼンの印象は大きく変わります レイア
プログラマー向け最強フォント「M+」 | ソフトアンテナ
プログラミングに最適なフォントは何でしょうか。海外のブログ記事「The Best Font for Programming: M+」にて、プログラマー向けのベストフォントとして「M+」フォントが推奨されていました(Reddit)。 ブログによるとRetinaディスプレイのような高詳細ディスプレイで使うのに具合がよく(低解像度ではTerminusフォントが推薦されています)、0(ゼロ)とO(大文字のO)のような紛らわしい文字がはっきり区別できる点がお気に入りポイントの様子。 ↑このように。 実は、M+フォントは日本人が開発している日本語対応のフリーフォントです。海外発のフォントの場合アルファベットの見栄えはよくても日本語と合わせるとどうも…といったことが起こりがちですが、M+フォントだとそのような心配は不要だと思います。日本人開発者なら使わない手はないかもしれません。 M+フォントは、個人利
細身のラインが特徴のフォントまとめ「21 Light & Ultra-Thin Fonts for Your New Designs」
フォントを使用する場所やデザイン感によって、ウェイトやフォント自体の太さを使い分けることで強弱をつけることができます。そんな中今回紹介するのは、細身のラインが特徴のフォントまとめ「21 Light & Ultra-Thin Fonts for Your New Designs」です。 Party at Gatsby's font by tysmagic – FontSpace 繊細なラインで構成されたデザイン性の高いフォントが多数まとめられています。 詳しくは以下 QUARZ 974 Light | Free Font on Behance 記号のような独特の形状のフォント。グラフィック的に使用しても個性を発揮してくれそうですね。 Print Clearly Font | dafont.com 通常版の他、破線で表現できるタイプも選択できるフォント。繊細でありながらも独創的なデザインを作成
少しのコードで実装可能な20のCSS小技集
2019年5月17日 CSS CSSハックに続き、このCSS小技集も私のブックマークにずらりと並んでいたので、整理も兼ねて記事にしてみました。CSSのお勉強を始めたばかりの頃にブックマークしておいたものも多数。。ということで初心者さんからベテランさんまで参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ コードはサンプル内の「HTML」や「CSS」タブをクリックしてくださいね！ 少しのコードで実装可能なCSS小技集 シリーズ 【第2弾】少しのコードで実装可能な20のCSS小技集 【第3弾】少しのコードで実装可能な15のCSS小技集 まずはCSS基礎編 1. divを中央揃えにする ほとんどのサイトが基準となるdivを画面の中央揃えに設定しています。左右のmarginをautoにして中央揃えに。 See the Pen Center Div by Mana (@manabox
デザインの幅が広がる！ダウンロードしておきたい今月の新作フリーフォントのまとめ -2014年6月
最近リリースされたものを中心に、高品質なフリーのデザインフォント・タイプフェイスを紹介します。 使い勝手のよいセリフ系のフォントをはじめ、遊び心あふれるデザインフォントまで、今月も豊作です。まずは、ウェイトが豊富に揃っているサンセリフフォントから。 Fira 3.1 個人・商用利用無料。 19書体（＋イタリック）が揃ったOpenTypeフォント。よく使うLight, Book, Medium, Regularだけでなく、Extra bold, Heavy, Ultraなどの太字、Extra Light, Thinなどの細字、更に細いHair、そしてHairよりも更に細いウェイトも。 また、それぞれWebフォント用の.eot, .woff, .ttfもダウンロードできます。
Web制作者が捗る！知識が増える2014年トレンドまとめ
作成：2014/06/9 Web制作 > トレンド感のある動きや、洗練された見え方を実現するために、知っておきたいことや方法など。Web制作の現場で知っておくべきことをまとめました。全部取り入れるのは無理ですが、押さえておくことで今以上に見栄えのするサイトを作れると思います。ここ最近のトレンドをおさらいしたいときに。 エンジニア速報は Twitter の@commteで配信しています。 もくじ ファーストビューで使いたいエフェクト １．ロングシャドウ ２．ポリゴン ３．ラージフォトスタイル ４．ブラーエフェクト ５．フルスクリーン動画 ６．画像シーケンス 脱ビットマップ画像 ７．SVG ８．Webフォントを円で囲む 配色・フォント ９．配色(フラットデザイン) １０．タイポグラフィ(フラットデザイン) １１．フォント(フラットデザイン) 効果 １２．Infinite Scroll(無限スク
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
商用利用無料、ニコニコ動画のロゴっぽいかわいい日本語のフリーフォント -ニコモジ
商用利用無料、けいおん！っぽい元気でかわいい日本語のフリーフォント -けいふぉんと！（漢字も使えるよ）
商用利用無料！ごつごつした感じがいい味をだしてる日本語の極太フリーフォント -鉄瓶ゴシック
デザインの幅が広がる高品質な新作フリーフォントのまとめ -2014年8月
