商用利用無料!Bootstrap 3, Bootstrap 4をベースに最近のUIデザインのトレンドを取り入れた新作テーマのまとめ
Post on:2015年10月22日
最近のWebページで人気のある縦長ページ、CSS3アニメーション、スクロールエフェクト、大きい写真画像を使った背景、カードコンポーネントなど、UIデザインのトレンドを取り入れたBootstrapのテーマを紹介します。
Bootstrap 4ベースのものもリリースされ始めました。
![Land.ioのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102201.png)
Bootstrapの特徴や基本的な使い方は、下記の記事を参考にどうぞ。
- 参考
ではテーマ紹介を、まずはBootstrap 4をベースにしたものから。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-01.png)
Land.io -GitHub
デモページ
デモページ: UIエレメント
個人・商用利用、無料。
Bootstrap 4をベースにしたテンプレートで、新しいカードコンポーネントを使い、繊細なアニメーションでコンテンツを魅力的に見せています。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-02.png)
クリーンでモダンにデザインされたポートフォリオ・プロモーション向けのテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-03.png)
Awesome Portfolio
デモページ
個人・商用利用、無料。
縦長ページのシンプルなポートフォリオ向けのテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-04.png)
5種類のヘッダ・セクションレイアウト、エクストラページを備えた実用性バツグンのテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-05.png)
コンテンツ間にある背景が固定で、カーテンのようにスクロール表示されるシンプルでかっこいいテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-06.png)
コンポーネントごとに目を引かせるアニメーションを取り入れたポートフォリオ向けのテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-07.png)
レイアウトやアニメーションが非常に楽しい、まさにクリエイティブな縦長ページのテンプレートです。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-08.png)
Light Wave
デモページ
個人・商用利用、無料。
固定された背景上に、次々に半透明のパネルでコンポーネントをスクロールさせるテンプレート。カラースキームや背景のタイプも選択できます。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-09.png)
ランディングページ用のテンプレートで、スライダーやカードなど気持ちいいアニメーションを備えています◎
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-10.png)
小規模のスタートアップ向けのテンプレート。各コンポーネントのデザインやアニメーションが小気味よいです。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-11.png)
TA Portfolio
デモページ
個人・商用利用、無料。
タイムラインのコンテンツを備えた、クリーンでエレガントなポートフォリオ向けテンプレート。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-12.png)
スモールビジネス向けのランディングページ、アクセントカラーのピンクとアニメーションが非常にスタイリッシュです。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-13.png)
カミングスーン用とありますが、コンテンツは非常に充実しています。モノトーンのコンポーネントと写真背景のコンポーネント、品のあるアニメーションが素敵です。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-14.png)
Honoka
Honoka -GitHub
デモページ
Honoka -解説記事
個人・商用利用、無料。
フォント指定・文字サイズをはじめ、日本語をより美しく表示するためのさまざまなアプローチを取り入れたテーマ。
![デモのキャプチャ](http://coliss.com/wp-content/uploads-201503/2015102202-15.png)
Umi
Umi -GitHub
デモページ
個人・商用利用、無料。
Honokaの色違い版も!
sponsors