読者です 読者をやめる 読者になる 読者になる

webhack / 猫とウェブ技術が好き

javascriptやcssやHTML5とかサーバーサイドの技術やプロジェクトマネジメントとかウェブに関するマーケティングとかWEBを取り巻く全般を好きに書くブログ

CSSアニメーションで動く「うさぎ」がかわいい

CSS CSS3

CSSだけで作られたウサギのアニメーションです。かわいい!



元ネタは以下CODEPENです。
http://codepen.io/littleginger/pen/QwVvqy

どうやって作られているのか見てみると、
@keyframes animateを使ってひたすらピクセルに色を設置しています。

ドット絵をCSSに自動変換するツールがあればこのエフェクトを簡単に作ることができそうですね。CSSだけなのでどんなサイトでも設置できます。