フロントエンド開発の為のコンポーネント集・「FORMSTONE」
FORMSTONE FORMSTONEはフロントエンド開発のためのコンポーネントを集約しているWebサイトです。RWD対応のCSSグリッドシステムやドラッグ&ドロップで出来るアップローダー、モーダルウィンドウ、カルーセルなど様々なコン...
Resource - グリッド
グルーピングや入れ子、RWDにも対応の、エレメントの高さを揃えるスクリプト・「jquery.matchHeight.js」
jquery.matchHeight.js jquery.matchHeight.jsは様々な状況に対応可能な、エレメントの高さを揃えるスクリプトです。jQueryに依存しています。グルーピングされた要素やネストされた要素内のエレメン...
手軽にガイドとグリッドを追加できるPhotoshop拡張・「Griddify」
Griddify Griddifyは自動でグリッドやガイドを追加できるPsプラグインです。幅やグリッドの数値を設定するだけで引いてくれます。また、範囲内で引くことも可能のようです。動画が分かりやすいのでチェックしてみては如何でしょうか...
WebサイトでPhotoshopライクにガイドを引けるルーラーを利用出来る様にするブックマークレット・「RulersGuides.js」
RulersGuides.js RulersGuides.jsはWebサイトにPhotoshopのようにガイドを引けるルーラーを設置できるブックマークレットです。ショートカット等も用意されています。同じ操作感とは言えませんが、個人的に...
レスポンシブWebデザイン対応のシンプルで軽量なグリッドシステム・「.FITGRD」
.FITGRD .FITGRDはレスポンシブWebデザインにも対応したグリッドレイアウトを構築する為のCSSです。フレームワークではない、との事です。（当記事では一応フレームワークのカテゴリに含めています）CSS自体は非圧縮でも4KB...
Webページのベースラインをチェック出来るブックマークレット・「Gridwax」
Gridwax GridwaxはWebページのベースラインをチェック出来るブックマークレットです。起動させると、ラインが表示されます。グリッドの高さはshift+↑や↓で、位置はshift+→や←で調整できます。グリッドの色は起動後に...
PNGやPSDファイルとしてエクスポートできるグリッド生成ツール・「Modular Grid Pattern」
Modular Grid Pattern Modular Grid PatternはPNGやPSD形式でエクスポートできるグリッド生成ツールです。幅やカラム数を指定してダウンロードするだけ。PhotoShopのエクステンションもあるみ...
レスポンシブ且つグリッドなレイアウト生成ジェネレーター・「gridpak」
gridpak gridpakは、レスポンシブWebデザインに対応したグリッドレイアウトジェネレーターです。従来のグリッドジェネレーターにブレークポイントを設定出来る項目が付いているので操作も楽に行えます。 gridpak
PDFのグラフ用紙をオンラインで生成出来る・「Paperkit」
Paperkit Paperkitは、オンラインでグラフ用紙を生成出来るツール。サイズ、グリッドの幅や色を指定。PDFはBase64形式で発行されます。 Paperkit
レスポンシブWebデザイン対応のテンプレ生成ジェネレーター・「Responsify」
Responsify Responsifyは、レスポンシブWebデザインに対応したWebサイトのテンプレートを作成出来るジェネレーターです。グリッドのカラム数やブレークポイントなどを指定してからダウンロードします。 Respon...