個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

信じられないほど美しい!CSSだけで絶滅危惧種30を表現した「In Pieces」

信じられないほど美しい!CSSだけで絶滅危惧種30を表現した「In Pieces」

CSSだけで表現されているのに、信じられないほど美しいサイト「In Pieces」をご紹介します。
「In Pieces」は、30種類の絶滅危惧種を美しいCSSアニメーションで表現した類まれなサイトです。
物悲しい音楽と、ゆったりと展開するアニメーションに時間を忘れて見入ってしまいます。

CSSだけで絶滅危惧種30を表現した「In Pieces」が信じられないほど美しい!

In Piecesは、CSSだけで絶滅危惧種30種類を30のパーツで表現した稀有なサイトです。
美しいCSSアニメーションと、メランコリックな音楽に、思わず手を止めてしまうことでしょう。
ブラジルアルマジロ
信じられないほど美しい!CSSだけで絶滅危惧種30を表現した「In Pieces」
アフリカペンギン
信じられないほど美しい!CSSだけで絶滅危惧種30を表現した「In Pieces」
こうした絶滅危惧種については、詳しいデータなども見ることが可能です。
もちろんここでも、美しいアニメーションがついていますよ。
信じられないほど美しい!CSSだけで絶滅危惧種30を表現した「In Pieces」
CSSだけでも(と言ってもものすごい技術力ですが)、こうした表現が可能なのですね。
素晴らしい。
In Pieces – 30 Endangered Species, 30 Pieces.

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 0
  • 0

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

商用無料で高画質画像を配布するUnsplashがプレースホルダー画像サービスを開始

便利すぎる!商用無料で高画質画像を配布するUnsplashがプレースホルダー画像生成サービスを開始

商用無料で高画質画像を配布するUnsplashがプレースホルダー画像生成サービスを開始しました。

記事を読む

SVGベースのオリジナルなシームレスパターンを作ってダウンロードできる「Plain Pattern」

SVGベースのオリジナルなシームレスパターンを作ってダウンロードできる「Plain Pattern」

今回ご紹介するのはSVGベースのシームレスパターンを簡単につくれて、PNG形式でダウンロードできてし

記事を読む

よくわかる 初心者のためのCSS3 transitionとtransformのチュートリアル

よくわかる 初心者のためのCSS3 transitionとtransformのチュートリアル

初心者のためのCSS3 transition(トランジション)とtransform(トランスフォーム

記事を読む

WEBサイトの背景に幾何学的なポリゴンアニメーションを簡単に実装できる「particles.js」

WEBサイトの背景に幾何学的なポリゴンアニメーションを簡単に実装できる「particles.js」

流行っているのかどうか定かではありませんが、海外のサイトなどで最近よく見かける幾何学的なポリゴンアニ

記事を読む

プログラミング・コーディングの作業効率UP!ミスを激減させる見やすいフリーフォント18

プログラミングやコーディングするとき、どんなフォントを使っていますか? 私の場合、Coda 2とい

記事を読む

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Fra

記事を読む

トップ固定でレスポンシブ対応のナビゲーション/メニューを簡単に実装できる「Fixed Nav」

トップ固定で、レスポンシブ対応のナビゲーションが増えていますね。 これだけ増えてくると、トップ固定

記事を読む

CSSアニメーションでここまでできる!無料のCSSアニメーションコードサンプル

CSSアニメーションでここまでできる!無料のCSSアニメーションコードサンプル23

CSSアニメーションだけで、こんなこともできてしまうというコードサンプルをご紹介します。 掲載され

記事を読む

レスポンシブWEBデザインの確認に最適!スマホ・タブレットでの表示を一度に確認できる「Responsinator」

レスポンシブWEBデザインの確認に最適!スマホ・タブレットでの表示を一度に確認できる「Responsinator」

レスポンシブWEBデザインの確認に最適なツールをご紹介します。 このツールを使えば、スマホやタブレ

記事を読む

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介

2014年に登場したベストなjQueryプラグインを50個ご紹介します。 レイアウト系のプラグイン

記事を読む