[CSS] 様々なエフェクトを加えたボタンのサンプル「Hover.css」

マウスオーバーでエフェクトするボタンのサンプルです。
FontAwesomeのアイコンがアニメーションするものもあり。

[CSS] 自動で色が変わるグラデーションのCSSコードを生成するジェネレーター

「CSS Gradient Animator」は、CSS3のanimationプロパティとliner-gradientプロパティを使用して、色が変化していくグラデーションカラーを再現するCSSコードを生成できるジェネレーター。

Add colorからカラーを追加して、グラデーションやスクロールするアングル、カラーを変化させるスピードを指定してコード生成。カラーは複数追加可能となっています。

「あれ、何となく色が変化している？」というぐらいのスピードに設定すると、お上品で良い感じ。

CSSフレームワークBootstrapで使えるボタンやメニューなどのサンプル素材集。
単体で自分のブログに使うのもよさげ。

CodePenに、デザインパターンのサンプルページが新しく創設され、グラフ・タブ・ボタン・ドロップダウンメニュー・ログインフォーム・ページナビ・テーブル・マップなど、大量のデザインサンプルが取得できるようになっています。

これはかなり有用だと思いますので、是非ブックマークに登録しておきたいところ。

ページナビゲーションを追加するプラグイン「WP PageNavi」と、そのスタイルを変更できる「WP PageNavi Style」の基本的な導入方法。