色相・彩度・明度によるグラデーション見本

彩度と色相によるグラデーション見本
彩度%

色相°
100908070605040302010
0#ff0000#ff1a1a#ff3333#ff4d4d#ff6666#ff8080#ff9999#ffb3b3#ffcccc#ffe6e6
15#ff4000#ff521a#ff6633#ff7a4d#ff8d66#ffa080#ffb399#ffc6b3#ffd9cc#ffede6
30#ff8000#ff8c1a#ff9933#ffa64d#ffb366#ffc080#ffcc99#ffd9b3#ffe6cc#fff3e6
45#ffc000#ffc61a#ffcc33#ffd34d#ffd966#ffe080#ffe699#ffecb3#fff3cc#fff9e6
60#ffff00#ffff1a#ffff33#ffff4d#ffff66#ffff80#ffff99#ffffb3#ffffcc#ffffe6
75#c0ff00#c6ff1a#ccff33#d3ff4d#d9ff66#e0ff80#e6ff99#ecffb3#f3ffcc#f9ffe6
90#80ff00#8dff1a#99ff33#a6ff4d#b3ff66#c0ff80#ccff99#d9ffb3#e6ffcc#f3ffe6
105#40ff00#52ff1a#66ff33#7aff4d#8dff66#a0ff80#b3ff99#c6ffb3#d9ffcc#edffe6
120#00ff00#1aff1a#33ff33#4dff4d#66ff66#80ff80#99ff99#b3ffb3#ccffcc#e6ffe6
135#00ff40#1aff52#33ff66#4dff7a#66ff8d#80ffa0#99ffb3#b3ffc6#ccffd9#e6ffed
150#00ff80#1aff8d#33ff99#4dffa6#66ffb3#80ffc0#99ffcc#b3ffd9#ccffe6#e6fff3
165#00ffc0#1affc6#33ffcc#4dffd3#66ffd9#80ffe0#99ffe6#b3ffec#ccfff3#e6fff9
180#00ffff#1affff#33ffff#4dffff#66ffff#80ffff#99ffff#b3ffff#ccffff#e6ffff
195#00c0ff#1ac6ff#33ccff#4dd3ff#66d9ff#80e0ff#99e6ff#b3ecff#ccf3ff#e6f9ff
210#0080ff#1a8cff#3399ff#4da6ff#66b3ff#80c0ff#99ccff#b3d9ff#cce6ff#e6f3ff
225#0040ff#1a52ff#3366ff#4d7aff#668dff#80a0ff#99b3ff#b3c6ff#ccd9ff#e6edff
240#0000ff#1a1aff#3333ff#4d4dff#6666ff#8080ff#9999ff#b3b3ff#ccccff#e6e6ff
255#4000ff#521aff#6633ff#7a4dff#8d66ff#a080ff#b399ff#c6b3ff#d9ccff#ede6ff
270#8000ff#8d1aff#9933ff#a64dff#b366ff#c080ff#cc99ff#d9b3ff#e6ccff#f3e6ff
285#c000ff#c61aff#cc33ff#d34dff#d966ff#e080ff#e699ff#ecb3ff#f3ccff#f9e6ff
300#ff00ff#ff1aff#ff33ff#ff4dff#ff66ff#ff80ff#ff99ff#ffb3ff#ffccff#ffe6ff
315#ff00c0#ff1ac6#ff33cc#ff4dd3#ff66d9#ff80e0#ff99e6#ffb3ec#ffccf3#ffe6f9
330#ff0080#ff1a8c#ff3399#ff4da6#ff66b3#ff80c0#ff99cc#ffb3d9#ffcce6#ffe6f3
345#ff0040#ff1a52#ff3366#ff4d7a#ff668d#ff80a0#ff99b3#ffb3c6#ffccd9#ffe6ed
色相0度における二次元グラデーション
彩度

明度
100908070605040302010
100#ff0000#ff1a1a#ff3333#ff4d4d#ff6666#ff8080#ff9999#ffb3b3#ffcccc#ffe6e6
80#cc0000#cc1414#cc2828#cc3d3d#cc5151#cc6666#cc7a7a#cc8f8f#cca3a3#ccb8b8
60#990000#990f0f#991e1e#992e2e#993d3d#994c4c#995b5b#996b6b#997a7a#998a8a
40#660000#660a0a#661414#661e1e#662828#663333#663d3d#664747#665151#665c5c
20#330000#330505#330a0a#330e0e#331414#331919#331e1e#332323#332828#332e2e
色相30度における二次元グラデーション
彩度

