Web色画像変換

色とWebデザインに関するサイト,ホームページ制作のサポートツール, WEBや印刷で使う色 ,配色,dic,pantone(パントーン),16進数,cmyk

web(ホームページ) 制作

web 作成 色

ホームページ 作成 背景 色 一覧





全体的な 背景色
#ffe6e6#ffcccc#ffb3b3#ff9999#ff8080#ff6666#ff4d4d#ff3333#ff1a1a#ff0000
#ffeee6#ffddcc#ffccb3#ffbb99#ffaa80#ff9966#ff884d#ff7733#ff661a#ff5500
#fff7e6#ffeecc#ffe6b3#ffdd99#ffd580#ffcc66#ffc44d#ffbb33#ffb31a#ffaa00
#ffffe6#ffffcc#ffffb3#ffff99#ffff80#ffff66#ffff4d#ffff33#ffff1a#ffff00
#f7ffe6#eeffcc#e6ffb3#ddff99#d5ff80#ccff66#c4ff4d#bbff33#b3ff1a#aaff00
#eeffe6#ddffcc#ccffb3#bbff99#aaff80#99ff66#88ff4d#77ff33#66ff1a#55ff00
#e6ffe6#ccffcc#b3ffb3#99ff99#80ff80#66ff66#4dff4d#33ff33#1aff1a#00ff00
#e6ffee#ccffdd#b3ffcc#99ffbb#80ffaa#66ff99#4dff88#33ff77#1aff66#00ff55
#e6fff7#ccffee#b3ffe6#99ffdd#80ffd5#66ffcc#4dffc4#33ffbb#1affb3#00ffaa
#e6ffff#ccffff#b3ffff#99ffff#80ffff#66ffff#4dffff#33ffff#1affff#00ffff
#e6f7ff#cceeff#b3e6ff#99ddff#80d5ff#66ccff#4dc4ff#33bbff#1ab3ff#00aaff
#e6eeff#ccddff#b3ccff#99bbff#80aaff#6699ff#4d88ff#3377ff#1a66ff#0055ff
#e6e6ff#ccccff#b3b3ff#9999ff#8080ff#6666ff#4d4dff#3333ff#1a1aff#0000ff
#eee6ff#ddccff#ccb3ff#bb99ff#aa80ff#9966ff#884dff#7733ff#661aff#5500ff
#f7e6ff#eeccff#e6b3ff#dd99ff#d580ff#cc66ff#c44dff#bb33ff#b31aff#aa00ff
#ffe6ff#ffccff#ffb3ff#ff99ff#ff80ff#ff66ff#ff4dff#ff33ff#ff1aff#ff00ff
#ffe6f7#ffccee#ffb3e6#ff99dd#ff80d5#ff66cc#ff4dc4#ff33bb#ff1ab3#ff00aa
#ffe6ee#ffccdd#ffb3cc#ff99bb#ff80aa#ff6699#ff4d88#ff3377#ff1a66#ff0055
薄い赤 背景色
#ff0055#ff1a66#ff3377#ff4d88#ff6699#ff80aa#ff99bb#ffb3cc#ffccdd#ffe6ee
#e6004c#e6175c#e62e6b#e6457a#e65c8a#e67399#e68aa8#e6a1b8#e6b8c7#e6cfd6
#cc0044#cc1452#cc295f#cc3d6d#cc527a#cc6688#cc7a96#cc8fa3#cca3b1#ccb8be
#b3003b#b31247#b32453#b3365f#b3476b#b35977#b36b83#b37d8f#b38f9b#b3a1a7
#990033#990f3d#991f47#992e52#993d5c#994d66#995c70#996b7a#997a85#998a8f
#80002b#800d33#801a3c#802644#80334d#804055#804d5e#805966#80666f#807377
#660022#660a29#661430#661f36#66293d#663344#663d4b#664752#665258#665c5f
#4d001a#4d081f#4d0f24#4d1729#4d1f2e#4d2633#4d2e38#4d363d#4d3d42#4d4547
#330011#330514#330a18#330f1b#33141f#331a22#331f25#332429#33292c#332e30
ピンクより赤 背景色
#ff00aa#ff1ab3#ff33bb#ff4dc4#ff66cc#ff80d5#ff99dd#ffb3e6#ffccee#ffe6f7
#e60099#e617a1#e62ea8#e645b0#e65cb8#e673bf#e68ac7#e6a1cf#e6b8d6#e6cfde
#cc0088#cc148f#cc2996#cc3d9c#cc52a3#cc66aa#cc7ab1#cc8fb8#cca3be#ccb8c5
#b30077#b3127d#b32483#b33689#b3478f#b35995#b36b9b#b37da1#b38fa7#b3a1ad
#990066#990f6b#991f70#992e75#993d7a#994d80#995c85#996b8a#997a8f#998a94
#800055#800d59#801a5e#802662#803366#80406a#804d6f#805973#806677#80737b
#660044#660a47#66144b#661f4e#662952#663355#663d58#66475c#66525f#665c63
#4d0033#4d0836#4d0f38#4d173b#4d1f3d#4d2640#4d2e42#4d3645#4d3d47#4d454a
#330022#330524#330a25#330f27#331429#331a2b#331f2c#33242e#332930#332e31
ピンク 背景色
#ff00ff#ff1aff#ff33ff#ff4dff#ff66ff#ff80ff#ff99ff#ffb3ff#ffccff#ffe6ff
#e600e6#e617e6#e62ee6#e645e6#e65ce6#e673e6#e68ae6#e6a1e6#e6b8e6#e6cfe6
#cc00cc#cc14cc#cc29cc#cc3dcc#cc52cc#cc66cc#cc7acc#cc8fcc#cca3cc#ccb8cc
#b300b3#b312b3#b324b3#b336b3#b347b3#b359b3#b36bb3#b37db3#b38fb3#b3a1b3
#990099#990f99#991f99#992e99#993d99#994d99#995c99#996b99#997a99#998a99
#800080#800d80#801a80#802680#803380#804080#804d80#805980#806680#807380
#660066#660a66#661466#661f66#662966#663366#663d66#664766#665266#665c66
#4d004d#4d084d#4d0f4d#4d174d#4d1f4d#4d264d#4d2e4d#4d364d#4d3d4d#4d454d
#330033#330533#330a33#330f33#331433#331a33#331f33#332433#332933#332e33
紫 背景色
#aa00ff#b31aff#bb33ff#c44dff#cc66ff#d580ff#dd99ff#e6b3ff#eeccff#f7e6ff
#9900e6#a117e6#a82ee6#b045e6#b85ce6#bf73e6#c78ae6#cfa1e6#d6b8e6#decfe6
#8800cc#8f14cc#9629cc#9c3dcc#a352cc#aa66cc#b17acc#b88fcc#bea3cc#c5b8cc
#7700b3#7d12b3#8324b3#8936b3#8f47b3#9559b3#9b6bb3#a17db3#a78fb3#ada1b3
#660099#6b0f99#701f99#752e99#7a3d99#804d99#855c99#8a6b99#8f7a99#948a99
#550080#590d80#5e1a80#622680#663380#6a4080#6f4d80#735980#776680#7b7380
#440066#470a66#4b1466#4e1f66#522966#553366#583d66#5c4766#5f5266#635c66
#33004d#36084d#380f4d#3b174d#3d1f4d#40264d#422e4d#45364d#473d4d#4a454d
#220033#240533#250a33#270f33#291433#2b1a33#2c1f33#2e2433#302933#312e33
紫より青 背景色
#5500ff#661aff#7733ff#884dff#9966ff#aa80ff#bb99ff#ccb3ff#ddccff#eee6ff
#4c00e6#5c17e6#6b2ee6#7a45e6#8a5ce6#9973e6#a88ae6#b8a1e6#c7b8e6#d6cfe6
#4400cc#5214cc#5f29cc#6d3dcc#7a52cc#8866cc#967acc#a38fcc#b1a3cc#beb8cc
#3b00b3#4712b3#5324b3#5f36b3#6b47b3#7759b3#836bb3#8f7db3#9b8fb3#a7a1b3
#330099#3d0f99#471f99#522e99#5c3d99#664d99#705c99#7a6b99#857a99#8f8a99
#2b0080#330d80#3c1a80#442680#4d3380#554080#5e4d80#665980#6f6680#777380
#220066#290a66#301466#361f66#3d2966#443366#4b3d66#524766#585266#5f5c66
#1a004d#1f084d#240f4d#29174d#2e1f4d#33264d#382e4d#3d364d#423d4d#47454d
#110033#140533#180a33#1b0f33#1f1433#221a33#251f33#292433#2c2933#302e33
青 背景色
#0000ff#1a1aff#3333ff#4d4dff#6666ff#8080ff#9999ff#b3b3ff#ccccff#e6e6ff
#0000e6#1717e6#2e2ee6#4545e6#5c5ce6#7373e6#8a8ae6#a1a1e6#b8b8e6#cfcfe6
#0000cc#1414cc#2929cc#3d3dcc#5252cc#6666cc#7a7acc#8f8fcc#a3a3cc#b8b8cc
#0000b3#1212b3#2424b3#3636b3#4747b3#5959b3#6b6bb3#7d7db3#8f8fb3#a1a1b3
#000099#0f0f99#1f1f99#2e2e99#3d3d99#4d4d99#5c5c99#6b6b99#7a7a99#8a8a99
#000080#0d0d80#1a1a80#262680#333380#404080#4d4d80#595980#666680#737380
#000066#0a0a66#141466#1f1f66#292966#333366#3d3d66#474766#525266#5c5c66
#00004d#08084d#0f0f4d#17174d#1f1f4d#26264d#2e2e4d#36364d#3d3d4d#45454d
#000033#050533#0a0a33#0f0f33#141433#1a1a33#1f1f33#242433#292933#2e2e33
薄い青 背景色
#0055ff#1a66ff#3377ff#4d88ff#6699ff#80aaff#99bbff#b3ccff#ccddff#e6eeff
#004de6#175ce6#2e6be6#457ae6#5c8ae6#7399e6#8aa8e6#a1b8e6#b8c7e6#cfd6e6
#0044cc#1452cc#295fcc#3d6dcc#527acc#6688cc#7a96cc#8fa3cc#a3b1cc#b8becc
#003cb3#1247b3#2453b3#365fb3#476bb3#5977b3#6b83b3#7d8fb3#8f9bb3#a1a7b3
#003399#0f3d99#1f4799#2e5299#3d5c99#4d6699#5c7099#6b7a99#7a8599#8a8f99
#002b80#0d3380#1a3c80#264480#334d80#405580#4d5e80#596680#666f80#737780
#002266#0a2966#143066#1f3666#293d66#334466#3d4b66#475266#525866#5c5f66
#001a4d#081f4d#0f244d#17294d#1f2e4d#26334d#2e384d#363d4d#3d424d#45474d
#001133#051433#0a1833#0f1b33#141f33#1a2233#1f2533#242933#292c33#2e3033
水色より青 背景色
#00aaff#1ab3ff#33bbff#4dc4ff#66ccff#80d5ff#99ddff#b3e6ff#cceeff#e6f7ff
#0099e6#17a1e6#2ea8e6#45b0e6#5cb8e6#73bfe6#8ac7e6#a1cfe6#b8d6e6#cfdee6
#0088cc#148fcc#2996cc#3d9ccc#52a3cc#66aacc#7ab1cc#8fb8cc#a3becc#b8c5cc
#0077b3#127db3#2483b3#3689b3#478fb3#5995b3#6b9bb3#7da1b3#8fa7b3#a1adb3
#006699#0f6b99#1f7099#2e7599#3d7a99#4d8099#5c8599#6b8a99#7a8f99#8a9499
#005580#0d5980#1a5e80#266280#336680#406a80#4d6f80#597380#667780#737b80
#004466#0a4766#144b66#1f4e66#295266#335566#3d5866#475c66#525f66#5c6366
#00334d#08364d#0f384d#173b4d#1f3d4d#26404d#2e424d#36454d#3d474d#454a4d
#002233#052433#0a2533#0f2733#142933#1a2b33#1f2c33#242e33#293033#2e3133
水色 背景色
#00ffff#1affff#33ffff#4dffff#66ffff#80ffff#99ffff#b3ffff#ccffff#e6ffff
#00e6e6#17e6e6#2ee6e6#45e6e6#5ce6e6#73e6e6#8ae6e6#a1e6e6#b8e6e6#cfe6e6
#00cccc#14cccc#29cccc#3dcccc#52cccc#66cccc#7acccc#8fcccc#a3cccc#b8cccc
#00b3b3#12b3b3#24b3b3#36b3b3#47b3b3#59b3b3#6bb3b3#7db3b3#8fb3b3#a1b3b3
#009999#0f9999#1f9999#2e9999#3d9999#4d9999#5c9999#6b9999#7a9999#8a9999
#008080#0d8080#1a8080#268080#338080#408080#4d8080#598080#668080#738080
#006666#0a6666#146666#1f6666#296666#336666#3d6666#476666#526666#5c6666
#004d4d#084d4d#0f4d4d#174d4d#1f4d4d#264d4d#2e4d4d#364d4d#3d4d4d#454d4d
#003333#053333#0a3333#0f3333#143333#1a3333#1f3333#243333#293333#2e3333
青より緑 背景色
#00ffaa#1affb3#33ffbb#4dffc4#66ffcc#80ffd5#99ffdd#b3ffe6#ccffee#e6fff7
#00e699#17e6a1#2ee6a8#45e6b0#5ce6b8#73e6bf#8ae6c7#a1e6cf#b8e6d6#cfe6de
#00cc88#14cc8f#29cc96#3dcc9c#52cca3#66ccaa#7accb1#8fccb8#a3ccbe#b8ccc5
#00b377#12b37d#24b383#36b389#47b38f#59b395#6bb39b#7db3a1#8fb3a7#a1b3ad
#009966#0f996b#1f9970#2e9975#3d997a#4d9980#5c9985#6b998a#7a998f#8a9994
#008055#0d8059#1a805e#268062#338066#40806a#4d806f#598073#668077#73807b
#006644#0a6647#14664b#1f664e#296652#336655#3d6658#47665c#52665f#5c6663
#004d33#084d36#0f4d38#174d3b#1f4d3d#264d40#2e4d42#364d45#3d4d47#454d4a
#003322#053324#0a3325#0f3327#143329#1a332b#1f332c#24332e#293330#2e3331
薄い緑 背景色
#00ff55#1aff66#33ff77#4dff88#66ff99#80ffaa#99ffbb#b3ffcc#ccffdd#e6ffee
#00e64d#17e65c#2ee66b#45e67a#5ce68a#73e699#8ae6a8#a1e6b8#b8e6c7#cfe6d6
#00cc44#14cc52#29cc5f#3dcc6d#52cc7a#66cc88#7acc96#8fcca3#a3ccb1#b8ccbe
#00b33c#12b347#24b353#36b35f#47b36b#59b377#6bb383#7db38f#8fb39b#a1b3a7
#009933#0f993d#1f9947#2e9952#3d995c#4d9966#5c9970#6b997a#7a9985#8a998f
#00802b#0d8033#1a803c#268044#33804d#408055#4d805e#598066#66806f#738077
#006622#0a6629#146630#1f6636#29663d#336644#3d664b#476652#526658#5c665f
#004d1a#084d1f#0f4d24#174d29#1f4d2e#264d33#2e4d38#364d3d#3d4d42#454d47
#003311#053314#0a3318#0f331b#14331f#1a3322#1f3325#243329#29332c#2e3330
緑 背景色
#00ff00#1aff1a#33ff33#4dff4d#66ff66#80ff80#99ff99#b3ffb3#ccffcc#e6ffe6
#00e600#17e617#2ee62e#45e645#5ce65c#73e673#8ae68a#a1e6a1#b8e6b8#cfe6cf
#00cc00#14cc14#29cc29#3dcc3d#52cc52#66cc66#7acc7a#8fcc8f#a3cca3#b8ccb8
#00b300#12b312#24b324#36b336#47b347#59b359#6bb36b#7db37d#8fb38f#a1b3a1
#009900#0f990f#1f991f#2e992e#3d993d#4d994d#5c995c#6b996b#7a997a#8a998a
#008000#0d800d#1a801a#268026#338033#408040#4d804d#598059#668066#738073
#006600#0a660a#146614#1f661f#296629#336633#3d663d#476647#526652#5c665c
#004d00#084d08#0f4d0f#174d17#1f4d1f#264d26#2e4d2e#364d36#3d4d3d#454d45
#003300#053305#0a330a#0f330f#143314#1a331a#1f331f#243324#293329#2e332e
黄緑 背景色
#55ff00#66ff1a#77ff33#88ff4d#99ff66#aaff80#bbff99#ccffb3#ddffcc#eeffe6
#4de600#5ce617#6be62e#7ae645#8ae65c#99e673#a8e68a#b8e6a1#c7e6b8#d6e6cf
#44cc00#52cc14#5fcc29#6dcc3d#7acc52#88cc66#96cc7a#a3cc8f#b1cca3#beccb8
#3cb300#47b312#53b324#5fb336#6bb347#77b359#83b36b#8fb37d#9bb38f#a7b3a1
#339900#3d990f#47991f#52992e#5c993d#66994d#70995c#7a996b#85997a#8f998a
#2b8000#33800d#3c801a#448026#4d8033#558040#5e804d#668059#6f8066#778073
#226600#29660a#306614#36661f#3d6629#446633#4b663d#526647#586652#5f665c
#1a4d00#1f4d08#244d0f#294d17#2e4d1f#334d26#384d2e#3d4d36#424d3d#474d45
#113300#143305#18330a#1b330f#1f3314#22331a#25331f#293324#2c3329#30332e
薄い黄緑 背景色
#aaff00#b3ff1a#bbff33#c4ff4d#ccff66#d5ff80#ddff99#e6ffb3#eeffcc#f7ffe6
#99e600#a1e617#a8e62e#b0e645#b8e65c#bfe673#c7e68a#cfe6a1#d6e6b8#dee6cf
#88cc00#8fcc14#96cc29#9ccc3d#a3cc52#aacc66#b1cc7a#b8cc8f#becca3#c5ccb8
#77b300#7db312#83b324#89b336#8fb347#95b359#9bb36b#a1b37d#a7b38f#adb3a1
#669900#6b990f#70991f#75992e#7a993d#80994d#85995c#8a996b#8f997a#94998a
#558000#59800d#5e801a#628026#668033#6a8040#6f804d#738059#778066#7b8073
#446600#47660a#4b6614#4e661f#526629#556633#58663d#5c6647#5f6652#63665c
#334d00#364d08#384d0f#3b4d17#3d4d1f#404d26#424d2e#454d36#474d3d#4a4d45
#223300#243305#25330a#27330f#293314#2b331a#2c331f#2e3324#303329#31332e
黄色 背景色
#ffff00#ffff1a#ffff33#ffff4d#ffff66#ffff80#ffff99#ffffb3#ffffcc#ffffe6
#e6e600#e6e617#e6e62e#e6e645#e6e65c#e6e673#e6e68a#e6e6a1#e6e6b8#e6e6cf
#cccc00#cccc14#cccc29#cccc3d#cccc52#cccc66#cccc7a#cccc8f#cccca3#ccccb8
#b3b300#b3b312#b3b324#b3b336#b3b347#b3b359#b3b36b#b3b37d#b3b38f#b3b3a1
#999900#99990f#99991f#99992e#99993d#99994d#99995c#99996b#99997a#99998a
#808000#80800d#80801a#808026#808033#808040#80804d#808059#808066#808073
#666600#66660a#666614#66661f#666629#666633#66663d#666647#666652#66665c
#4d4d00#4d4d08#4d4d0f#4d4d17#4d4d1f#4d4d26#4d4d2e#4d4d36#4d4d3d#4d4d45
#333300#333305#33330a#33330f#333314#33331a#33331f#333324#333329#33332e
オレンジ 背景色
#ffaa00#ffb31a#ffbb33#ffc44d#ffcc66#ffd580#ffdd99#ffe6b3#ffeecc#fff7e6
#e69900#e6a117#e6a82e#e6b045#e6b85c#e6bf73#e6c78a#e6cfa1#e6d6b8#e6decf
#cc8800#cc8f14#cc9629#cc9c3d#cca352#ccaa66#ccb17a#ccb88f#ccbea3#ccc5b8
#b37700#b37d12#b38324#b38936#b38f47#b39559#b39b6b#b3a17d#b3a78f#b3ada1
#996600#996b0f#99701f#99752e#997a3d#99804d#99855c#998a6b#998f7a#99948a
#805500#80590d#805e1a#806226#806633#806a40#806f4d#807359#807766#807b73
#664400#66470a#664b14#664e1f#665229#665533#66583d#665c47#665f52#66635c
#4d3300#4d3608#4d380f#4d3b17#4d3d1f#4d4026#4d422e#4d4536#4d473d#4d4a45
#332200#332405#33250a#33270f#332914#332b1a#332c1f#332e24#333029#33312e
橙 背景色
#ff5500#ff661a#ff7733#ff884d#ff9966#ffaa80#ffbb99#ffccb3#ffddcc#ffeee6
#e64d00#e65c17#e66b2e#e67a45#e68a5c#e69973#e6a88a#e6b8a1#e6c7b8#e6d6cf
#cc4400#cc5214#cc5f29#cc6d3d#cc7a52#cc8866#cc967a#cca38f#ccb1a3#ccbeb8
#b33c00#b34712#b35324#b35f36#b36b47#b37759#b3836b#b38f7d#b39b8f#b3a7a1
#993300#993d0f#99471f#99522e#995c3d#99664d#99705c#997a6b#99857a#998f8a
#802b00#80330d#803c1a#804426#804d33#805540#805e4d#806659#806f66#807773
#662200#66290a#663014#66361f#663d29#664433#664b3d#665247#665852#665f5c
#4d1a00#4d1f08#4d240f#4d2917#4d2e1f#4d3326#4d382e#4d3d36#4d423d#4d4745
#331100#331405#33180a#331b0f#331f14#33221a#33251f#332924#332c29#33302e
赤色 背景色
#ff0000#ff1a1a#ff3333#ff4d4d#ff6666#ff8080#ff9999#ffb3b3#ffcccc#ffe6e6
#e60000#e61717#e62e2e#e64545#e65c5c#e67373#e68a8a#e6a1a1#e6b8b8#e6cfcf
#cc0000#cc1414#cc2929#cc3d3d#cc5252#cc6666#cc7a7a#cc8f8f#cca3a3#ccb8b8
#b30000#b31212#b32424#b33636#b34747#b35959#b36b6b#b37d7d#b38f8f#b3a1a1
#990000#990f0f#991f1f#992e2e#993d3d#994d4d#995c5c#996b6b#997a7a#998a8a
#800000#800d0d#801a1a#802626#803333#804040#804d4d#805959#806666#807373
#660000#660a0a#661414#661f1f#662929#663333#663d3d#664747#665252#665c5c
#4d0000#4d0808#4d0f0f#4d1717#4d1f1f#4d2626#4d2e2e#4d3636#4d3d3d#4d4545
#330000#330505#330a0a#330f0f#331414#331a1a#331f1f#332424#332929#332e2e

