DevTools のヒント: 色の作成

ソフィア・エメリアノバ
Sofia Emelianova
GitHub

DevTools を使用すると、値を入力しなくても、数回クリックするだけで色を作成できます。

以下の DevTools のヒントの動画では、カラー オーサリングの基本機能のほとんどを紹介しています。しかし、この動画の公開後にいくつかの機能が実装され、そのうちの 1 つはサポートが終了しました。

色をすばやく作成する方法については、動画と最新のドキュメントをご覧ください。

  • Shift キーを押しながら、色の値の横にあるカラー プレビュー ボックスをクリックします。

  • 動画に示すように、カラー選択ツールを使用して色の編集やコピーを行います。

  • アイ スポイトを使用して、画面上のどこからでも色を選択できます。

  • 動画でお見せします。

    • グラデーションの値を変更するには 角度時計を使用します。
    • カスタム CSS 変数をカラーパレットとして使用できます。

  • コマンド メニューのショートカットで形式を変更するのではなく、カラー形式メニューを使用して HD 色と非 HD 色を変換できます。

  • 動画で説明されているように、[CSS の概要] パネルでページのすべての色の概要を確認します。

詳しくは以下をご覧ください。