Webページのレイアウトの際に必須ともいえるCSS。簡単なページ構成でも小さなところで凝ったCSSのデザインがあるだけでぐっとデザインが引き締まります。
ですがイメージはあってもうまくコードにできない、あるいはできてももっと手軽にCSSを使いたいという人もいるのではないでしょうか。そんな人のためにあるのが、ジェネレーターサイトです。ビジュアルでわかりやすいGUIでデザインを選び、CSSコードを吐き出してくれる優れものです。
今回はその中でもまずはおさえておくと便利なCSSジェネレータサイトを７つご紹介します。
{CSS}Portal
ページ内の「CSS Generators」から、ボックスシャドウ・ボタンなど様々なジェネレーターの選択ができます。選択した後各ページでCSSコードの作成ができます。
3D Ribbon Generator
様々な3Dリボンを作成できるジェネレーターサイトです。自ら幅や大きさなどを決定しGenerateボタンをクリックするとコードが表示されます。
CSS3 Button Generator
色や大きさ、テキストを設定することでボタンのCSSコードが作成できます。
CSS triangle generator
角度、大きさ、色を設定することで三角形のCSSコードが作成されます。
Ultimate CSS Gradient Generator
様々な種類のグラデーションが作成できるCSSサイトです。設定を決めた後、switch to cssを押すことでCSSコードが表示されます。
OneClickCSS
このサイトはHTMLコードからCSSコードを自動で作成してくれます。ソースを入力するだけでワンクリックでCSS表示してくれる非常に便利なサイトです。
CSS3プロパティジェネレーター
日本語に対応した、まるでPhotoshopのような操作でグラデーションなどを作成できるジェネレーターです。
まとめ
小さいパーツやディテールなどまで一からコーディングしていると非効率な時もあります。そんなときにはこれらのジェネレーターを使ってみるといいかもしれません。
