DevTools では、値を入力しなくても、数回クリックするだけで色を作成できます。
以下の DevTools のヒント動画では、カラー オーサリングの基本機能のほとんどを説明しています。ただし、動画の公開後、いくつかの機能が実装され、1 つの機能が非推奨になりました。
色をすばやく作成する方法については、動画と更新されたドキュメントをご覧ください。
カラー形式メニューを開くには、色の値の横にあるカラー プレビュー ボックスを Shift キーを押しながらクリックします。
動画のように、カラー選択ツールを使用して色を編集、コピーします。
スポイトツールを使用して、画面上の任意の色を選択します。
動画に示すように、
- 角度目盛りを使用して、グラデーションの値を変更します。
- カスタム CSS 変数をカラーパレットとして使用します。
コマンド メニューのショートカットで形式を変更するのではなく、色形式メニューを使用して HD と非 HD の色を変換します。
動画で説明されているように、[CSS の概要] パネルでページのすべての色の概要を確認します。
詳しくは以下をご覧ください。