作成：2014/12/22 Web制作 > 2014年、WPテーマやコーポレートサイト作成時にお世話になったツールと2015年に使いたいツール。素早くコーディングを行うために知っておきたいツールをメモ。 エンジニア速報は Twitter の@commteで配信しています。 もくじ CSS ツール １．CSS スニペット ２．CSSアニメーションサンプル ３．背景を様々な形に切り抜く ジェネレーター ４．SCSS/CSSに変換するツール ５．CSS フレームワークとチートシート ６．CSS3 アイコン ７．CSS / JS / HTML コード整形 ８．レスポンシブ モックアップ作成 ９．ブラウザ対応表 SVG / ロングシャドー / ポリゴン作成 １０．SVG ブラウザサポート状況確認表 １１．SVG ローディングアニメ作成 １２．SVG 背景作成ジェネレーター １３．SVG パターン背景

Photoshopでデザインカンプ作成時に「メインコンテンツが960pxでmarginが40pxだからこことここにガイド引いて…」みたいなことってよくあるのですが、ガイド引きって面倒くさい。 そんな作業を超簡単にしてくれる有名なPhotoshop拡張、Griddifyのご紹介です。 Griddify, a Tiny Photoshop Panel for Guides and Grids インストールはこちらから。 Adobe Extension Managerでプラグインを有効化してください。 使い方は公式サイトの動画を見れば一発でわかるのですが、せっかくなのでRecorditでgifにしてみました。（ちょっと重いかも） 一番上の項目は入力した数値のpx分、等間隔でガイドを引いてくれます。右側の矢印をクリックしてガイドを引く方向を変更可能。 選択範囲を指定すれば、その範囲内でガイドを引い