![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ1.jpg)
WEBサイトやLPやバナー制作など。色番号を調べるのに便利なサイトを紹介するにゃ。
目次
カラーピッカー
感覚的に、好みの色の色番号がわかる
Google Chromeのブラウザーで「カラーピッカー」と入力すると、一番上にこのような「カラー選択ツール」が現れます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.29.32.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.29.32.png)
カラースライダーで色味を選んで、
明るさなどは右上のカラー部分でドラックすると、左部分に指定している色が大きく表示されます。
AdobeColor
並べられている色の中から選んで使える
流行りの色並びを見ることができます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.49.40-729x375.jpg)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.49.40-729x375.jpg)
画像をクリックすると詳しいカラー番号のページに飛びます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.52.32-976x375.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-19.52.32-976x375.png)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ2.jpg)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ2.jpg)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ2.jpg)
3色以内くらいで1ページを作成すると、まとまりのあるページに仕上がりやすいとされてるにゃ。
画像の色番号がわかる
ドラックで画像のとりたい場所を指定できます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-1.08.51.jpg)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-1.08.51.jpg)
画像のグラデーションが作れる
ドラックで画像を入れます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-0.54.56-590x375.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-0.54.56-590x375.png)
グラデーションの数なども指定できます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-1.07.48.jpg)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-08-1.07.48.jpg)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ1.jpg)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ1.jpg)
![](https://nyancode.net/wp-content/uploads/2022/03/にゃんこ1.jpg)
他にも色々な機能があるので使ってみてね
ColorZilla
開いているページの色がすぐにわかる!Google Chromeの拡張機能
Chromeに追加して使います。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-20.53.15-1197x375.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-20.53.15-1197x375.png)
スライドするとその部分の色番号がわかります
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.52.45-422x375.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.52.45-422x375.png)
クリックして確定させましょう
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.53.23-672x375.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.53.23-672x375.png)
色番号を取得したら、×を押すと通常操作に戻れます。
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.53.40.png)
![](https://nyancode.net/wp-content/uploads/2023/01/スクリーンショット-2023-01-07-23.53.40.png)