グラデーションテスト

このツールは役に立ちましたか?コメントを残したり、コツを共有したり、改善方法を教えてください。

このツールの機能

このツールは、ブラウザ内で直接、グレースケール、個別の赤、緑、青のランプ、放射状グラデーション、フルの色相環という6つのグラデーションパターンを表示し、さまざまな方向と色にわたって目に見えるバンディングがないか画面を確認するのに役立ちます。より詳しく見るためのフルスクリーンモードも備えています。

仕組み

グレースケールと単一チャンネルのパターンは、黒からフルの白、赤、緑、または青へと進むCSSリニアグラデーションで、ブラウザが直線に沿ってできるだけ多くの中間色調を補間できるようにします。放射状パターンは、線ではなく円で中心から外側に同じ補間を行います。色相環は、完全な彩度でHSLカラーホイールから計算された、15度間隔で均等に配置された24個のカラーストップを持つCSSコニックグラデーションとして構築されており、ブラウザは隣接する各ストップのペアの間を、フルの360度の円の周りをずっと滑らかに補間します。

解決できる問題

• 画像やビデオファイルに問題があると決めつける前に、ディスプレイに目に見えるカラーバンディングがないか確認する。
• バンディングの問題が他よりも1つの色チャンネルに影響しているかどうかを切り分ける。
• 直線、放射状、円形の色相遷移にわたるグラデーションの滑らかさを比較する。
• 色に敏感な作業の前に、ディスプレイの全体的な色の滑らかさのクイックな視覚的参照を得る。

よくある質問