SERVICE

グラデーションの無料コレクション!WebGradients

投稿日:


どうも、べ〜やんです。

今回は、180個の線形グラデーションの無料コレクション『WebGradients』を紹介します。





WebGradientsとは


引用元:WebGradients

『WebGradients』とは、180個の線形グラデーションの無料コレクションです。

おしゃれなグラデーションが180個も用意されていて、ワンクリックでCSS3のコードをコピーしたり.PNGとして取得することができます。

WebGradients


使い方


グラデーション一覧からお気に入りのグラデーションを探します。

引用元:WebGradients

ボックスの中のグラデーションをクリックして全画面サイズでグラデーションを確認することもできます。

ボックス右上の↓アイコンから.PNGで取得できます。

引用元:WebGradients

また、ボックス右下のCopy.cssからワンクリックでCSSコードを取得できます。

background-image: linear-gradient
(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);

おわりに


今回は、180個の線形グラデーションの無料コレクション『WebGradients』を紹介しました。

簡単におしゃれなグラデーションが使えて非常に便利ですね。



-SERVICE
-,

執筆者:


comment

関連記事

インターフェイスと配色をコード化!ColorTool

どうも、べ〜やんです。 今回は、インターフェイスと配色をコード化してくれるMaterialDesignのColorToolを紹介します。 ColorToolとは 引用元:Color Tool-Mate …

CSSエフェクト紹介サイト!CSSFX

どうも、べ〜やんです。 今回は、CSSのおしゃれなエフェクトを紹介してくれるサイト『CSSFX』を紹介します。 CSSFXとは 引用元:CSSFX CSSFXはCSSのクリック、ホバー、ローディング時 …

Googleアドセンス審査通過

どうも、べ〜やんです。 今回は、このブログがGoogleアドセンスの審査を通過したので、審査に通過した時点のブログの状態を紹介します。 同じようにGoogleアドセンスの審査を受けようと思っている方の …

全画面スクリーンショット!Chromeの拡張機能Full Page Screen Capture

どうも、べ〜やんです。 今回は、ワンクリックで全画面スクリーンショットができるChromeの拡張機能『Full Page Screen Capture』を紹介します。 Full Page Screen …

Webデザイナーになりたい人におすすめサービス5選

どうも、べ〜やんです。 今回は、Webデザイナーを目指している方におすすめな学習サービスを5つ紹介します。 Webデザインを学べるサービスの中でも、実際に私が利用したことのあるサービスに絞って5つ紹介 …