色相別 配色パターン 全275色:コピペで使える Web カラーコード & RGB 付



「赤」「橙」「黄」「緑」「水」「青」「紫」「桃」「茶」「白」「黒」。代表的な11種類の色を系統別に、25の配色パターンを組んだ。

「相性の良い色」「類似色」「ベースカラー・メインカラー・アクセントカラー」などのカラーチャートとしても、直感的に好きな色を選べるようにもなっている。伝わりやすいように「白背景」と「黒背景」の項目も設けた。




red-w.png

red-b.png

red

__ #d7322e / rgb(215,50,46)
__ #a94050 / rgb(169,64,80)
__ #df334e / rgb(223,51,78)
__ #871c40 / rgb(135,28,64)
__ #a83250 / rgb(168,50,80)
__ #a1272e / rgb(161,39,46)
__ #a41919 / rgb(164,25,25)
__ #972c47 / rgb(151,44,71)
__ #ff0000 / rgb(255,0,0)
__ #cd2d37 / rgb(205,45,55)
__ #994639 / rgb(153,70,57)
__ #c6001c / rgb(198,,28)
__ #9b1c38 / rgb(155,28,56)
__ #a6594f / rgb(166,89,79)
__ #ce2143 / rgb(206,33,67)
__ #58333d / rgb(88,51,61)
__ #b0152f / rgb(176,21,47)
__ #ef454a / rgb(239,69,74)
__ #be4943 / rgb(190,73,67)
__ #fd3c2f / rgb(253,60,47)
__ #b68988 / rgb(182,137,136)
__ #f05491 / rgb(240,84,145)
__ #bb004b / rgb(187,0,75)
__ #6c1d29 / rgb(108,29,41)
__ #8d5355 / rgb(141,83,85)





orange on white

orange on black

orange

__ #f2b33d / rgb(242,179,61)
__ #e65c2e / rgb(230,92,46)
__ #e8b647 / rgb(232,182,71)
__ #a7663b / rgb(167,102,59)
__ #df7704 / rgb(223,119,4)
__ #fc9d75 / rgb(252,157,117)
__ #d89f6d / rgb(216,159,109)
__ #e3be88 / rgb(227,190,136)
__ #ab4a20 / rgb(171,74,32)
__ #eea057 / rgb(238,160,87)
__ #f15d30 / rgb(241,93,48)
__ #a36851 / rgb(163,104,81)
__ #d86554 / rgb(216,101,84)
__ #f2b16a / rgb(242,177,106)
__ #e77f68 / rgb(231,127,104)
__ #f4c07a / rgb(244,192,122)
__ #a2553c / rgb(162,85,60)
__ #ffb000 / rgb(255,176,0)
__ #ffdead / rgb(255,222,173)
__ #fd734a / rgb(253,115,74)
__ #fec317 / rgb(254,195,23)
__ #f49b83 / rgb(244,155,131)
__ #e2694a / rgb(226,105,74)
__ #cd6349 / rgb(205,99,73)
__ #ffa500 / rgb(255,165,0)





yellow on white

yellow on black

yellow

__ #db913d / rgb(219,145,61)
__ #fad26a / rgb(250,210,106)
__ #b67b3d / rgb(182,123,61)
__ #ffff33 / rgb(255,255,51)
__ #f6e078 / rgb(246,224,120)
__ #d1884b / rgb(209,136,75)
__ #f8a900 / rgb(248,169,0)
__ #ffd12a / rgb(255,209,42)
__ #eec600 / rgb(238,198,0)
__ #f9f06f / rgb(249,240,111)
__ #f4d500 / rgb(244,213,0)
__ #b9824d / rgb(185,130,77)
__ #f4e200 / rgb(244,226,0)
__ #e9d0a5 / rgb(233,208,165)
__ #eec063 / rgb(238,192,99)
__ #ffa822 / rgb(255,168,34)
__ #dc915b / rgb(220,145,91)
__ #fdd200 / rgb(253,210,0)
__ #f3e1bc / rgb(243,225,188)
__ #f8d28b / rgb(248,210,139)
__ #efe9d1 / rgb(239,233,209)
__ #f7ca79 / rgb(247,202,121)
__ #ecdf2b / rgb(236,223,43)
__ #fbe000 / rgb(251,224,0)
__ #b1632a / rgb(177,99,42)





green on white

green on black

green

