PhotoshopからCSS3を書き出す「CSS3Ps」

2014年2月28日 ★更新：2016年7月16日

「CSS3Ps」は、Photoshopのシェイプで作った角丸四角形や、レイヤー効果のシャドウ、カラーオーバーレイ、グラデーションなどを、自動でCSS3に書き出してくれるエクステンション。

「css3ps.com/」からダウンロードし、Adobe Extension ManagerでPhotoshopに組み込む。（ダウンロードページの指示に従えばOK）

「CSS3Ps」を使う

Photoshopのメニューバー＞ウィンドウ＞エクステンションで「CSS3Ps」を選び、ウィンドウ表示させる。

エレメントを選択して「CSS3Ps」ウィンドウをクリック。

ブラウザで「CSS3Ps」が開き、選択したエレメントのCSS3ソースが書き出される。
これをコピペ＆若干編集して使う。自分で書くより早いし誤字脱字がないかも。