CSS3で作られたレイヤースタイル風CSS3ジェネレーター

スポンサーリンク

これは面白い。

CSS3ではかなりいろいろなことが実現できるようになって、様々なチュートリアルやらサンプルが出回りつつありますが、今回CSS3で作られたPhotoshopのレイヤースタイル風なCSS3ジェネレーターを見つけましたよ。

layerstyle

Photoshopのそれとは項目数も少ないですし、実際にはないものもあったりしますが、グラデーションのカラーを変えたり、ドロップシャドウやシャドウ(内側)、境界線をいろいろとぐりぐりいじって変更することができます。角丸の調節なんかももちろんできちゃいます。

で、ぐりぐりっといじった後は、CSS3のコードを取得可能。
画面左下の「CSS Code」というところをクリックすると、下からミョッとコードが出てくるので、そのコードをコピペすればOK。

css3code

感覚的にはホントPhotoshopのレイヤースタイルを使っているのと同じなので、Photoshopを使い慣れている人にとっては非常に操作しやすいんじゃないでしょうかね。

CSS3のグラデーションや角丸、シャドウといった要素をググッと作りやすくしてくれるジェネレーターだと思うので、覚えておいても損はないかも。

「Web」新着記事

「楽天西友ネットスーパー」爆誕! 忙しいママの強い味方になりそうじゃないか

Avatar for ホシナ カズキ

ホシナ カズキ

Amazon「ベビーレジストリ」が日本上陸したので早速登録してみた件

Avatar for ホシナ カズキ

ホシナ カズキ

飲食店紹介リンク生成サービス「タベレバ」が公開されていた件

Avatar for ホシナ カズキ

ホシナ カズキ

「スマホでFAX45」を使えば1枚45円でスマホからもFAXを送れる!

Avatar for ホシナ カズキ

ホシナ カズキ

「cookpad Mart」が始まる! サービス対象エリアになるのが楽しみな件

Avatar for ホシナ カズキ

ホシナ カズキ

もっと見る

モバデビモバイルウェブのネタ、ニュースMaciPhoneなどのApple関連、WordPressのことなど、いろいろ書く雑食系ブログメディア。
ためになるかもしれないし、ならないかもしれない。そこそこ更新してますそこそこ。

このブログについてもっと詳しく