__ #00a474 / rgb(0,164,116)
__ #93b37a / rgb(147,179,122)
__ #787a59 / rgb(120,122,89)
__ #2b907a / rgb(43,144,122)
__ #99ff99 / rgb(153,255,153)
__ #b1c6ae / rgb(177,198,174)
__ #265a3c / rgb(38,90,60)
__ #43a12f / rgb(67,161,47)
__ #446952 / rgb(68,105,82)
__ #aab08a / rgb(170,176,138)
__ #00934e / rgb(0,147,78)
__ #99c764 / rgb(153,199,100)
__ #97b64d / rgb(151,182,77)
__ #4a593d / rgb(74,89,61)
__ #4f9909 / rgb(79,153,9)
__ #8f9830 / rgb(143,152,48)
__ #94925f / rgb(148,146,95)
__ #007f82 / rgb(0,127,130)
__ #a2b1a4 / rgb(162,177,164)
__ #66ff99 / rgb(102,255,153)
__ #008054 / rgb(0,128,84)
__ #6f8d1b / rgb(111,141,27)
__ #66cc99 / rgb(102,204,153)
__ #7b8f8a / rgb(123,143,138)
__ #7e9b8d / rgb(126,155,141)





cyan on white

cyan on black

cyan

__ #33cc99 / rgb(51,204,153)
__ #33ffff / rgb(51,255,255)
__ #b0e0e6 / rgb(176,224,230)
__ #f0ffff / rgb(240,255,255)
__ #d4e6e0 / rgb(212,230,224)
__ #4a807b / rgb(74,128,123)
__ #5dad94 / rgb(93,173,148)
__ #e0ffff / rgb(224,255,255)
__ #33cccc / rgb(51,204,204)
__ #f6fbf6 / rgb(246,251,246)
__ #a3bacd / rgb(163,186,205)
__ #87cefa / rgb(135,206,250)
__ #2595c7 / rgb(37,149,199)
__ #89aaab / rgb(137,170,171)
__ #69abdb / rgb(105,171,219)
__ #3d8e95 / rgb(61,142,149)
__ #66898f / rgb(102,137,143)
__ #52c4c5 / rgb(82,196,197)
__ #679d9f / rgb(103,157,159)
__ #66ccff / rgb(102,204,255)
__ #99ffcc / rgb(153,255,204)
__ #5e90b3 / rgb(94,144,179)
__ #6da895 / rgb(109,168,149)
__ #8ddbbf / rgb(141,219,191)
__ #00b1bb / rgb(0,177,187)





blue on white

blue on black

blue

__ #134a63 / rgb(19,74,99)
__ #4753a7 / rgb(71,83,167)
__ #339999 / rgb(51,153,153)
__ #2a4f77 / rgb(42,79,119)
__ #000066 / rgb(0,0,102)
__ #2e5c6e / rgb(46,92,110)
__ #0099a6 / rgb(0,153,166)
__ #003366 / rgb(0,51,102)
__ #87cefa / rgb(135,206,250)
__ #113758 / rgb(17,55,88)
__ #00569b / rgb(0,86,155)
__ #98a5ab / rgb(152,165,171)
__ #284167 / rgb(40,65,103)
__ #1e8fa8 / rgb(30,143,168)
__ #3e5a99 / rgb(62,90,153)
__ #5390cb / rgb(83,144,203)
__ #0033cc / rgb(0,51,204)
__ #4682b4 / rgb(70,130,180)
__ #004da2 / rgb(0,77,162)
__ #87afc5 / rgb(135,175,197)
__ #307eb8 / rgb(48,126,184)
__ #506396 / rgb(80,99,150)
__ #285763 / rgb(40,87,99)
__ #284799 / rgb(40,71,153)
__ #6a96b5 / rgb(106,150,181)





purple on white

purple on black

purple

__ #825a5e / rgb(130,90,94)
__ #c71585 / rgb(199,21,133)
__ #423347 / rgb(66,51,71)
__ #4a2121 / rgb(74,33,33)
__ #aeafc6 / rgb(174,175,198)
__ #cc00ff / rgb(204,0,255)
__ #cc6699 / rgb(204,102,153)
__ #62162e / rgb(98,22,46)
__ #7b3746 / rgb(123,55,70)
__ #660066 / rgb(102,0,102)
__ #e35394 / rgb(227,83,148)
__ #9295ba / rgb(146,149,186)
__ #d64997 / rgb(214,73,151)
__ #800080 / rgb(128,0,128)
__ #660099 / rgb(102,0,153)
__ #9932cc / rgb(153,50,204)
__ #743357 / rgb(116,51,87)
__ #646cc3 / rgb(100,108,195)
__ #9400d3 / rgb(148,0,211)
__ #7c2e69 / rgb(124,46,105)
__ #a899cd / rgb(168,153,205)
__ #6600cc / rgb(102,0,204)
__ #6633cc / rgb(102,51,204)
__ #994c79 / rgb(153,76,121)
__ #915769 / rgb(145,87,105)





pink on white

pink on black

pink

