100種類以上の美しい組み合わせ

グラデーションライブラリの使い方

1. 1

   グラデーションコレクションを閲覧

   グラデーションスウォッチのグリッドをスクロールして、さまざまな色の組み合わせやスタイルを探しましょう。各グラデーションには名前とカラーコードが表示されます。

2. 2

   個々の色を表示する

   グラデーションの左半分をクリックすると開始色を、右半分をクリックすると終了色を見ることができます。HEXコードは2秒間表示されます。

3. 3

   グラデーションCSSをコピー

   任意のグラデーションの下にある「グラデーションをコピー」ボタンをクリックすると、完全なCSS backgroundプロパティがクリップボードにコピーされます。

4. 4

   プロジェクトで使用する

   コピーしたCSSコードをスタイルシートまたはインラインスタイルに貼り付けてください。グラデーションはlinear-gradient形式でそのまま使用できます。

主な機能

• 100種類以上の厳選されたグラデーション

  スタイルやカラーテーマ別に整理された、100種類以上の美しいグラデーションの組み合わせの厳選コレクションにアクセスできます。簡単に閲覧可能です。

• インタラクティブなカラープレビュー

  どのグラデーションスウォッチでも、左半分または右半分をクリックすると、個々の開始色と終了色をHEXコードとともに表示できます。

• ワンクリックでCSSをコピー

  コピーボタンをワンクリックするだけで、すぐに使えるCSS linear-gradientコードをクリップボードに瞬時にコピーできます。

• 視覚的なグラデーショングリッド

  グラデーション名とカラーコードが明確に表示された、すっきりとしたモダンなグリッドレイアウトでグラデーションを閲覧し、素早く参照できます。

カラーグラデーションとは？

カラーグラデーションとは、2色以上の色が滑らかに変化し、視覚的に魅力的なブレンドを生み出すものです。ウェブデザインにおいて、CSSリニアグラデーションを使用すると、指定された方向に流れるこのような色の変化を作成できます。当社のライブラリは、プロが厳選したグラデーションの組み合わせを特徴としており、背景、ボタン、カード、その他のデザイン要素に調和の取れた色の変化を見つける時間を節約できます。

当社のグラデーションライブラリを使う理由

• 1

  プロによる厳選

  当社のコレクションのすべてのグラデーションは、視覚的な魅力とデザインの汎用性のために慎重に選択されており、高品質な色の組み合わせを保証します。

• 2

  すぐに使えるCSS

  そのまま使えるCSSコードをすぐに手に入れられます。グラデーションの構文を手動で記述したり、色の値を試行錯誤したりする必要はありません。

• 3

  インタラクティブな色確認

  スウォッチの異なる部分をクリックすることで個々のグラデーションの色を表示でき、使用されている正確な色を簡単に把握できます。

• 4

  時間を節約するデザインツール

  グラデーションをゼロから作成する試行錯誤を省きましょう。最適なグラデーションを素早く見つけ、プロジェクトに即座に実装できます。

よくある質問