Dark Mode Favicons | CSS-Tricks
Oooo! A bonafide trick from Thomas Steiner. Chrome will soon be supporting SVG favicons (e.g. ). And you can embed CSS within an SVG with a <style> element. That CSS can use a prefers-color-scheme media query, and as a result, a favicon that supports dark mode! < pre rel=”HTML”> < svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"> <style> circle { fill: yellow; stroke: black; stro
Webサイトに必要なfaviconが21個になっていた - IT探検の追憶
久しぶりにWebサイトのfaviconを変えようと思い、調べてみると、必要なfaviconが大幅に増えていることがわかりました。 その数、何と21個！ そんなに増えていたとは。 一応、以下にリストアップしてみます。 faviconのリスト favicon.ico: IE用 favicon-16x16.png: タブ表示用 favicon-32x32.png: Mac版Safari用 favicon-96x96.png: Google TV用 favicon-160x160.png: Opera 12 までのスピード・ダイアル用 favicon-196x196.png: Android版Chrome用 mstile-70x70.png: Windows 8 用 mstile-144x144.png mstile-150x150.png mstile-310x310.png mstile-31
GitHub と CI を連携してる人にオススメの userscript: PR Build Status in Favicon - 詩と創作・思索のひろば
GitHub を使って Pull Request ベースで仕事しているとこんなことがありますよね…… ( ^o^) LGTM もらった！:sushi: ( ˘⊖˘) 。o(CI 通ったらマージしよう) |花金|┗(☋｀ )┓三 ( ◠‿◠ )☛ マージしてから帰れよ ▂▅▇█▓▒░(’ω’)░▒▓█▇▅▂ 忘れてたああああああ Issue/PR のタブを開きすぎて、自分のにしろ他人のにしろ何がどこにあってステータスがわからなくなってしまうという問題もありますね。 そんなときに便利なユーザースクリプトがこちら。 GitHub PR Build Status in Favicon chrome://extensions に放り込むなどしてインストールすると、ビルドステータスが設定されている Pull Request（例）では、Favicon の右下にそのステータス（最新コミットのもの）を表す色
Favicon Generator for perfect icons on all browsers
Your favicon is transparent. This is usually a good thing, but not for iOS Web Clips which are supposed to be opaque. Look at the sample on the left, this is how a user would see your favicon as a Web Clip on his device. What to do about this? Your favicon is not transparent. This is a good thing for iOS Web Clips. Yet, web clip corners are rounded. Depending of your favicon, it may disrupt its de
iconifier.net
Free Online Icon Generator for AppleFile Names: apple-touch-icon-180x180.png apple-touch-icon-152x152.png apple-touch-icon-144x144.png apple-touch-icon-120x120.png apple-touch-icon-114x114.png apple-touch-icon-76x76.png apple-touch-icon-72x72.png apple-touch-icon-57x57.png apple-touch-icon.png and FaviconA Choice of resolutions: 16 x 16 24 x 24 32 x 32 48 x 48 64 x 64 128 x 128 256 x 256 Icons
Favicons, Touch Icons, Tile Icons, etc. Which Do You Need? | CSS-Tricks
An old 57×57 Apple Touch icon on a shiny Retina iPad. Blurry. A high resolution 152×152 Apple Touch icon on a shiny Retina iPad. Neat. If you didn’t have the right answer, don’t blame yourself though. Out of the 5,000 top web sites which exhibit an apple-touch-icon.png, as little as 4% get it right. Some might argue that 9 graphics are not really necessary. But at least, your master Apple Touch ic
ファビコン（favicon）とは？代表的なサイズと基本の作成方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
ファビコンはサイト閲覧時のタブ以外にも、多くの場所で使われていることがわかります。 また、上記以外にも検索結果画面にも表示されるため、そのサイトを表す適切なアイコンを設定するようにしましょう。 作成時のサイズは512px × 512pxのみでOK これだけサイズがあると、全て用意するのかと不安になってしまいますが、WordPress4.3以降のバージョンであれば512px × 512pxのPNG形式ファイルを作成すれば全てに対応してくれるようになりました。 複数作成する必要はないので安心してください。 WordPress以外の場合 WordPressを利用しておらず上記のような自動適用の機能がない場合、またはWordPressが4.3以前のバージョンの場合は、各サイズのアイコンを用意する必要があります。 各ブラウザのファビコン表示サイズは先ほどの表の通り16px × 16px が一般的です
favico.js·Faviconを自在にコントロール MOONGIFT
Webカムや動画までFaviconに流しちゃいます！ FaviconはWebサイトのマークとして大事な役割を担っていますが、単に同じ画像をいつまでも表示しているのでは面白みがありません。もっと活用したい、そう考える人に使ってみて欲しいのがfavico.jsです。 できること favico.jsができることはFaviconのダイナミックな変換です。例えば、 バッジ表示 別なアイコンに差し替え 動画の表示 Webカムの表示 ができます。Faviconの中でWebカムを表示したいと思うケースは思いつきませんが、バッジ表示やユーザによってアイコンを変えると言うのは十分ありえるのではないでしょうか。 バッジ表示についてはアニメーションや形を指定することもできます。 デモ バッジ表示。数はダイナミックに変更できます。 数をアップしました。 アイコンの差し替え。 動画の再生。 バッジの表示位置は指定でき
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
