ニュース
» 2011年12月20日 18時31分 公開

CSS3だけで描いた「けいおん!」の澪がすごい しかもちょっと動く

アニメ「けいおん!」の澪を、画像を使わずCSS3だけで描いた絵が話題だ。髪や目も少し動く。

[ITmedia]

 アニメ「けいおん!」の秋山澪をCSS3だけで描いた絵がすごいと話題になっている。画像を使っていないのに画像のように見え、しかも髪や目にかすかな動きも付いている。

CSS3だけで描いた澪(左)とソース(右)

 描いたのは台湾のWebデザイナー、Reiさん。ほかにも「機動戦士ガンダムSEED」のラクス・クラインリラックマをCSS3で作っている(ブラウザの種類やバージョンによっては正しく表示されない場合がある)。

 ほかにもCSS3を使って絵を描いているWeb技術者がおり、@shop_ddさんはドラえもんや「とある魔術の禁書目録」の回転する風車などを、@TjRusさんはiPhone 4を展示している。CSS3で描いたiPhone 4は、電源ボタンやホームボタンをマウスでクリックしたり、スライドバーをスライドさせることができる。

 CSSだけで描いた有名企業のロゴを展示しているecsspertというサイトもある。

Copyright © ITmedia, Inc. All Rights Reserved.

先週の総合アクセスTOP10

  1. 「訃報」「愛猫」「手風琴」って読める? 常用漢字表に掲載されている“難読漢字”
  2. 嫌がらせ急ブレーキで追突 トラクターの進路を妨害した「あおり運転」ベンツ、ぶつけられたと運転手がブチギレ
  3. 猫「雪なんてへっちゃらニャー!」 雪の中を豪快に突き進む猫ちゃんに「ラッセル車みたい」「ワイルドかわいい」の声
  4. 「Lチキひとつ」 → 買った物をよくみると? コンビニで犯したありがちな間違いを描いた4コマに「あるある」「逆もある」
  5. 柴犬「きゃほほーーい!!」 初めての雪に“喜びが限界突破した”ワンコの駆け回る姿がかわいい
  6. 「ホント太るのって簡単!」「あっという間に70キロ」 内山信二の妻、夫に生活リズムを合わせた“ふとっちょ時代”公開
  7. ルーフから赤色灯がひょっこり 埼玉県警、スバル「WRX S4」覆面パトカー3台を追加導入!? Twitterにアップされた目撃情報が話題に
  8. 益若つばさ、YouTubeで12歳息子と共演 礼儀正しい振る舞いに「教育がちゃんとされてる」
  9. トップの座を奪われ……美大生が天才の編入生を刺し“殺す”漫画に「泣きそう」「同じ経験した」の声
  10. タイからバズーカ砲をかかかえたようなミニバイク「GUNNER50」が日本上陸 思わずキュンと来ちゃうやばいデザイン