CSSで六角形を描くような用事、あるかなぁ・・・？

今まで生きてきてCSSで六角形を描けたら便利だよなーという用事に出会ったことがないのですが、CSS Hexagonは六角形を描くようなCSSをジェネレートしてくれるツールです。

使い方

画面上部のツールパネルでサイズなどを設定すると・・・

こんな感じでリアルタイムにプレビューを描画してくれるのと同時に、対応するCSSコードを生成してくれます。Sassのmixinとして生成してくれれば、もっと便利なんですけどねー。

こんな六角形を作ることもできます。

モチーフとしてはありがちだけれども、Webではあまり見ることはないので、ある意味新鮮かもしれません。

CSS Hexagon