ちょっとしたWebサイトであればBootstrapをベースにすればデザインを一から作る必要がなくなっています。プロトタイプはもちろんのこと、数多あるBootstrap用テーマを使えば、十分高品質なWebサイトが作れるでしょう。 今回はそんなBootstrapのテーマを紹介します。マテリアルデザインになっているPropellerです。

Propellerの使い方

スクリーンショットを多めに紹介します。まずはタイポグラフィ。

アイコン。

影。

アコーディオン。

アラート。

バッジ。

ボタン。

モーダル。

ボタン付きのモーダル。

ドロップダウン。

フォーム。

リスト。

さらにカスタマイズしたリスト。

ナビゲーションバー。

ポップオーバー。

プログレスバー。

サイドバー。

タブ。

テーブル。

カード。

Propellerはマテリアルデザインになっていますので単純なデザインだけでなく、クリックやマウスオーバーした時のアニメーションも実装されています。さらにBootstrapとあってデスクトップだけでなくモバイルやタブレットでも使えます。この点も見逃せないですね。

PropellerはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。

Propeller - Front-end framework based on Material Design & Bootstrap digicorp/propeller: Propeller - Develop more, Code less. Propeller is a front-end responsive framework based on Google’s Material Design Standards & Bootstrap.