先日紹介した新しいRSSアイコン
ですが、Feed IconsでダウンロードできるZIPアーカイブには、GIFやPNGといったラスタ画像の他に、SVGというXMLで書かれたベクタ図形のファイルも含まれています。
- ./default/feed-icon.svg (2005年12月31日14:38:42 1,128バイト)
オレンジ色、128px × 128px
- ./grayscale/feed-icon.svg (2005年12月29日02:06:18 1,081バイト)
グレースケール、128px × 128px
他に、JPEG、PSD、AI、EPS、SVG、PDFもあり。
このアーカイブに含まれているSVGは、縦横が128ピクセルでオレンジ色とグレースケールの2ファイルだけでした。でも、SVGはXMLで書かれているためテキストエディタで容易に編集できるじゃないですか！それに、Firefox 1.5にドロップするだけで、SVGは表示できるし。ということで、サイズを変更したり、色々な色のRSSアイコンを作ってみました。
また、タイニーボタン（ちっちゃいバナー）メーカのサイトである80x15 Brilliant Button Makerを利用すれば、アイコンイメージのアップロードができて、アルファベットも任意の値が入力できます。既にRSSアイコンを新しくされた方もいらっしゃるようですが、もしよければミントでも使って、タイニーボタンを作ってみてください。
Feed Icons of 13 colors (Mid私製版)
- 概要
オリジナルアーカイブ内のデフォルト（オレンジとグレー）のSVGをベースに、サイズを変更し11色追加してみました。
アーカイブ内には、13色・2サイズのSVGとPNGが含まれています。
- 色
オレンジ、バイオレット、ミント、マゼンタ、ブルー、ライム（オレンジ色ベース）、
グレー、サーモン、ライトグリーン、スレートブルー、スカイブルー、ピンク、イエロー（グレースケールベース）、の13色。
- サイズ
11px × 11px
（
のようなタイニーボタン加工用）
32px × 32px
- フォーマット
SVG、PNG
- アーカイブファイルの在処
Feed Icons 私製版(13色) - 『子供、いらない』付録SS
- オリジナルの入手先
変更部分の解説
オレンジ色ベースで作った32ピクセル・ブルーRSSアイコン（feed_icon_mid_32_05_blue.svg）のSVGと変更点は、以下の通り。
| 32ピクセル・ブルーRSSアイコンのSVGと変更点 |
|---|
| <?xml version="1.0"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32px" height="32px" id="RSSicon" viewBox="0 0 256 256"> <defs> <linearGradient x1="0.085" y1="0.085" x2="0.915" y2="0.915" id="RSSg"> <stop offset="0.0" stop-color="#2D70E3"/> <stop offset="0.1071" stop-color="#317DEA"/> <stop offset="0.3503" stop-color="#3795F6"/> <stop offset="0.5" stop-color="#3A9EFB"/> <stop offset="0.7016" stop-color="#317CEA"/> <stop offset="0.8866" stop-color="#2B64DE"/> <stop offset="1.0" stop-color="#295BD9"/> </linearGradient> </defs> <rect width="256" height="256" rx="55" ry="55" x="0" y="0" fill="#155DCC"/> <rect width="246" height="246" rx="50" ry="50" x="5" y="5" fill="#529CF4"/> <rect width="236" height="236" rx="47" ry="47" x="10" y="10" fill="url(#RSSg)"/> <circle cx="68" cy="189" r="24" fill="#FFF"/> <path d="M160 213h-34a82 82 0 0 0 -82 -82v-34a116 116 0 0 1 116 116z" fill="#FFF"/> <path d="M184 213A140 140 0 0 0 44 73 V 38a175 175 0 0 1 175 175z" fill="#FFF"/> </svg> |
なお、グレースケールの方が色指定箇所（stop-colorやfill）が少ないため、色合いの変更は多少容易でした。
指定したカラーコード
本項は、資料をご覧ください。
SVGの閲覧方法
本項は、SVGプラグインを使ってみたをご覧ください。
色んなRSSアイコンを作ってみました(カラーコード) 2006年01月16日02:22
SVGプラグインを使ってみた 2006年01月17日23:21
Feed Icons（RSSアイコンの配布サイト）
Feed Icons 私製版(13色) - 『子供、いらない』付録SS 2006年01月15日22:54
80x15 Brilliant Button Maker - LucaZappa.com（アイコン画像のアップロードができるタイニーボタンメーカ、日本語は不可）
ちまちまボタンメーカー(クローン) - UnderDone（日本語が使えるタイニーボタンメーカ、画像は不可）
駅のRSSアイコンですよ - BLOG STATION 2006年01月15日22:28
RSSアイコンを作ってみよう 2006年01月14日01:02
Firefox 1.5日本語版リリース 2005年11月30日19:15
