↓のWebアプリ上の背景をフリック操作（ドラッグ操作）やタッチ操作（クリック操作）すると，背景全体の色が変わります。

カラーコードをコピーしました

フリック背景色チェンジャー

画面をドラッグ / フリックして色を変更

左右: 色相 (0〜360°) / 上下: 明度 (0〜100%)

H: 195° L: 50%

#00bfff

hsl(195, 100%, 50%) rgb(0, 191, 255)

色相プリセット

明度プリセット

ピッカー:

#00bfff

パネルを隠す

パネルを表示

彩度は常に100%に固定されています。左右の位置は色相を (左端=0°、右端=360°)，上下の位置は明るさ（明度）を変更 (上端=100%、下端=0%)できるようにしています。
操作パネルを使うことで，細かな色の設定ができます。
「色相プリセット」は，予めセットされた色を簡単に選択できます。
「明度プリセット」は，左から明度が0％,25％,50％,75％,100％と並んでいて，５択で選べます。
「ピッカー」は，現在設定された背景の色を示します。右部に「#で始まるカラーコード」があり，そのさらに右側のボタンを押すことで，クリップボードにカラーコードの文字列をコピーできます。
また，操作パネルの下部にある「パネルを隠す」を押すと，パネルが非表示になります。その際画面右下に現れた「パネルを表示」を押すと，再び操作パネルが表示されます。
中央に水平線が現れますが，これは明度５０％の線で，この線付近をフリックすると，色味が鮮やかに表現されます。しばらく操作をやめると水平線と画面右下の「パネルを表示」が消えます。
「今の気分はどんな色？」「好きな色は？」「チームの色を決めよう！」など，使用者が色を表現するのにお使いください。

※この教材はWebアプリです。ブラウザで動作します（一部，うまく動作しないブラウザもあります）。接続環境次第では，表示に時間がかかったり，表示できなかったりする場合があります。ご了承ください。