web 作成 色 説明

ホームページ 作成に使える背景色の一覧
載せているページ。

文字をクリックするとカラーコードをコピーします。
cssなどのstyle  background-colorで文字色を指定する場合に利用。

カラーコード設定

カラーコード6桁
RGBのコード
カラーコード3桁
を変更して表示できます。

どの指定でもcssなどのstyleに使って背景色が設定できますが
お好みで変更できます。

カラーコード6桁
通常の16進数 6桁のカラーコード
一般的に色の指定によく使われる。

RGBのコード
こちらでもcss等で指定可能、赤、青、緑の値の
割合なので赤青緑の特定の色に近いもの指定する場合
直感的にわかりやすい。

カラーコード3桁
16進数のカラーコード 3桁で色を表したもの。

tag:16進数, hp 作成, hp作成 ツール 無料, rgb, web 作成, web 作成 ツール, web 制作, ホームページ 作成 コード, ホームページ 作成 個人, ホームページ 制作, 一覧, 色見本,



記事
cmyk 色見本

cmyk RGB 変換 使い方 CMYK⇔RGBの相互変換可能なWEBツールです。 RGBやcmyk…

補色 ツール 自動変換

    補色 ツールの説明 この補色 ツールはRGBやCMYKの値から自動的に捕…

カラー パレット 作成 パステル

カラー パレット 作成 パステル 説明 パステル調の色でカラー パレットを作成するツール。 絵具のパ…