同じ赤でも、鮮やかな赤、淡いピンク、暗い赤茶では、まったく印象が違います。この違いは、色相ではなく明度（明るさ）と彩度（鮮やかさ）の組み合わせから生まれます。明度と彩度をひとまとめにして「色の調子」として捉えたものがトーンです。
日本でよく使われる PCCS という体系では、トーンに名前がついています。
ビビッド … もっとも鮮やか ブライト … 明るく健康的 ペール … 淡くやわらかい ダル … くすんだ中間 ダーク … 暗く落ち着いた
このほかにもライト、ディープ、グレイッシュなどがあり、明度と彩度の位置で区切られています。
トーンが同じなら、色相が違っても似た雰囲気になります。ペールはやさしく上品、ビビッドは元気でにぎやか、ダークは重厚で落ち着き、という具合です。「どんな色相か」より「どんなトーンか」が印象を大きく左右します。
トーンをそろえて色相だけ変える、逆に色相をそろえてトーンだけ変える、といった配色ができます（次の記事で詳しく扱います）。トーンをそろえるだけで、多色でもまとまりが出ます。
トーンは明度×彩度で決まる色の調子です。このツールのスクエアは、横が彩度・縦が明度なので、同じ色相のままスクエア上を動かすと、トーンが変わっていくのが確かめられます。