明度
100908070605040302010
100#ff8000#ff8c18#ff9933#ffa54b#ffb366#ffbf7e#ffcc99#ffd8b1#ffe6cc#fff2e4
80#cd6600#cd7013#cd7b29#cd843c#cd8f52#cd9965#cda47b#cdad8e#cdb8a4#cdc2b7
60#9a4d00#9a540e#9a5c1e#9a632d#9a6c3d#9a734c#9a7b5c#9a826a#9a8a7b#9a9289
40#673300#673809#673d14#67421e#674829#674d32#67523d#675747#675c52#67615c
20#331900#331c04#331e0a#33210f#332314#332619#33281e#332b23#332e28#33302d
色相60度における二次元グラデーション
彩度

明度
100908070605040302010
100#ffff00#ffff18#ffff33#ffff4b#ffff66#ffff7e#ffff99#ffffb1#ffffcc#ffffe4
80#cccc00#cccc13#cccc28#cccc3c#cccc51#cccc64#cccc7a#cccc8d#cccca3#ccccb6
60#999900#99990e#99991e#99992d#99993d#99994b#99995b#99996a#99997a#999988
40#676700#676709#676714#67671e#676729#676732#67673d#676747#676752#67675c
20#353500#353504#35350a#35350f#353515#35351a#35351f#353524#35352a#35352f
色相90度における二次元グラデーション
彩度

明度
100908070605040302010
100#80ff00#8cff18#99ff33#a5ff4b#b3ff66#bfff7e#ccff99#d8ffb1#e6ffcc#f2ffe4
80#66cd00#70cd13#7bcd29#84cd3c#8fcd52#99cd65#a4cd7b#adcd8e#b8cda4#c2cdb7
60#4d9b00#559b0e#5d9b1f#649b2d#6c9b3e#749b4c#7c9b5d#839b6b#8b9b7c#939b8a
40#336700#386709#3d6714#42671e#486729#4d6732#52673d#576747#5c6752#61675c
20#1a3500#1d3504#1f350a#22350f#253515#27351a#2a351f#2c3524#2f352a#32352f
色相120度における二次元グラデーション
彩度

明度
100908070605040302010
100#00ff00#18ff18#33ff33#4bff4b#66ff66#7eff7e#99ff99#b1ffb1#ccffcc#e4ffe4
80#00cd00#13cd13#29cd29#3ccd3c#52cd52#65cd65#7bcd7b#8ecd8e#a4cda4#b7cdb7
60#009b00#0e9b0e#1f9b1f#2d9b2d#3e9b3e#4c9b4c#5d9b5d#6b9b6b#7c9b7c#8a9b8a
40#006600#096609#146614#1e661e#286628#326632#3d663d#466646#516651#5b665b
20#003300#043304#0a330a#0f330f#143314#193319#1e331e#233323#283328#2d332d
色相150度における二次元グラデーション
彩度

明度
100908070605040302010
100#00ff80#18ff8c#33ff99#4bffa5#66ffb3#7effbf#99ffcc#b1ffd8#ccffe6#e4fff2
80#00cd66#13cd70#29cd7b#3ccd84#52cd8f#65cd99#7bcda4#8ecdad#a4cdb8#b7cdc2
60#009b4d#0e9b55#1f9b5d#2d9b64#3e9b6c#4c9b74#5d9b7c#6b9b83#7c9b8b#8a9b93
40#006834#096839#14683e#1e6843#296849#33684d#3e6853#486858#53685d#5c6862
20#003319#04331c#0a331e#0f3321#143323#193326#1e3328#23332b#28332e#2d3330
色相180度における二次元グラデーション
彩度

