フラットなスタイルのUIエレメントがずらっと揃ったフレームワーク -Furatto
Post on:2013年7月16日
BootstrapやFoundationのように、フロントエンドのさまざまなUIエレメントが揃ったフレームワークを紹介します。
一番の大きな違いは、名の通りフラットを前提に作成されている、ということでしょうか。
Furattoは、かっこいいフラットなスタイルのUIエレメントを使ったウェブページが簡単に実装できるようになっています。
デモページから、そのUIエレメントをいくつか紹介します。
まずは、ボタン類。
デフォルトのボタン、カラフルなボタン、アイコン付きのボタンをはじめ、バータイプのボタンなどが揃っています。
画像もclassを加えるだけで、さまざまなスタイルで配置できます。
デフォルトの矩形状から、サークル状、ポラロイド状、ホバーエフェクトなどが揃っています。
テーブルも豊富なスタイルが用意されています。
ストライプのテーブル、レスポンシブ対応のテーブル、カラフルなテーブルなどなど。
Baseはページでよく使うエレメントです。
見出し、リスト、左右中央寄せ、強調、インラインリストなど。
グリッドは767pxの12カラムがベースです。
divなどにclassを加えるだけで、さまざまなグリッドを作りだすことができます。ネストにも対応しています。
フォームは利用にあわせて、さまざまなスタイルが用意されています。
インラインタイプ、ラベルと入力欄の水平タイプ。
チェックボックスやラジオボタン、セレクトメニューもフラットなスタイルです。
ステータスの表記もかっこいいフラットなスタイルです。
コンポーネントはウェブページでよく使うUIが揃っています。
ナビゲーションやページネーション。
ラベル。
通知パネルをはじめ、バッジ、ツールチップ、タグなども揃っています。また、イレギュラーなレイアウトで使う用のコードなども用意されています。
JavaScriptでは最近のウェブページでよく見かけるスクリプトが揃っています。
モーダルウインドウ。
画像とテキストをスライド表示するカルーセル、他にもツールバー、日付ピッカー、ドロップダウンメニューなども揃っています。
sponsors