本格的なCSSのグラデーション20個 コピで使えるコード 『Gradients & Colors』

WS002426
このエントリーをはてなブックマークに追加
PR

Gradients & Colors
By Venerons

DEMO 表示

CSSのみで作られたグラデーション20個とカラー30個のデモです
カラーの方はオススメのカラーといったところでしょうか

20種のグラデーションがあり、最近のおしゃれなウェブサイトで使われているような
グラデーションになっています

グラデーションは比較的短いコードで実現できるので、導入も簡単です
実際にこのグラデーションを利用したい場合は 対象のクラスの中身をbodyに貼り付けるか

クラスごとコピーして
bodyにクラスを付けるかして使います

 

例 gradient1 【CSS】

/*bodyに追加*/
body {
  background: -webkit-linear-gradient(315deg, #ff2247, #1e3f9f);
  background: linear-gradient(135deg, #ff2247, #1e3f9f);
}

/*クラス付きのまま追加*/
.gradient1 {
  background: -webkit-linear-gradient(315deg, #ff2247, #1e3f9f);
  background: linear-gradient(135deg, #ff2247, #1e3f9f);
}

 

コード一式をZIPでダウンロードする

Download Zip
PR

COMMENT

コメントを残す

PR

9ineBBの管理人が運営するサイト

WDG WEB DESIGN GALLERY ウェブデザインギャラリー CC0 PHOTO 無料で使える高画質な写真をダウンロード、クレジット表記、リンク不要

9ineBBの最新情報をチェック・購読

Twitter Facebook Google+ Feedly RSS

どこをクリックしてもこの表示を消せます
(3日後以降に再度表示されます)