明度
100908070605040302010
100#00ffff#18ffff#33ffff#4bffff#66ffff#7effff#99ffff#b1ffff#ccffff#e4ffff
80#00cece#13cece#29cece#3ccece#52cece#65cece#7bcece#8ecece#a4cece#b8cece
60#009a9a#0e9a9a#1e9a9a#2d9a9a#3d9a9a#4c9a9a#5c9a9a#6a9a9a#7b9a9a#899a9a
40#006767#096767#146767#1e6767#296767#326767#3d6767#476767#526767#5c6767
20#003434#043434#0a3434#0f3434#143434#193434#1f3434#243434#293434#2e3434
色相210度における二次元グラデーション
彩度

明度
100908070605040302010
100#0080ff#188cff#3399ff#4ba5ff#66b3ff#7ebfff#99ccff#b1d8ff#cce6ff#e4f2ff
80#0067ce#1371ce#297bce#3c85ce#5290ce#659ace#7ba4ce#8eaece#a4b9ce#b8c3ce
60#004c99#0e5499#1e5b99#2d6399#3d6b99#4b7299#5b7a99#6a8199#7a8a99#889199
40#003366#093866#143d66#1e4266#284766#324c66#3d5166#465666#515c66#5b6066
20#001a34#041c34#0a1f34#0f2134#142434#192634#1f2934#242c34#292e34#2e3134
色相240度における二次元グラデーション
彩度

明度
100908070605040302010
100#0000ff#1818ff#3333ff#4b4bff#6666ff#7e7eff#9999ff#b1b1ff#ccccff#e4e4ff
80#0000ce#1313ce#2929ce#3c3cce#5252ce#6565ce#7b7bce#8e8ece#a4a4ce#b8b8ce
60#00009b#0e0e9b#1f1f9b#2d2d9b#3e3e9b#4c4c9b#5d5d9b#6b6b9b#7c7c9b#8a8a9b
40#000067#090967#141467#1e1e67#292967#323267#3d3d67#474767#525267#5c5c67
20#000033#040434#0a0a34#0f0f34#141434#191934#1f1f34#242434#292934#2e2e34
色相270度における二次元グラデーション
彩度

明度
100908070605040302010
100#8000ff#8c18ff#9933ff#a54bff#b366ff#bf7eff#cc99ff#d8b1ff#e6ccff#f2e4ff
80#6700ce#7113ce#7b29ce#853cce#9052ce#9a65ce#a47bce#ae8ece#b9a4ce#c3b8ce
60#4d009a#540e9a#5c1e9a#632d9a#6c3d9a#734c9a#7b5c9a#826a9a#8a7b9a#92899a
40#330067#380967#3d1467#421e67#482967#4d3267#523d67#574767#5c5267#615c67
20#1a0035#1d0435#1f0a35#220f35#251535#271a35#2a1f35#2c2435#2f2a35#322f35
色相300度における二次元グラデーション
彩度

明度
100908070605040302010
100#ff00ff#ff18ff#ff33ff#ff4bff#ff66ff#ff7eff#ff99ff#ffb1ff#ffccff#ffe4ff
80#ce00ce#ce13ce#ce29ce#ce3cce#ce52ce#ce65ce#ce7bce#ce8ece#cea4ce#ceb8ce
60#9a009a#9a0e9a#9a1e9a#9a2d9a#9a3d9a#9a4c9a#9a5c9a#9a6a9a#9a7b9a#9a899a
40#660066#660966#661466#661e66#662866#663266#663d66#664666#665166#665b66
20#340034#340434#340a34#340f34#341434#341934#341f34#342434#342934#342e34
色相330度における二次元グラデーション
彩度

明度
100908070605040302010
100#ff0080#ff188c#ff3399#ff4ba5#ff66b3#ff7ebf#ff99cc#ffb1d8#ffcce6#ffe4f2
80#ce0067#ce1371#ce297b#ce3c85#ce5290#ce659a#ce7ba4#ce8eae#cea4b9#ceb8c3
60#9a004d#9a0e54#9a1e5c#9a2d63#9a3d6c#9a4c73#9a5c7b#9a6a82#9a7b8a#9a8992
40#660033#660938#66143d#661e42#662847#66324c#663d51#664656#66515c#665b60
20#330019#33041c#330a1e#330f21#331423#331926#331e28#33232b#33282e#332d30

色相・彩度・明度によるグラデーション見本.
The PC resources. valid XHTML 1.0 Strict. ©2006.09.11 by mezala.