一網打尽
コンプリメンタリとは、まず第一に相互補完の意味です。
この色調 #FF9900 の場合、もう一方の色と正確に対立する直接の補色 #0066FF が常に存在します。
表示されている色の背景に、その補色でテキストを表示すると、目に優しく、はっきりと区別がつかないような表示が得られます。ただし、白、黒、グレーの濃淡は特にそうです。これらにより、コントラストカラーは特に自然で心地よく、私たちの目にとって常識的なものとなっています。
露光は同じ色相に基づき、現在の色 #FF9900 をより明るくしたものを表します。ボーダーカラーの白と黒のほか、ほとんどの色にウェブデザインに最適なライトバージョンがあります。
以下の明るい色調は、シェード #FF9900 にマッチします。 #FF9900, #FFAB0E, #FFBD21, #FFCF34 と #FFE147
マウスオーバー効果(CSSでは:hoverと呼ぶ)でボタンを変更したり、カラーグラデーションのような他の色のグラデーションを生成するために使用することができます。
シェードは同じ色相を基に、現在の色 #FF9900 をより濃くしたものを表します。ボーダーカラーの白と黒以外にも、ほとんどの色にウェブデザインに最適な色合いがあります。
以下の濃い色合いは、シェード #FF9900 にマッチします。 #FF9900, #EE8700, #DD7500, #CC6300 と #BB5100
特に、マウスオーバー効果(CSSでは:hoverと呼ばれる)でボタンを変更したり、他の色のグラデーションを生成するために使用することができます。
アナログ配色は、カラーホイール上で隣り合う色を使用します。
アナログ配色は、自然界に多く見られるものです。調和がとれており、目にも楽しい。十分なコントラストを持たせることが重要です。1つの色を支配し、もう1つの色をサポートするために選択します。3色目はアクセントとして(黒、白、グレーと一緒に)使われます。
単色の配色は、同じ波長の色を使っています。
単色の配色は、自然界でもよく見受けられます。見た目には調和がとれており、落ち着いているように見えます。
部分補色は、補色のバリエーションである。ベースカラーに加えて、補色に隣接する2色が使用されます。
この配色は、補色と同様に視覚的に強いコントラストを持ちますが、直接補色ほどコントラストが強くはないです。部分補色の配色は、デザインに適しています。これらの色は、通常、お互いをよく引き立て合う。
三原色は、カラーホイールの周りに均等に配置された色を使用します。
三色のハーモニーを実現するためには、色をうまく選択する必要があります。そのためには、1色を支配的にして、他の2色をアクセントカラーとして使うことです。
レクタンギュラーまたはテトラディック配色は、4色を2つの補色ペアで使用します。
この豊富なカラースキームは、多くのバリエーションの可能性を提供します。また、暖色系と寒色系のバランスにも気を配ってデザインする必要があります。
スクエア配色は、レクタングル配色と同様に、4色すべてがカラーホイールの周りに均等に配置された配色です。
ここで注意すべきは、暖色系と寒色系の色のバランスです。
各デバイスで色の表示が異なります。色は100%一致するわけではありませんので、ご了承ください。実際の色を処理する際には、差異が生じる場合があります。実際の色を比較することをお勧めします。当社は一切の責任を負いません。
この色では、黄色が他の色より際立っています。赤と緑の色相を表す値は、3番目の値よりも大きい。互いに近接し、青の色相の値を超えている。 色値が他と比較して高いため、この色合いは私たちには明るく見える。
RGB表色系における色の内訳:この色相では、最大255の色成分のうち、それぞれ 255 赤色 153 グリーンと 皆無 ブルー。
これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。
イラストでは、赤(上)、緑(右下)、青(左下)の3つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
CMYK表色系では、色は次のように構成される。この色調では、最大色成分100のうち、それぞれ 皆無 シアン 40 マゼンタ 100 黄色と 皆無
これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。
イラストでは、シアン(左上)、マゼンタ(右上)、イエローまたは黄(右下)、ブラックまたはキー(左下)の4つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
この色は少なくとも1社で使用されています。ここで、どのようなものがあるのかを見てみましょう。
47% - Readborg
Link: http://www.readborg.com
32% - La Rhumerie
Link: http://www.larhumerie.com
45% - Snow Day - Web Devel...
Link: http://www.snowday.io
44% - Web dizajn, razvoj i...
Link: http://www.krojac.com
55% - Delfos
Link: http://delfos.jor.br
63% - GARBAGE
Link: http://www.samwisegamgee69.byethost18.com
76% - home | calebegg.com
Link: http://new.calebegg.com
68% - Fuck Yeah! Throughca...
Link: http://content.iriss.org.uk
33% - Wiki.com
Link: http://wiki.com
46% - Mobile Broadband Hot...
Link: http://www.datajack.com
98% - Custom Software Deve...
Link: http://www.eleven11solutions.com.au
45% - Launch Site :: Edinb...
Link: http://www.launchsite.co.uk
50% - Learn to Sing at RPM...
Link: http://www.rpmvocalstudio.com
100% - Metacriações - Agênc...
Link: http://www.metacriacoes.com
75% - ..:: Associazione Sp...
Link: http://www.artekaweb.com
57% - :: DrammenLyd ::
Link: http://drammenlyd.no
78% - Figueira da Foz - fi...
Link: http://www.figueiraonline.com
83% - Brucenean
Link: http://www.brucenean.com
33% - CodeProject - For th...
Link: http://www.codeproject.com
97% - TraficoCCS (beta) | ...
Link: http://traficoccs.com
92% - Portfolio | Geoffrey...
Link: http://www.iesanetwork.com
20% - DASL Systems
Link: http://www.dasl.pl
54% - Webdesign en Webbouw...
Link: http://www.waalweb.nl
49% - The Angels Refuge
Link: http://www.theangels-refuge.de
37% - Tristan Dwyer - Inte...
Link: http://tristandwyer.com
55% - Diigo - Web Highligh...
Link: http://www.diigo.com
99% - vivek.Com
Link: http://vivek.com
54% - Chart House Restaura...
Link: http://www.chart-house.com
65% - FotoPrint GbR | Wir ...
Link: http://www.fp-digitaldruck.de
56% - Digital Agency - Web...
Link: http://www.pixel-studios.com
23% - CANOINHAS | Empresas...
Link: http://www.canoinhas.net
79% - Almo® Homepage: Almo...
Link: http://www.almoconsult.de
100% - ER2SOFT.COM.BR
Link: http://www.er2soft.com.br
62% - YILDIZ
Link: http://yildiz.mindenkilapja.hu
27% - (有)河野酢味噌製造工場
Link: http://kohno.open365.jp
44% - Chrintz
Link: http://chrintz.dk
18% - Argentina Centro de ...
Link: http://argentina.indymedia.org
35% - NARANJADIGITAL
Link: http://naranjadigital.cl
100% - Buscar - SisTeV
Link: http://pi2telemetria.zapto.org
67% - talldan.com
Link: http://www.talldan.com
47% - Homeenter - Easy &am...
Link: http://www.homeenter.com
96% - Directorio de Empres...
Link: http://www.fiesta911.com
75% - Home--Bustraan Genea...
Link: http://www.bustraan.com
34% - Independent Media Ce...
Link: http://www.indymedia.org
44% - Black | MasterCard®
Link: http://www.mastercard.com
94% - PEXCIL
Link: http://www.pexcil.com
45% - EDM, Rave & Fest...
Link: http://littleblackdiamond.com
99% - Middleton Manchester...
Link: http://www.sgpropertymaintenance.com
42% - 9 Pies Escuela de Su...
Link: http://escueladesurf9pies.com
38% - Das Portal rund ums ...
Link: http://www.bauen-einrichten.de
71% - Vrouwen voetballen b...
Link: http://www.nummer11.nl
79% - isp - solu��es .web
Link: http://isp.com.br
25% - شركة نجد للتدريب و ت...
Link: http://www.njd.com.sa
32% - Atendimento Telefôni...
Link: http://atendesimples.com
49% - Elterninitiative Lön...
Link: http://www.loenneberga-langstrumpf.de
24% - B-Creative: jas terb...
Link: http://b-creativity.blogspot.com
59% - POR QUÉ ESTUDIAR EN ...
Link: http://www.ucoc.es
56% - CrossFit Erding
Link: http://www.crossfit-erding.de
32% - Juice=Juice|ハロー!プロジェ...
Link: http://www.helloproject.com
46% - Fresh Idea - $5,000 ...
Link: http://retireinwealth.com
81% - Chicken Shack Baton ...
Link: http://www.chickenshack.org
44% - B-Creative: Resep En...
Link: http://b-creativity.blogspot.com
41% - PBS LearningMedia
Link: http://www.pbslearningmedia.org
26% - Create native mobile...
Link: https://appilder.com
41% - 福袋速報 - おすすめ福袋の最新情報や予...
Link: http://xn--ols798e2ikzlh.xyz
94% - GOLDEN EAGLE LUXURY ...
Link: http://destinospremium.com
90% - eltarrito.com
Link: http://eltarrito.com
52% - Wonen
Link: http://www.mosaezorggroep.nl
31% - Shoor Games | We mak...
Link: http://shoor.com.ar
100% - JoomlaShine Template...
Link: http://demo.joomlashine.com
46% - -[Z.A.F.T.]- | Battl...
Link: http://bf3.skyts.net
45% - Der verlässliche ICT...
Link: http://www.firstframe.net
37% - UNIVERSIDAD VALLE DE...
Link: http://www.uvs.com.mx
45% - PiAmmo | Transformin...
Link: http://www.piammo.com
71% - [PC版]茅ヶ崎市立第一中学校1984年...
Link: http://bongtengmaru.ddo.jp
98% - youthtechni.com
Link: http://www.youthtechni.com
89% - Olaf Renoldi | Sprec...
Link: http://www.olaf-renoldi.de
44% - Exit ERP
Link: http://www.exiterp.es
99% - indexPage
Link: http://digiopolis.com
43% - 新鮮印、太鼓判。マル賢共選みかん
Link: http://maruken-mikan.com
60% - SERVICES | Gola Corp...
Link: http://gola.com
92% - Gola Corporate Real ...
Link: http://gola.com
64% - Emolife — Emolife
Link: http://www.emolife.nl
74% - Giralápis – Apoio Es...
Link: http://www.giralapis.com.br
85% - Chat online 3D gráti...
Link: http://pt.clubcooee.com
20% - 簡報藝術烘焙坊 SlideArtToas...
Link: http://artofslide.blogspot.tw
78% - Freelance Factoring ...
Link: http://freelancefactoring.com
43% - KAVAJ Academy — Sell...
Link: http://kavajacademy.com
73% - psa.co.id - sport eq...
Link: http://psa.co.id
60% - Pinturas Isidro | IS...
Link: http://pinturasisidro.com
96% - 販売ページのサンプル – Uridas ...
Link: http://uridas.digitalcontent.tokyo
24% - Порно Видео Онлайн Б...
Link: http://www.pornhub.ru
62% - Login | www.groundfo...
Link: https://www.groundforceonline.co.uk
28% - 株式会社エーエヌディー【AND INC....
Link: http://www.andinfo.co.jp
45% - Hravaskolka.sk
Link: http://www.hravaskolka.sk
68% - Receitas, Culinária,...
Link: http://www.petiscos.com
50% - Kotka autokool
Link: http://kotkaautokool.ee
93% - Lipton Ice Tea - Poz...
Link: http://www.liptonicetea.pl
62% - Circus Mondeo
Link: http://www.circus-mondeo.de
50% - Cooper St Self Stora...
Link: http://cooperststorage.com.au
74% - ペットメモリー | ペットの形見・メモリ...
Link: http://www.petmemorylove.com
42% - ScienceBlogs Brasil ...
Link: http://scienceblogs.com.br
31% - ほんっとにはじめてのHTML(13-2_...
Link: http://honttoni.web.fc2.com
94% - Verband Deutscher To...
Link: https://www.tonmeister.de
24% - 株式会社サンエース 採用情報
Link: http://www.sunace-net.com
19% - Экспресс-тур (Новоро...
Link: http://express-tours.net
50% - 26593.png (900x600 p...
Link: http://www.color-hex.com
20% - ONHEALTHYFAMILIES.CO...
Link: http://www.onhealthyfamilies.com
24% - 夢の住まい・住宅リフォーム・新築ならイノ...
Link: http://ikplan.jp
82% - header_newsletter.pn...
Link: http://bgsw.pl
94% - ログイン | みんなのFX
Link: https://my.min-fx.tv
36% - 補聴器とは | 補聴器のフォナック
Link: http://www.phonak.jp
47% - DOLLY
Link: http://www.pelanas.com
42% - 名古屋市の整体なら天白区で人気NO1のそ...
Link: http://hinata-se.com
71% - Webサービス・システム開発のアクリプト
Link: http://acript.jp
92% - Welcome to Lipton Ic...
Link: http://www.liptonicetea.com
91% - 【オレンジページnet】 - 暮らしのヒ...
Link: https://www.orangepage.net
49% - 許認可.net ひかり行政書士法人
Link: http://n-jimu.net
95% - RCWEB10 ONLINE – Só ...
Link: http://rcweb10.online
100% - KR prof
Link: http://kumayou.halfmoon.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