左右にあるパレットから任意の2色を選んで、CSSのグラデーションコードを生成するツール。色を選んだ後で矢印のボタンを押すだけでオッケー。カレーパレットは一般的なFlat UIとMaterial Designの他に、青や黄色など固有のパレットもいくつか用意されています。Material Designなどの固定されたカラー規格におけるグラデーション生成などに使えそうです。パレットもうちょい増えてくれるとイイんだけどなぁ。
CSSを使って写真にビネット効果（トンネル効果、ケラレ）を追加する方法が紹介されています。トイカメラなどで起こる、写真の四隅が光量が足らず暗くなる現象を写真に追加する事ができます。画像に直接ではなくCSSで追加すれば、一斉に追加したり削除したりが効率よく行えそうです。円形グラデを使う点がポイントっすね。写真を印象的に見せたい場合に使えそうなテクニック。
スタイルシートに関するリソースを紹介するサイト。Tipsやスニペット、CSSフレームワークなどが紹介されています。サイト内検索やソートを使ってリソースを探す事もできます。紹介されてるサイトそのものが趣味の良いものが多いので、ネタ帳としても使えそうです。リソース集めや、日々の情報収集に役立ちそうなサイト。
Flexbox使ってますか？ 俺はほとんど使った事がありません！ けどこのジェネレーター触ってみて使ってみようって気になりました。Flexbox便利なんですが、今までのfloat使ったレイアウトと全然違うのでとっかかりが難しい部分があると思うのです。あと対応ブラウザも選びますし。このジェネレーター使うと対応ブラウザはどうしようもないにしても、コード記述の敷居はグっと下がる気がします。ボックスの数、順番、並べ方等を数値入力したりプルダウンから選ぶだけで、リアルタイムにCSSコードを生成してくれます。いやこれ便利ですね。レスポンシブレイアウトのサイトコーディングする時なんかに使えそうです。
ページ背景でスライドショーを行うためのjQueryプラグイン。Bodyとか大きめDivに背景指定する事を目的としたものです。表示エリアが大きい場合、背景に指定する画像サイズを大きくする事が多いけど、その場合サイトロードの際のファイルサイズが大きくなってしまいます。そこで使われるのがオーバーレイ用の透過PNG。背景画像の上にドットとかストライプの透過画像が乗ると、なぜか画像の粗さがごまかされるんですね。プラグイン一式をダウンロードすると、ソレ用の透過画像も数種類含まれています。また可変エリア内で動画再生を行う時にもこの手法はよく使われますが、これらの透過画像はそうした目的への応用もできそうです。トランジションの種類も多く、使い勝手良さそうです。
CSS3を使った様々なアニメーションのコードスニペットを紹介するサイト。サイト内の角丸四角にマウスオーバーするとアニメーションをプレビューでき、目玉のアイコンをクリックでコードを見る事ができます。また「＋」マークを使って複数のアニメーションを選択する事で、アニメーションのコードをまとめて生成する事もできます。アニメーション関連のCSSフレームワークとしても使えますね。
Webデザインで使える様々なコードスニペットを集めたサイト。チェックボックス装飾やModalウィンドウ、マウスオーバーアニメーション、イメージスライダー、グリッドレイアウト、CSSボタン、イメージギャラリーなど、色々な場面で使えるコードが紹介されています。各作例はアニメーションGifを使って一覧されているので、動きの確認まで確認できる点がとってもナイスです。
CSSで円錐グラデを描画する方法についての解説。conic-gradientって聞いた事ないなーと思っていくつかのブラウザで確認してみたら、FirefoxとChromeはOK、Safariでは描画できませんでした。これ使えば例えばこんな描画なんかもCSSだけでできるようです。工夫次第では円グラフや放射線なんかも描けるみたい。
