背景色と文字のカラーテスト
ホームページやチラシなどをデザインするとき、
フォトショップやイラストレーター上でたくさんの色を試すのって面倒ですよね。
簡単に配色のテストができれば便利なのに！なんて思ったことはありませんか？
このページでは背景色と文字色の組み合わせをテストすることができます。「body背景」、「コンテンツ背景」、「文字」の配色を試し、ホームページ制作の参考にしていただければと思います。
6文字の英数字は16進数でのカラーコードです。コピー＆ペーストや直接入力で手軽にご活用ください。（コピーのヒント：マウス操作の場合、6桁の英数字部分をダブルクリックで6文字が選択状態になります。）
全体の背景色の設定
body（ヘッダー、フッター部分除く）の背景色を変更することができます。ウィンドウ、スクリーン部分の背景に適用されます。
※スマートフォンや幅の狭い画面（幅640px以下）でこのページをご利用の際、全体の背景は両端（左右10pxずつ）の狭い部分とフッター部分のみに適用となります。
カラーリストの開閉
-
- 白黒
-
- ffffff
- f2f2f2
- e5e5e5
- d9d9d9
- cccccc
- bfbfbf
- b3b3b3
- a6a6a6
- 999999
- 8c8c8c
- 808080
- 737373
- 666666
- 595959
- 4d4d4d
- 404040
- 333333
- 1a1a1a
- 000000
-
- 赤
-
- ffe5e5
- ffcccc
- ffb2b2
- ff9999
- ff8080
- ff6666
- ff4c4c
- ff3333
- ff1a1a
- ff0000
- e50000
- cc0000
- b30000
- 990000
- 800000
- 660000
- 4d0000
- 330000
- 1a0000
-
- 橙A
-
- fff1e5
- ffe4cc
- ffd6b2
- ffc999
- ffbb80
- ffad66
- ffa04c
- ff9233
- ff851a
- ff7700
- e56b00
- cc5f00
- b35300
- 994700
- 803c00
- 663000
- 4d2400
- 331800
- 1a0c00
-
- 橙B
-
- fff9e5
- fff2cc
- ffecb2
- ffe599
- ffdf80
- ffdf80
- ffd24c
- ffcc33
- ffc61a
- ffbf00
- e5ac00
- cc9900
- b38600
- 997300
- 806000
- 664c00
- 4d3900
- 332600
- 1a1300
-
- 黄
-
- ffffe5
- ffffcc
- ffffb2
- ffff99
- ffff80
- ffff66
- ffff4c
- ffff33
- ffff1a
- ffff00
- e5e500
- cccc00
- b2b300
- 999900
- 808000
- 666600
- 4c4d00
- 333300
- 1a1a00
-
- 黄緑
-
- f7ffe5
- eeffcc
- e5ffb2
- ddff99
- d4ff80
- ccff66
- c3ff4c
- bbff33
- b2ff1a
- aaff00
- 99e500
- 88cc00
- 77b300
- 669900
- 558000
- 446600
- 334d00
- 223300
- 111a00
-
- 緑
-
- eeffe5
- ddffcc
- ccffb2
- bbff99
- aaff80
- 99ff66
- 88ff4c
- 77ff33
- 66ff1a
- 55ff00
- 4de500
- 44cc00
- 3cb300
- 339900
- 2b8000
- 226600
- 1a4d00
- 113300
- 091a00
-
- 青緑
-
- e5fff5
- ccffeb
- b2ffe0
- 99ffd6
- 80ffcc
- 66ffc2
- 4cffb8
- 33ffad
- 1affa3
- 00ff99
- 00e58a
- 00cc7a
- 00b36b
- 00995c
- 00804d
- 00663d
- 004d2e
- 00331f
- 001a0f
-
- 水色
-
- e5ffff
- ccffff
- b2ffff
- 99ffff
- 80ffff
- 66ffff
- 4cffff
- 33ffff
- 1affff
- 00ffff
- 00e5e5
- 00cccc
- 00b3b3
- 009999
- 008080
- 006666
- 004d4d
- 003333
- 001a1a
-
- 青A
-
- e5f5ff
- ccebff
- b2e0ff
- 99d6ff
- 80ccff
- 66c2ff
- 4cb8ff
- 33adff
- 1aa3ff
- 0099ff
- 008ae5
- 007acc
- 006bb3
- 005c99
- 004d80
- 003d66
- 002e4d
- 001f33
- 000f1a
-
- 青B
-
- e5ebff
- ccd6ff
- b2c2ff
- 99adff
- 8099ff
- 6685ff
- 4c70ff
- 335cff
- 1a47ff
- 0033ff
- 002ee5
- 0029cc
- 0024b3
- 001f99
- 001a80
- 001466
- 000f4d
- 000a33
- 00051a
-
- 紫A
-
- f5e5ff
- ebccff
- e0b2ff
- d699ff
- cc80ff
- c266ff
- b84cff
- ad33ff
- a31aff
- 9900ff
- 8a00e5
- 7a00cc
- 6b00b3
- 5c0099
- 4c0080
- 3d0066
- 2e004d
- 1f0033
- 0f001a
-
- 紫B
-
- ffe5ff
- ffccff
- ffb2ff
- ff99ff
- ff80ff
- ff66ff
- ff4cff
- ff33ff
- ff1aff
- ff00ff
- e500e5
- cc00cc
- b200b3
- 990099
- 800080
- 660066
- 4c004d
- 330033
- 1a001a
-
- ピンク
-
- ffe5f5
- ffcceb
- ffb2e0
- ff99d6
- ff80cc
- ff66c2
- ff4cb8
- ff33ad
- ff1aa3
- ff0099
- e5008a
- cc007a
- b3006b
- 99005c
- 80004d
- 66003d
- 4d002e
- 33001f
- 1a000f
コンテンツの背景色
コンテンツ部分の背景色を変更することができます。
カラーリストの開閉
コンテンツ背景なし
-
- 白黒
-
- ffffff
- f2f2f2
- e5e5e5
- d9d9d9
- cccccc
- bfbfbf
- b3b3b3
- a6a6a6
- 999999
- 8c8c8c
- 808080
- 737373
- 666666
- 595959
- 4d4d4d
- 404040
- 333333
- 1a1a1a
- 000000
-
- 赤
-
- ffe5e5
- ffcccc
- ffb2b2
- ff9999
- ff8080
- ff6666
- ff4c4c
- ff3333
- ff1a1a
- ff0000
- e50000
- cc0000
- b30000
- 990000
- 800000
- 660000
- 4d0000
- 330000
- 1a0000
-
- 橙A
-
- fff1e5
- ffe4cc
- ffd6b2
- ffc999
- ffbb80
- ffad66
- ffa04c
- ff9233
- ff851a
- ff7700
- e56b00
- cc5f00
- b35300
- 994700
- 803c00
- 663000
- 4d2400
- 331800
- 1a0c00
-
- 橙B
-
- fff9e5
- fff2cc
- ffecb2
- ffe599
- ffdf80
- ffdf80
- ffd24c
- ffcc33
- ffc61a
- ffbf00
- e5ac00
- cc9900
- b38600
- 997300
- 806000
- 664c00
- 4d3900
- 332600
- 1a1300
-
- 黄
-
- ffffe5
- ffffcc
- ffffb2
- ffff99
- ffff80
- ffff66
- ffff4c
- ffff33
- ffff1a
- ffff00
- e5e500
- cccc00
- b2b300
- 999900
- 808000
- 666600
- 4c4d00
- 333300
- 1a1a00
-
- 黄緑
-
- f7ffe5
- eeffcc
- e5ffb2
- ddff99
- d4ff80
- ccff66
- c3ff4c
- bbff33
- b2ff1a
- aaff00
- 99e500
- 88cc00
- 77b300
- 669900
- 558000
- 446600
- 334d00
- 223300
- 111a00
-
- 緑
-
- eeffe5
- ddffcc
- ccffb2
- bbff99
- aaff80
- 99ff66
- 88ff4c
- 77ff33
- 66ff1a
- 55ff00
- 4de500
- 44cc00
- 3cb300
- 339900
- 2b8000
- 226600
- 1a4d00
- 113300
- 091a00
-
- 青緑
-
- e5fff5
- ccffeb
- b2ffe0
- 99ffd6
- 80ffcc
- 66ffc2
- 4cffb8
- 33ffad
- 1affa3
- 00ff99
- 00e58a
- 00cc7a
- 00b36b
- 00995c
- 00804d
- 00663d
- 004d2e
- 00331f
- 001a0f
-
- 水色
-
- e5ffff
- ccffff
- b2ffff
- 99ffff
- 80ffff
- 66ffff
- 4cffff
- 33ffff
- 1affff
- 00ffff
- 00e5e5
- 00cccc
- 00b3b3
- 009999
- 008080
- 006666
- 004d4d
- 003333
- 001a1a
-
- 青A
-
- e5f5ff
- ccebff
- b2e0ff
- 99d6ff
- 80ccff
- 66c2ff
- 4cb8ff
- 33adff
- 1aa3ff
- 0099ff
- 008ae5
- 007acc
- 006bb3
- 005c99
- 004d80
- 003d66
- 002e4d
- 001f33
- 000f1a
-
- 青B
-
- e5ebff
- ccd6ff
- b2c2ff
- 99adff
- 8099ff
- 6685ff
- 4c70ff
- 335cff
- 1a47ff
- 0033ff
- 002ee5
- 0029cc
- 0024b3
- 001f99
- 001a80
- 001466
- 000f4d
- 000a33
- 00051a
-
- 紫A
-
- f5e5ff
- ebccff
- e0b2ff
- d699ff
- cc80ff
- c266ff
- b84cff
- ad33ff
- a31aff
- 9900ff
- 8a00e5
- 7a00cc
- 6b00b3
- 5c0099
- 4c0080
- 3d0066
- 2e004d
- 1f0033
- 0f001a
-
- 紫B
-
- ffe5ff
- ffccff
- ffb2ff
- ff99ff
- ff80ff
- ff66ff
- ff4cff
- ff33ff
- ff1aff
- ff00ff
- e500e5
- cc00cc
- b200b3
- 990099
- 800080
- 660066
- 4c004d
- 330033
- 1a001a
-
- ピンク
-
- ffe5f5
- ffcceb
- ffb2e0
- ff99d6
- ff80cc
- ff66c2
- ff4cb8
- ff33ad
- ff1aa3
- ff0099
- e5008a
- cc007a
- b3006b
- 99005c
- 80004d
- 66003d
- 4d002e
- 33001f
- 1a000f
文字の色
コンテンツ内の文字の色を変更することができます。利便性維持のため、コンテンツ内であっても一部の文字の色は変わりません。
カラーリストの開閉
-
- 白黒
-
- ffffff
- f2f2f2
- e5e5e5
- d9d9d9
- cccccc
- bfbfbf
- b3b3b3
- a6a6a6
- 999999
- 8c8c8c
- 808080
- 737373
- 666666
- 595959
- 4d4d4d
- 404040
- 333333
- 1a1a1a
- 000000
-
- 赤
-
- ffe5e5
- ffcccc
- ffb2b2
- ff9999
- ff8080
- ff6666
- ff4c4c
- ff3333
- ff1a1a
- ff0000
- e50000
- cc0000
- b30000
- 990000
- 800000
- 660000
- 4d0000
- 330000
- 1a0000
-
- 橙A
-
- fff1e5
- ffe4cc
- ffd6b2
- ffc999
- ffbb80
- ffad66
- ffa04c
- ff9233
- ff851a
- ff7700
- e56b00
- cc5f00
- b35300
- 994700
- 803c00
- 663000
- 4d2400
- 331800
- 1a0c00
-
- 橙B
-
- fff9e5
- fff2cc
- ffecb2
- ffe599
- ffdf80
- ffdf80
- ffd24c
- ffcc33
- ffc61a
- ffbf00
- e5ac00
- cc9900
- b38600
- 997300
- 806000
- 664c00
- 4d3900
- 332600
- 1a1300
-
- 黄
-
- ffffe5
- ffffcc
- ffffb2
- ffff99
- ffff80
- ffff66
- ffff4c
- ffff33
- ffff1a
- ffff00
- e5e500
- cccc00
- b2b300
- 999900
- 808000
- 666600
- 4c4d00
- 333300
- 1a1a00
-
- 黄緑
-
- f7ffe5
- eeffcc
- e5ffb2
- ddff99
- d4ff80
- ccff66
- c3ff4c
- bbff33
- b2ff1a
- aaff00
- 99e500
- 88cc00
- 77b300
- 669900
- 558000
- 446600
- 334d00
- 223300
- 111a00
-
- 緑
-
- eeffe5
- ddffcc
- ccffb2
- bbff99
- aaff80
- 99ff66
- 88ff4c
- 77ff33
- 66ff1a
- 55ff00
- 4de500
- 44cc00
- 3cb300
- 339900
- 2b8000
- 226600
- 1a4d00
- 113300
- 091a00
-
- 青緑
-
- e5fff5
- ccffeb
- b2ffe0
- 99ffd6
- 80ffcc
- 66ffc2
- 4cffb8
- 33ffad
- 1affa3
- 00ff99
- 00e58a
- 00cc7a
- 00b36b
- 00995c
- 00804d
- 00663d
- 004d2e
- 00331f
- 001a0f
-
- 水色
-
- e5ffff
- ccffff
- b2ffff
- 99ffff
- 80ffff
- 66ffff
- 4cffff
- 33ffff
- 1affff
- 00ffff
- 00e5e5
- 00cccc
- 00b3b3
- 009999
- 008080
- 006666
- 004d4d
- 003333
- 001a1a
-
- 青A
-
- e5f5ff
- ccebff
- b2e0ff
- 99d6ff
- 80ccff
- 66c2ff
- 4cb8ff
- 33adff
- 1aa3ff
- 0099ff
- 008ae5
- 007acc
- 006bb3
- 005c99
- 004d80
- 003d66
- 002e4d
- 001f33
- 000f1a
-
- 青B
-
- e5ebff
- ccd6ff
- b2c2ff
- 99adff
- 8099ff
- 6685ff
- 4c70ff
- 335cff
- 1a47ff
- 0033ff
- 002ee5
- 0029cc
- 0024b3
- 001f99
- 001a80
- 001466
- 000f4d
- 000a33
- 00051a
-
- 紫A
-
- f5e5ff
- ebccff
- e0b2ff
- d699ff
- cc80ff
- c266ff
- b84cff
- ad33ff
- a31aff
- 9900ff
- 8a00e5
- 7a00cc
- 6b00b3
- 5c0099
- 4c0080
- 3d0066
- 2e004d
- 1f0033
- 0f001a
-
- 紫B
-
- ffe5ff
- ffccff
- ffb2ff
- ff99ff
- ff80ff
- ff66ff
- ff4cff
- ff33ff
- ff1aff
- ff00ff
- e500e5
- cc00cc
- b200b3
- 990099
- 800080
- 660066
- 4c004d
- 330033
- 1a001a
-
- ピンク
-
- ffe5f5
- ffcceb
- ffb2e0
- ff99d6
- ff80cc
- ff66c2
- ff4cb8
- ff33ad
- ff1aa3
- ff0099
- e5008a
- cc007a
- b3006b
- 99005c
- 80004d
- 66003d
- 4d002e
- 33001f
- 1a000f