__ #ec78b4 / rgb(236,120,180)
__ #fa8072 / rgb(250,128,114)
__ #df334e / rgb(223,51,78)
__ #ed7a9b / rgb(237,122,155)
__ #f200d6 / rgb(242,0,214)
__ #ee7bac / rgb(238,123,172)
__ #ae2b52 / rgb(174,43,82)
__ #ff69b4 / rgb(255,105,180)
__ #ffefd5 / rgb(255,239,213)
__ #bb004b / rgb(187,0,75)
__ #d35871 / rgb(211,88,113)
__ #e7d3d3 / rgb(231,211,211)
__ #e22faa / rgb(226,47,170)
__ #edbbd4 / rgb(237,187,212)
__ #e8bda5 / rgb(232,189,165)
__ #df3f86 / rgb(223,63,134)
__ #f3a1b2 / rgb(243,161,178)
__ #fff0f5 / rgb(255,240,245)
__ #eca5b2 / rgb(236,165,178)
__ #efbaa8 / rgb(239,186,168)
__ #e64b6b / rgb(230,75,107)
__ #e35394 / rgb(227,83,148)
__ #e8ddde / rgb(232,221,222)
__ #db3561 / rgb(219,53,97)
__ #e8868f / rgb(232,134,143)





brown on white

brown on black

brown

__ #7a5655 / rgb(122,86,85)
__ #6b494b / rgb(107,73,75)
__ #b9745d / rgb(185,116,93)
__ #503830 / rgb(80,56,48)
__ #e6b07d / rgb(230,176,125)
__ #cc9933 / rgb(204,153,51)
__ #e3b935 / rgb(227,185,53)
__ #d19826 / rgb(209,152,38)
__ #a36840 / rgb(163,104,64)
__ #744924 / rgb(116,73,36)
__ #985e41 / rgb(152,94,65)
__ #533638 / rgb(83,54,56)
__ #b1a386 / rgb(177,163,134)
__ #ad401e / rgb(173,64,30)
__ #bf671c / rgb(191,103,28)
__ #7f3620 / rgb(127,54,32)
__ #ecdb71 / rgb(236,219,113)
__ #6b6221 / rgb(107,98,33)
__ #8f7a47 / rgb(143,122,71)
__ #7b4334 / rgb(123,67,52)
__ #660033 / rgb(102,0,51)
__ #f4c07a / rgb(244,192,122)
__ #d2691e / rgb(210,105,30)
__ #5b332b / rgb(91,51,43)
__ #914c35 / rgb(145,76,53)





white on white

white on black

white

__ #d3bd9f / rgb(211,189,159)
__ #efece5 / rgb(239,236,229)
__ #fffaf0 / rgb(255,250,240)
__ #fafad2 / rgb(250,250,210)
__ #aaaaaa / rgb(170,170,170)
__ #e9e1d1 / rgb(233,225,209)
__ #bbb7a5 / rgb(187,183,165)
__ #4b474d / rgb(75,71,77)
__ #f5f5f5 / rgb(245,245,245)
__ #a9a9a9 / rgb(169,169,169)
__ #808c88 / rgb(128,140,136)
__ #ffffff / rgb(255,255,255)
__ #fffffb / rgb(255,255,251)
__ #fceeeb / rgb(252,238,235)
__ #838383 / rgb(131,131,131)
__ #f7f0cf / rgb(247,240,207)
__ #e9e1d1 / rgb(233,225,209)
__ #f0dbcb / rgb(240,219,203)
__ #b3b8bb / rgb(179,184,187)
__ #ffdead / rgb(255,222,173)
__ #c7c2af / rgb(199,194,175)
__ #f6fbf6 / rgb(246,251,246)
__ #dcdcdc / rgb(220,220,220)
__ #778899 / rgb(119,136,153)
__ #72777d / rgb(114,119,125)





black on white

black on black

black

__ #282a3a / rgb(40,42,58)
__ #b3b8bb / rgb(179,184,187)
__ #655f47 / rgb(101,95,71)
__ #bdc0b7 / rgb(189,192,183)
__ #626567 / rgb(98,101,103)
__ #2f3437 / rgb(47,52,55)
__ #484741 / rgb(72,71,65)
__ #464d58 / rgb(70,77,88)
__ #430d12 / rgb(67,13,18)
__ #373737 / rgb(55,55,55)
__ #a2a091 / rgb(162,160,145)
__ #5c4138 / rgb(92,65,56)
__ #3a4861 / rgb(58,72,97)
__ #010f29 / rgb(1,15,41)
__ #6a6445 / rgb(106,100,69)
__ #666b6c / rgb(102,107,108)
__ #333300 / rgb(51,51,0)
__ #878986 / rgb(135,137,134)
__ #212121 / rgb(33,33,33)
__ #546263 / rgb(84,98,99)
__ #080016 / rgb(8,0,22)
__ #333333 / rgb(51,51,51)
__ #82663a / rgb(130,102,58)
__ #7e7c73 / rgb(126,124,115)
__ #483c2c / rgb(72,60,44)