I'll be NET 】創作サイトから中小企業まで東京都三鷹市で低価格高品質なホームページ制作(SOHO)

トップページ > CSS > WEBデザイナー必見!CSSジェネレータ集

WEBデザイナー必見!CSSジェネレータ集

WEBデザイナー必見!CSSジェネレータ集

WEBサイトを作成する際に絶対に役立つスタイルシートのジェネレータ集です。
設定項目を調整するだけで自動的にソースを構成してくれます。

Layer Styles

Layer Styles
リンク先へはこちらをクリック

box-shadow、背景色(グラデーション)、border(線色)、border-radius(角丸)を設定できます。
Adobeに似たインターフェイスなので調整しやすいと思います。

CSS 3.0 MAKER

CSS3.0 MAKER
リンク先へはこちらをクリック

border、border-radius(角丸)、グラデーション、text-shadow、box-shadowはもちろん、transform(角度)、アニメーションなども調整可能です。
グラデーションは2色のみとなっています。

CSS Buttun Generator

CSS Buttun Generator
リンク先へはこちらをクリック

text-shadow、box-shadow、border、border-radius(角丸)、グラデーションを調整できます。
グラデーションは2色のみとなっています。

CSS3 GENERATOR

CSS3 GENERATOR
リンク先へはこちらをクリック

border-radius(角丸)、box-shadow、背景色(グラデーション)、透明度(opacity)を調整できます。
グラデーションは2色のみとなっています。

css generator

css generator
リンク先へはこちらをクリック

border-image、text-shadow、box-shadow、border-radius(角丸)を調整できます。
border-imageを調整できるのが特徴的です。

Ultimate CSS Gradient Generator

Ultimate CSS Gradient Generator
リンク先へはこちらをクリック

グラデーション用のCSSを生成するためのジェネレータです。
サンプルの画像もあるので好きなスタイルを選択し、色や透明度を調整できます。

CSS3 Text Shadow Generator

CSS3 Text Shadow Generator
リンク先へはこちらをクリック

text-shadowを生成するためのジェネレーターです。
影色、角度などを調整して生成するシンプルなジェネレーターです。

box-shadowジェネレーター

box-shadowジェネレーター
リンク先へはこちらをクリック

box-shadowを生成するジェネレーターです。
border(線色)、border-radius(角丸)も調整可能です。
日本語なので利用しやすいです。

記事移動

関連記事

iphone の safari でアドレスバーや標準メニューが消えない時に確認した方がいいCSSの設定

【CSS3】word-wrap:break-word;とword-break:break-allで文字を折り返して表示する方法

pixiv小説のように縦書きの文章の中でCSSで縦中横に表示してみる。

pixiv小説のようにCSS3だけでHTMLを縦書き表示してみる。

欲しいアイコンだけ選んでWEBフォント化してくれる便利サイト【Fontello】

CSS3でマウスオン(:hover)時に画像を拡大・縮小する方法

Comment Form

  • コメントを入力してください。
登録フォーム
Name
Mailaddress
URL
Message
Postkey
(スパム対策に、投稿キー を半角で入力してください。)

ユーティリティ

創作サイトから中小企業まで東京都三鷹市で低価格高品質なホームページ制作(SOHO)【I'll be NET】

プロフィール

author:I'll be NET

since:2014.01.01

東京都を拠点としたSOHO(フリーランス)による創作サイト向けWEB制作サービスを行っています。 お仕事とか創作活動とかでメモっておきたいこととかを掲載しています。

more

Feed