一網打尽
コンプリメンタリとは、まず第一に相互補完の意味です。
この色調 RGB 255 102 0 の場合、もう一方の色と正確に対立する直接の補色 RGB 0 153 255 が常に存在します。
表示されている色の背景に、その補色でテキストを表示すると、目に優しく、はっきりと区別がつかないような表示が得られます。ただし、白、黒、グレーの濃淡は特にそうです。これらにより、コントラストカラーは特に自然で心地よく、私たちの目にとって常識的なものとなっています。
露光は同じ色相に基づき、現在の色 RGB 255 102 0 をより明るくしたものを表します。ボーダーカラーの白と黒のほか、ほとんどの色にウェブデザインに最適なライトバージョンがあります。
以下の明るい色調は、シェード RGB 255 102 0 にマッチします。 RGB 255 102 0, RGB 255 120 14, RGB 255 138 33, RGB 255 156 52 と RGB 255 174 71
マウスオーバー効果(CSSでは:hoverと呼ぶ)でボタンを変更したり、カラーグラデーションのような他の色のグラデーションを生成するために使用することができます。
シェードは同じ色相を基に、現在の色 RGB 255 102 0 をより濃くしたものを表します。ボーダーカラーの白と黒以外にも、ほとんどの色にウェブデザインに最適な色合いがあります。
以下の濃い色合いは、シェード RGB 255 102 0 にマッチします。 RGB 255 102 0, RGB 238 84 0, RGB 221 66 0, RGB 204 48 0 と RGB 187 30 0
特に、マウスオーバー効果(CSSでは:hoverと呼ばれる)でボタンを変更したり、他の色のグラデーションを生成するために使用することができます。
アナログ配色は、カラーホイール上で隣り合う色を使用します。
アナログ配色は、自然界に多く見られるものです。調和がとれており、目にも楽しい。十分なコントラストを持たせることが重要です。1つの色を支配し、もう1つの色をサポートするために選択します。3色目はアクセントとして(黒、白、グレーと一緒に)使われます。
単色の配色は、同じ波長の色を使っています。
単色の配色は、自然界でもよく見受けられます。見た目には調和がとれており、落ち着いているように見えます。
部分補色は、補色のバリエーションである。ベースカラーに加えて、補色に隣接する2色が使用されます。
この配色は、補色と同様に視覚的に強いコントラストを持ちますが、直接補色ほどコントラストが強くはないです。部分補色の配色は、デザインに適しています。これらの色は、通常、お互いをよく引き立て合う。
三原色は、カラーホイールの周りに均等に配置された色を使用します。
三色のハーモニーを実現するためには、色をうまく選択する必要があります。そのためには、1色を支配的にして、他の2色をアクセントカラーとして使うことです。
レクタンギュラーまたはテトラディック配色は、4色を2つの補色ペアで使用します。
この豊富なカラースキームは、多くのバリエーションの可能性を提供します。また、暖色系と寒色系のバランスにも気を配ってデザインする必要があります。
スクエア配色は、レクタングル配色と同様に、4色すべてがカラーホイールの周りに均等に配置された配色です。
ここで注意すべきは、暖色系と寒色系の色のバランスです。
各デバイスで色の表示が異なります。色は100%一致するわけではありませんので、ご了承ください。実際の色を処理する際には、差異が生じる場合があります。実際の色を比較することをお勧めします。当社は一切の責任を負いません。
この色では、赤が他の色より際立っています。赤の色相の値が他の2つの値より大きくなっています。緑と青の色相のために、値よりもはるかに際立っているのです。 色値が他と比較して高いため、この色合いは私たちには明るく見える。
RGB表色系における色の内訳:この色相では、最大255の色成分のうち、それぞれ 255 赤色 102 グリーンと 皆無 ブルー。
これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。
イラストでは、赤(上)、緑(右下)、青(左下)の3つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
CMYK表色系では、色は次のように構成される。この色調では、最大色成分100のうち、それぞれ 皆無 シアン 60 マゼンタ 100 黄色と 皆無
これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。
イラストでは、シアン(左上)、マゼンタ(右上)、イエローまたは黄(右下)、ブラックまたはキー(左下)の4つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
この色は少なくとも1社で使用されています。ここで、どのようなものがあるのかを見てみましょう。
95% - Hacker News
Link: https://news.ycombinator.com
82% - TVNET :: Ievērojamas...
Link: http://www.tvnet.lv
81% - Hacker News
Link: http://www.premii.com/hn
87% - HackerWeb
Link: http://cheeaun.github.io
88% - NEVERSAW.US
Link: http://neversaw.us
81% - Martin Dobrev | Web ...
Link: http://www.dobreff.net
46% - Blackpool FC fans po...
Link: http://seasiderspodcast.co.uk
68% - Thomas L’Excellent
Link: http://book.thomaslexcellent.com
81% - Hacker News
Link: http://premii.com
30% - Addison Hall Design ...
Link: http://addisonhalldesign.com
30% - Fotoboek - Fotokalen...
Link: http://www.albelli.nl
100% - Welcom to Shree Sidh...
Link: http://sidhdham.co.in
45% - Сайт Иванова Ю.К.
Link: http://expsys.ru
45% - mama58.ru - Сайт для...
Link: http://mama58.ru
36% - ジョッガ|jogga|映像と文章の作家事...
Link: http://jogga.jp
53% - Say More With Video ...
Link: http://saymorewithvideo.com
47% - Fortschritt bewahren...
Link: http://fortschritt-bewahren.de
22% - Christa Kasehs :: Ho...
Link: http://www.christakasehs.at
63% - GARBAGE
Link: http://www.samwisegamgee69.byethost18.com
75% - Novem Blog
Link: http://no9vem.blog.fc2.com
68% - Cute.Search | Kyushu...
Link: http://kyushu.summon.serialssolutions.com
47% - K1VRA Home Page
Link: http://k1vra.com
54% - ROC - Global SAP HCM...
Link: http://www.roc-group.pl
42% - Gigabyte Gurus | Wel...
Link: http://www.gigabytegurus.com
39% - Peterboro Tool Co., ...
Link: http://www.ptool.com
67% - Junk66 Productions
Link: http://www.junk66.com
82% - Yoann Lagarde
Link: http://www.yoannlagarde.fr
64% - Observer
Link: http://observer.com
67% - Junk66 Productions
Link: http://junk66.com
36% - Cumula: de optelsom ...
Link: http://www.cumula.nl
52% - Effecta Learning - K...
Link: http://www.effecta.nl
50% - Colegio Particular E...
Link: http://moodle.copol.edu.ec
81% - Hacker News
Link: http://hn.premii.com
27% - Applications multi-u...
Link: http://www.lucca.fr
64% - Beacons
Link: http://beacons.herokuapp.com
44% - Welcome to mm-d.net
Link: http://www.mm-d.net
81% - Vemma Nutrition Comp...
Link: http://www.vemma.com
45% - [4h] D E S ! G N . N...
Link: http://www.nickyeh.com
49% - Curcio e Filhos Mate...
Link: http://www.curcioefilhos.com.br
97% - Face4you: Create you...
Link: http://www.face4you.net
94% - Argent Web Reporting...
Link: https://awr.telstra.com
64% - Últimas Noticias - Q...
Link: http://www.quadratin.com.mx
78% - Portal del Cliente d...
Link: http://www.manchatel.es
75% - Kajetandziedzic
Link: http://kajetandziedzic.za.pl
61% - www.synlab.org.cn | ...
Link: http://www.synlab.org.cn
35% - NARANJADIGITAL
Link: http://naranjadigital.cl
45% - Vagas rio RJ,Emprego...
Link: http://vagasriorj.blogspot.com.br
82% - img_flag.gif (200x13...
Link: http://www.albirex.co.jp
60% - Coaching Vallès
Link: http://coachingvalles.com
84% - claudia in bytes: Fl...
Link: http://claudiainbytes.com
49% - claudia in bytes: Fl...
Link: http://flavors.me
36% - Weborient
Link: http://www.weborient.hu
71% - MacGeneration | Tout...
Link: http://www.macg.co
41% - CS BEAVER
Link: http://www.csbeaver.com
71% - Wap.WildMob.ru Скача...
Link: http://wap.wildmob.ru
70% - Home - Pons Creative...
Link: http://ponscreative.com
39% - Bluleadz Inbound Mar...
Link: http://www.bluleadz.com
96% - Home | ING
Link: http://www.ing.com
60% - 山中眼科クリニック[神戸市東灘区住吉本町...
Link: http://www.doc-yamanakas-ec.com
42% - Sampression Lite
Link: http://demo.sampression.com
43% - 東所沢の整形外科・リハビリテーション・脊...
Link: http://www.kanja.jp
40% - Home Page | TaxSpeak...
Link: http://www.taxspeaker.com
71% - TechMaster Telecom –...
Link: http://www.techmastertelecom.com
44% - Cleaners in Warringt...
Link: http://www.cleaners-warrington.co.uk
55% - Child Safety and Loc...
Link: http://www.mybuddytag.com
70% - Bisnow Commercial Re...
Link: https://www.bisnow.com
43% - Destacamos | UTEM
Link: http://www.utem.cl
36% - Home - Action Jobs
Link: http://www.action.jobs
37% - Arwood's - Misso...
Link: http://www.arwoodsfurniture.com
16% - 中国平安保险(集团)股份有限公司 - 保...
Link: http://www.pingan.com
41% - 名片设计_名片在线设计制作_名片免费设计...
Link: http://www.yifutu.com
87% - Orange Press: Home
Link: http://www.orange-press.com
56% - 金色家园首页_金色家园官网
Link: http://gw.jyall.com
93% - The Hermès corporate...
Link: http://lesailes.hermes.com
65% - Ignição Digital | Co...
Link: http://www.ignicaodigital.com.br
74% - アイルランドの国旗 | 世界の国旗
Link: http://www.abysse.co.jp
34% - エクスウェア株式会社:クラウドを喰らうど...
Link: http://www.xware.co.jp
84% - ING DIRECT - Persona...
Link: http://ingdirect.com.au
81% - eAnuncios.com - Anun...
Link: https://www.eanuncios.com
37% - Administrador de fin...
Link: http://www.boomynavarro.com
74% - Alibaba Group
Link: http://www.alibabagroup.com
40% - Fantastic Cleaners M...
Link: http://www.fantasticcleanersmelbourne.com.au
44% - Expert Oven Cleaning...
Link: http://www.fantasticovencleanersmelbourne.com.au
92% - Orange
Link: http://id.orange.fr
38% - Truper® - Es mucha h...
Link: https://www.truper.com.mx
38% - Truper® - Es mucha h...
Link: https://www.truper.com
49% - Reserva vuelos barat...
Link: http://www.easyjet.com
85% - Ihr Partner für Web ...
Link: http://www.unleashed-design.de
68% - Jbl
Link: http://JBL.com
100% - Hermes
Link: http://www.hermes.com
27% - 3 Wathosen die ich e...
Link: http://wathose-test.com
88% - Home - Bonici Claudi...
Link: http://www.boniciclaudio.it
77% - Muebles baratos onli...
Link: http://www.flatpack.es
79% - IDEALO – die Nr. 1 i...
Link: http://www.idealo.de
54% - Awesome Fontstacks
Link: http://awesome-fontstacks.com
73% - PSMóviles
Link: http://psmoviles.es
44% - Response
Link: http://response.FR
86% - Intelligent Automati...
Link: http://www.cortex.co.uk
57% - 陽南幼稚園・陽南第二幼稚園|栃木県宇都宮...
Link: http://www.younan-kg.ed.jp
49% - Farrow & Ball | ...
Link: http://diy.com
45% - KTM motociklai ir ak...
Link: http://ktm-moto.lt
53% - 404 Error - Not Foun...
Link: http://nana-k.cheap.jp
59% - Media Displays - Adv...
Link: http://mediadisplays.tv
39% - Portal Adesões | Ata...
Link: http://www.portaladesoes.com.br
23% - Home
Link: http://www.usedcaradvertiser.co.uk
58% - ALQUILER PARKING CEN...
Link: http://www.santaperpetua.cat
44% - CDB Financial Servic...
Link: http://www.cdbfinancialservices.com.au
36% - 株式会社SIG
Link: https://www.sig-c.co.jp
ラグビー に 呪咀
から変換する RGB レッド・グリーン・ブルー まで #RRGGBB
ラグビー に カミーユ
から変換する RGB レッド・グリーン・ブルー まで CMYK シアン/マゼンタ/イエロー/キー
ラグビー に ラル®
から変換する RGB レッド・グリーン・ブルー まで RAL® 番号 (RAL 0000)
ラグビー に 豚足®
から変換する RGB レッド・グリーン・ブルー まで HKS® 番号(HKS 00)
ラグビー に パントン®
から変換する RGB レッド・グリーン・ブルー まで Pantone® 番号 (Pantone 0000)
ラグビー に シャーウィン・ウィリアムズ®
から変換する RGB レッド・グリーン・ブルー まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
ラグビー に エヌシーエス®
から変換する RGB レッド・グリーン・ブルー まで NCS番号(S0000-X00X)
ラグバ に 呪咀
から変換する RGBA 赤 緑 青 透過率 まで #RRGGBB
ラグバ に カミーユ
から変換する RGBA 赤 緑 青 透過率 まで CMYK シアン/マゼンタ/イエロー/キー
ラグバ に ラル®
から変換する RGBA 赤 緑 青 透過率 まで RAL® 番号 (RAL 0000)
ラグバ に 豚足®
から変換する RGBA 赤 緑 青 透過率 まで HKS® 番号(HKS 00)
ラグバ に パントン®
から変換する RGBA 赤 緑 青 透過率 まで Pantone® 番号 (Pantone 0000)
ラグバ に シャーウィン・ウィリアムズ®
から変換する RGBA 赤 緑 青 透過率 まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
ラグバ に エヌシーエス®
から変換する RGBA 赤 緑 青 透過率 まで NCS番号(S0000-X00X)
カミーユ に 呪咀
から変換する CMYK シアン/マゼンタ/イエロー/キー まで #RRGGBB
カミーユ に ラグビー
から変換する CMYK シアン/マゼンタ/イエロー/キー まで RGB レッド・グリーン・ブルー
カミーユ に ラグバ
から変換する CMYK シアン/マゼンタ/イエロー/キー まで RGBA 赤 緑 青 透過率
カミーユ に ラル®
から変換する CMYK シアン/マゼンタ/イエロー/キー まで RAL® 番号 (RAL 0000)
カミーユ に 豚足®
から変換する CMYK シアン/マゼンタ/イエロー/キー まで HKS® 番号(HKS 00)
カミーユ に パントン®
から変換する CMYK シアン/マゼンタ/イエロー/キー まで Pantone® 番号 (Pantone 0000)
カミーユ に シャーウィン・ウィリアムズ®
から変換する CMYK シアン/マゼンタ/イエロー/キー まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
カミーユ に エヌシーエス®
から変換する CMYK シアン/マゼンタ/イエロー/キー まで NCS番号(S0000-X00X)
呪咀 に ラグビー
から変換する #RRGGBB まで RGB レッド・グリーン・ブルー
呪咀 に ラグバ
から変換する #RRGGBB まで RGBA 赤 緑 青 透過率
呪咀 に カミーユ
から変換する #RRGGBB まで CMYK シアン/マゼンタ/イエロー/キー
呪咀 に ラル®
から変換する #RRGGBB まで RAL® 番号 (RAL 0000)
呪咀 に 豚足®
から変換する #RRGGBB まで HKS® 番号(HKS 00)
呪咀 に パントン®
から変換する #RRGGBB まで Pantone® 番号 (Pantone 0000)
呪咀 に シャーウィン・ウィリアムズ®
から変換する #RRGGBB まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
呪咀 に エヌシーエス®
から変換する #RRGGBB まで NCS番号(S0000-X00X)
ラル® に ラグビー
から変換する RAL® 番号 (RAL 0000) まで RGB レッド・グリーン・ブルー
ラル® に ラグバ
から変換する RAL® 番号 (RAL 0000) まで RGBA 赤 緑 青 透過率
ラル® に カミーユ
から変換する RAL® 番号 (RAL 0000) まで CMYK シアン/マゼンタ/イエロー/キー
ラル® に 呪咀
から変換する RAL® 番号 (RAL 0000) まで #RRGGBB
ラル® に 豚足®
から変換する RAL® 番号 (RAL 0000) まで HKS® 番号(HKS 00)
ラル® に パントン®
から変換する RAL® 番号 (RAL 0000) まで Pantone® 番号 (Pantone 0000)
ラル® に シャーウィン・ウィリアムズ®
から変換する RAL® 番号 (RAL 0000) まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
ラル® に エヌシーエス®
から変換する RAL® 番号 (RAL 0000) まで NCS番号(S0000-X00X)
豚足® に ラグビー
から変換する HKS® 番号(HKS 00) まで RGB レッド・グリーン・ブルー
豚足® に ラグバ
から変換する HKS® 番号(HKS 00) まで RGBA 赤 緑 青 透過率
豚足® に カミーユ
から変換する HKS® 番号(HKS 00) まで CMYK シアン/マゼンタ/イエロー/キー
豚足® に 呪咀
から変換する HKS® 番号(HKS 00) まで #RRGGBB
豚足® に ラル®
から変換する HKS® 番号(HKS 00) まで RAL® 番号 (RAL 0000)
豚足® に パントン®
から変換する HKS® 番号(HKS 00) まで Pantone® 番号 (Pantone 0000)
豚足® に シャーウィン・ウィリアムズ®
から変換する HKS® 番号(HKS 00) まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
豚足® に エヌシーエス®
から変換する HKS® 番号(HKS 00) まで NCS番号(S0000-X00X)
パントン® に ラグビー
から変換する Pantone® 番号 (Pantone 0000) まで RGB レッド・グリーン・ブルー
パントン® に ラグバ
から変換する Pantone® 番号 (Pantone 0000) まで RGBA 赤 緑 青 透過率
パントン® に カミーユ
から変換する Pantone® 番号 (Pantone 0000) まで CMYK シアン/マゼンタ/イエロー/キー
パントン® に 呪咀
から変換する Pantone® 番号 (Pantone 0000) まで #RRGGBB
パントン® に ラル®
から変換する Pantone® 番号 (Pantone 0000) まで RAL® 番号 (RAL 0000)
パントン® に 豚足®
から変換する Pantone® 番号 (Pantone 0000) まで HKS® 番号(HKS 00)
パントン® に シャーウィン・ウィリアムズ®
から変換する Pantone® 番号 (Pantone 0000) まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
パントン® に エヌシーエス®
から変換する Pantone® 番号 (Pantone 0000) まで NCS番号(S0000-X00X)
シャーウィン・ウィリアムズ® に ラグビー
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RGB レッド・グリーン・ブルー
シャーウィン・ウィリアムズ® に ラグバ
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RGBA 赤 緑 青 透過率
シャーウィン・ウィリアムズ® に カミーユ
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで CMYK シアン/マゼンタ/イエロー/キー
シャーウィン・ウィリアムズ® に 呪咀
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで #RRGGBB
シャーウィン・ウィリアムズ® に ラル®
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RAL® 番号 (RAL 0000)
シャーウィン・ウィリアムズ® に 豚足®
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで HKS® 番号(HKS 00)
シャーウィン・ウィリアムズ® に パントン®
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで Pantone® 番号 (Pantone 0000)
シャーウィン・ウィリアムズ® に エヌシーエス®
から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで NCS番号(S0000-X00X)
エヌシーエス® に ラグビー
から変換する NCS番号(S0000-X00X) まで RGB レッド・グリーン・ブルー
エヌシーエス® に ラグバ
から変換する NCS番号(S0000-X00X) まで RGBA 赤 緑 青 透過率
エヌシーエス® に カミーユ
から変換する NCS番号(S0000-X00X) まで CMYK シアン/マゼンタ/イエロー/キー
エヌシーエス® に 呪咀
から変換する NCS番号(S0000-X00X) まで #RRGGBB
エヌシーエス® に ラル®
から変換する NCS番号(S0000-X00X) まで RAL® 番号 (RAL 0000)
エヌシーエス® に 豚足®
から変換する NCS番号(S0000-X00X) まで HKS® 番号(HKS 00)
エヌシーエス® に パントン®
から変換する NCS番号(S0000-X00X) まで Pantone® 番号 (Pantone 0000)
エヌシーエス® に シャーウィン・ウィリアムズ®
から変換する NCS番号(S0000-X00X) まで シャーウィン・ウィリアムズ® 番号 (SW 0000)
Create a color palette
DownloadDownload in different formats