CodePenで公開されている、CSSを使ってIsometric（アイソメトリック）な見栄えを実装したデモ 15 | NxWorld

CSSを使って要素を斜め上から見ているような**Isometric（アイソメトリック）**な見栄えを実装しているデモを、CodePenで公開されている中からいくつか紹介します。 基本的にこのような見栄えを実装したいときによく使われるtransformのrotateX()とrotateZ()を組み合わせたもので、そこに＋αを加えて見栄えや動きを作っている感じです。 CSS isometric image hover effects イメージにホバーするとアイソメトリックが解除され、見た目もグレースケールからカラーに変化します。