読者です 読者をやめる 読者になる 読者になる

ウェブ学のすすめ

Study of Web Design & Programing

機能別にまとめたCSS3ジェネレーター28選

Webサービス

スマートフォンサイトでCSS3を使うことが多くなりますが、今までのCSSに比べブラウザごとにベンダープレフィックスを記述するなど作業量が増えてしまいます。そこで少しでも作業量を減らすためにジェネレーターを活用することをおすすめします。今回は簡単にCSS3を適用できるジェネレーターを機能別にまとめてみました。

多機能型:6個

日本語対応。Photoshopのようなジェネレーター

CSS3プロパティジェネレーター | CSS-EBLOG

シンプルなジェネレーター

CSS3 Generator

10種類も設定ができるジェネレーター

CSS3.0 Maker | CSS3.0 Generator | CSS 3.0 Generator | css3 generator

リアルタイムプレビューが可能なジェネレーター

CSS3 Playground by Mike Plate

Photoshopのレイヤースタイルと同様のUIを持つジェネレーター

Layer Styles

大きめのボタンで操作しやすいジェネレーター

CSS3 Generator - By Peter Funk & Eric Hoffman

グラデーション特化型:4個

国産のグラデーションジェネレーター

Grad3

Photoshopライクなグラデーションジェネレーター

Ultimate CSS Gradient Generator - ColorZilla.com

シンプルなグラデーションジェネレーター

CSS3 Gradient Generator

吹き出しを簡単に作れるジェネレーター

cssarrowplease

写真にぼかし効果などを加えることができるジェネレーター。

Testing -webkit-filter : playgruond for css filters

ボーダーイメージジェネレーター

border-image-generator

リボンジェネレーター

3D Ribbon Generator - CSS3d.net