Dear color lovers – together, we’ll have a more colorful future. Support us on

CSS グラデーション:
CMYK 0 / 40 / 60 / 98

インフォメーション

一網打尽



基本色調と補色などの2つの色調から、CSSが色のグラデーションを提案します。

線形および放射状の色遷移の例をご覧ください。

ウェブデザインに簡単:CSSコードをコピーして、ウェブサイトに簡単に組み込めます。

ベースとなる色調と明るい色調など、2 つの色調から CSS で色のグラデーションを提案させます。

線形および放射状の色遷移の例を 明るい色合い から検索します。

ウェブデザインに簡単:CSS コードをコピーしてウェブサイトに簡単に組み込めます。

ベースとなる色調と暗い色調など、2 つの色調から CSS で色のグラデーションを提案させます。

線形および放射状の色遷移の例を ダークシェード から検索します。

ウェブデザインに簡単:CSS コードをコピーして、ウェブサイトに簡単に組み込めます。

表示オプション

商品説明

この色では、どの色も特に目立つことはありません。 色値が他と比べて低いため、私たちにはこの色合いが濃く見える。

RGB表色系における色の内訳:この色相では、最大255の色成分のうち、それぞれ 5 赤色 3 グリーンと 2 ブルー。

これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。

イラストでは、赤(上)、緑(右下)、青(左下)の3つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
5 3 2 R G B
CMYK表色系では、色は次のように構成される。この色調では、最大色成分100のうち、それぞれ 皆無 シアン 40 マゼンタ 60 黄色と 98

これらの色の混合比によって、重なり合った部分の真ん中に表示される色合いとなります。

イラストでは、シアン(左上)、マゼンタ(右上)、イエローまたは黄(右下)、ブラックまたはキー(左下)の4つの成分で色が構成されていることがわかりますね。真ん中にあるのは、結果の色です。
0% 40% 60% 98% C M Y K

メーカーとしてのカラーパレットの検証!

デザイナーやエージェンシーに正確なカラーバリューを提供することができます。

レッツゴー

リニア

HEX #050302 まで HEX #FAFCFD


CSSコード:

background-image: linear-gradient(135deg, #050302 12%, #FAFCFD 92%);

ラジアル

HEX #050302 まで HEX #FAFCFD


CSSコード:

background-image: radial-gradient(circle, #050302 13%, #FAFCFD 88%);

 

HEX #FAFCFD まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #FAFCFD 11%, #050302 89%);

 

HEX #FAFCFD まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #FAFCFD 14%, #050302 92%);

リニア

HEX #050302 まで HEX #1B1510


CSSコード:

background-image: linear-gradient(135deg, #050302 3%, #1B1510 97%);

ラジアル

HEX #050302 まで HEX #1B1510


CSSコード:

background-image: radial-gradient(circle, #050302 13%, #1B1510 88%);

 

HEX #1B1510 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #1B1510 10%, #050302 100%);

 

HEX #1B1510 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #1B1510 6%, #050302 94%);

 

HEX #050302 まで HEX #2C2723


CSSコード:

background-image: linear-gradient(135deg, #050302 6%, #2C2723 91%);

 

HEX #050302 まで HEX #2C2723


CSSコード:

background-image: radial-gradient(circle, #050302 6%, #2C2723 89%);

 

HEX #2C2723 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #2C2723 12%, #050302 87%);

 

HEX #2C2723 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #2C2723 11%, #050302 88%);

 

HEX #050302 まで HEX #3D3936


CSSコード:

background-image: linear-gradient(135deg, #050302 2%, #3D3936 97%);

 

HEX #050302 まで HEX #3D3936


CSSコード:

background-image: radial-gradient(circle, #050302 10%, #3D3936 86%);

 

HEX #3D3936 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #3D3936 10%, #050302 86%);

 

HEX #3D3936 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #3D3936 12%, #050302 99%);

 

HEX #050302 まで HEX #4E4B49


CSSコード:

background-image: linear-gradient(135deg, #050302 10%, #4E4B49 88%);

 

HEX #050302 まで HEX #4E4B49


CSSコード:

background-image: radial-gradient(circle, #050302 12%, #4E4B49 97%);

 

HEX #4E4B49 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #4E4B49 10%, #050302 96%);

 

HEX #4E4B49 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #4E4B49 2%, #050302 100%);

リニア

HEX #050302 まで HEX #030201


CSSコード:

background-image: linear-gradient(135deg, #050302 12%, #030201 100%);

ラジアル

HEX #050302 まで HEX #030201


CSSコード:

background-image: radial-gradient(circle, #050302 7%, #030201 97%);

 

HEX #030201 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #030201 14%, #050302 96%);

 

HEX #030201 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #030201 11%, #050302 92%);

 

HEX #050302 まで HEX #030201


CSSコード:

background-image: linear-gradient(135deg, #050302 11%, #030201 87%);

 

HEX #050302 まで HEX #030201


CSSコード:

background-image: radial-gradient(circle, #050302 10%, #030201 86%);

 

HEX #030201 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #030201 3%, #050302 93%);

 

HEX #030201 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #030201 0%, #050302 95%);

 

HEX #050302 まで HEX #030301


CSSコード:

background-image: linear-gradient(135deg, #050302 13%, #030301 98%);

 

HEX #050302 まで HEX #030301


CSSコード:

background-image: radial-gradient(circle, #050302 8%, #030301 100%);

 

HEX #030301 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #030301 8%, #050302 97%);

 

HEX #030301 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #030301 8%, #050302 89%);

 

HEX #050302 まで HEX #030301


CSSコード:

background-image: linear-gradient(135deg, #050302 0%, #030301 88%);

 

HEX #050302 まで HEX #030301


CSSコード:

background-image: radial-gradient(circle, #050302 3%, #030301 97%);

 

HEX #030301 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #030301 6%, #050302 89%);

 

HEX #030301 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #030301 5%, #050302 90%);

リニア

HEX #050302 まで HEX #382216


CSSコード:

background-image: linear-gradient(135deg, #050302 6%, #382216 86%);

ラジアル

HEX #050302 まで HEX #382216


CSSコード:

background-image: radial-gradient(circle, #050302 3%, #382216 90%);

 

HEX #382216 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #382216 2%, #050302 97%);

 

HEX #382216 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #382216 8%, #050302 93%);

 

HEX #050302 まで HEX #6B402B


CSSコード:

background-image: linear-gradient(135deg, #050302 6%, #6B402B 99%);

 

HEX #050302 まで HEX #6B402B


CSSコード:

background-image: radial-gradient(circle, #050302 14%, #6B402B 86%);

 

HEX #6B402B まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #6B402B 10%, #050302 91%);

 

HEX #6B402B まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #6B402B 6%, #050302 90%);

 

HEX #050302 まで HEX #9E5F3F


CSSコード:

background-image: linear-gradient(135deg, #050302 10%, #9E5F3F 98%);

 

HEX #050302 まで HEX #9E5F3F


CSSコード:

background-image: radial-gradient(circle, #050302 9%, #9E5F3F 96%);

 

HEX #9E5F3F まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #9E5F3F 12%, #050302 96%);

 

HEX #9E5F3F まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #9E5F3F 7%, #050302 94%);

 

HEX #050302 まで HEX #D17D54


CSSコード:

background-image: linear-gradient(135deg, #050302 8%, #D17D54 90%);

 

HEX #050302 まで HEX #D17D54


CSSコード:

background-image: radial-gradient(circle, #050302 9%, #D17D54 91%);

 

HEX #D17D54 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #D17D54 11%, #050302 100%);

 

HEX #D17D54 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #D17D54 13%, #050302 90%);

リニア

HEX #050302 まで HEX #020301


CSSコード:

background-image: linear-gradient(135deg, #050302 0%, #020301 97%);

ラジアル

HEX #050302 まで HEX #020301


CSSコード:

background-image: radial-gradient(circle, #050302 5%, #020301 97%);

 

HEX #020301 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #020301 3%, #050302 92%);

 

HEX #020301 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #020301 13%, #050302 91%);

 

HEX #050302 まで HEX #010103


CSSコード:

background-image: linear-gradient(135deg, #050302 6%, #010103 91%);

 

HEX #050302 まで HEX #010103


CSSコード:

background-image: radial-gradient(circle, #050302 5%, #010103 96%);

 

HEX #010103 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #010103 7%, #050302 99%);

 

HEX #010103 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #010103 1%, #050302 91%);

リニア

HEX #050302 まで HEX #010302


CSSコード:

background-image: linear-gradient(135deg, #050302 2%, #010302 89%);

ラジアル

HEX #050302 まで HEX #010302


CSSコード:

background-image: radial-gradient(circle, #050302 10%, #010302 97%);

 

HEX #010302 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #010302 1%, #050302 93%);

 

HEX #010302 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #010302 0%, #050302 94%);

 

HEX #050302 まで HEX #020103


CSSコード:

background-image: linear-gradient(135deg, #050302 13%, #020103 97%);

 

HEX #050302 まで HEX #020103


CSSコード:

background-image: radial-gradient(circle, #050302 0%, #020103 98%);

 

HEX #020103 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #020103 13%, #050302 99%);

 

HEX #020103 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #020103 14%, #050302 98%);

リニア

HEX #050302 まで HEX #020301


CSSコード:

background-image: linear-gradient(135deg, #050302 8%, #020301 99%);

ラジアル

HEX #050302 まで HEX #020301


CSSコード:

background-image: radial-gradient(circle, #050302 3%, #020301 88%);

 

HEX #020301 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #020301 11%, #050302 90%);

 

HEX #020301 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #020301 9%, #050302 96%);

 

HEX #050302 まで HEX #010203


CSSコード:

background-image: linear-gradient(135deg, #050302 8%, #010203 96%);

 

HEX #050302 まで HEX #010203


CSSコード:

background-image: radial-gradient(circle, #050302 14%, #010203 95%);

 

HEX #010203 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #010203 0%, #050302 93%);

 

HEX #010203 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #010203 6%, #050302 98%);

 

HEX #050302 まで HEX #020103


CSSコード:

background-image: linear-gradient(135deg, #050302 0%, #020103 91%);

 

HEX #050302 まで HEX #020103


CSSコード:

background-image: radial-gradient(circle, #050302 0%, #020103 87%);

 

HEX #020103 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #020103 2%, #050302 88%);

 

HEX #020103 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #020103 8%, #050302 87%);

リニア

HEX #050302 まで HEX #010301


CSSコード:

background-image: linear-gradient(135deg, #050302 7%, #010301 97%);

ラジアル

HEX #050302 まで HEX #010301


CSSコード:

background-image: radial-gradient(circle, #050302 1%, #010301 94%);

 

HEX #010301 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #010301 1%, #050302 100%);

 

HEX #010301 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #010301 14%, #050302 94%);

 

HEX #050302 まで HEX #010203


CSSコード:

background-image: linear-gradient(135deg, #050302 9%, #010203 91%);

 

HEX #050302 まで HEX #010203


CSSコード:

background-image: radial-gradient(circle, #050302 7%, #010203 90%);

 

HEX #010203 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #010203 3%, #050302 95%);

 

HEX #010203 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #010203 12%, #050302 96%);

 

HEX #050302 まで HEX #030103


CSSコード:

background-image: linear-gradient(135deg, #050302 4%, #030103 88%);

 

HEX #050302 まで HEX #030103


CSSコード:

background-image: radial-gradient(circle, #050302 7%, #030103 89%);

 

HEX #030103 まで HEX #050302


CSSコード:

background-image: linear-gradient(135deg, #030103 5%, #050302 92%);

 

HEX #030103 まで HEX #050302


CSSコード:

background-image: radial-gradient(circle, #030103 7%, #050302 89%);

カラーパレットをもっと見る

サービス内容

カラー

ラグビー に 呪咀

から変換する RGB レッド・グリーン・ブルー まで #RRGGBB

ラグビー に カミーユ

から変換する RGB レッド・グリーン・ブルー まで CMYK シアン/マゼンタ/イエロー/キー

Icons

ラグビー に ラル®

から変換する RGB レッド・グリーン・ブルー まで RAL® 番号 (RAL 0000)

ラグビー に 豚足®

から変換する RGB レッド・グリーン・ブルー まで HKS® 番号(HKS 00)

ラグビー に パントン®

から変換する RGB レッド・グリーン・ブルー まで Pantone® 番号 (Pantone 0000)

ラグビー に シャーウィン・ウィリアムズ®

から変換する RGB レッド・グリーン・ブルー まで シャーウィン・ウィリアムズ® 番号 (SW 0000)

ラグビー に エヌシーエス®

から変換する RGB レッド・グリーン・ブルー まで NCS番号(S0000-X00X)

nsc-logo

ラグバ に 呪咀

から変換する RGBA 赤 緑 青 透過率 まで #RRGGBB

ラグバ に カミーユ

から変換する RGBA 赤 緑 青 透過率 まで CMYK シアン/マゼンタ/イエロー/キー

Icons

ラグバ に ラル®

から変換する RGBA 赤 緑 青 透過率 まで RAL® 番号 (RAL 0000)

ラグバ に 豚足®

から変換する RGBA 赤 緑 青 透過率 まで HKS® 番号(HKS 00)

ラグバ に パントン®

から変換する RGBA 赤 緑 青 透過率 まで Pantone® 番号 (Pantone 0000)

ラグバ に シャーウィン・ウィリアムズ®

から変換する RGBA 赤 緑 青 透過率 まで シャーウィン・ウィリアムズ® 番号 (SW 0000)

ラグバ に エヌシーエス®

から変換する RGBA 赤 緑 青 透過率 まで NCS番号(S0000-X00X)

nsc-logo

カミーユ に 呪咀

から変換する 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)

nsc-logo

呪咀 に ラグビー

から変換する #RRGGBB まで RGB レッド・グリーン・ブルー

呪咀 に ラグバ

から変換する #RRGGBB まで RGBA 赤 緑 青 透過率

呪咀 に カミーユ

から変換する #RRGGBB まで CMYK シアン/マゼンタ/イエロー/キー

Icons

呪咀 に ラル®

から変換する #RRGGBB まで RAL® 番号 (RAL 0000)

呪咀 に 豚足®

から変換する #RRGGBB まで HKS® 番号(HKS 00)

呪咀 に パントン®

から変換する #RRGGBB まで Pantone® 番号 (Pantone 0000)

呪咀 に シャーウィン・ウィリアムズ®

から変換する #RRGGBB まで シャーウィン・ウィリアムズ® 番号 (SW 0000)

呪咀 に エヌシーエス®

から変換する #RRGGBB まで NCS番号(S0000-X00X)

nsc-logo

ラル® に ラグビー

から変換する RAL® 番号 (RAL 0000) まで RGB レッド・グリーン・ブルー

ラル® に ラグバ

から変換する RAL® 番号 (RAL 0000) まで RGBA 赤 緑 青 透過率

ラル® に カミーユ

から変換する RAL® 番号 (RAL 0000) まで CMYK シアン/マゼンタ/イエロー/キー

Icons

ラル® に 呪咀

から変換する 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)

nsc-logo

豚足® に ラグビー

から変換する HKS® 番号(HKS 00) まで RGB レッド・グリーン・ブルー

豚足® に ラグバ

から変換する HKS® 番号(HKS 00) まで RGBA 赤 緑 青 透過率

豚足® に カミーユ

から変換する HKS® 番号(HKS 00) まで CMYK シアン/マゼンタ/イエロー/キー

Icons

豚足® に 呪咀

から変換する 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)

nsc-logo

パントン® に ラグビー

から変換する Pantone® 番号 (Pantone 0000) まで RGB レッド・グリーン・ブルー

パントン® に ラグバ

から変換する Pantone® 番号 (Pantone 0000) まで RGBA 赤 緑 青 透過率

パントン® に カミーユ

から変換する Pantone® 番号 (Pantone 0000) まで CMYK シアン/マゼンタ/イエロー/キー

Icons

パントン® に 呪咀

から変換する 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)

nsc-logo

シャーウィン・ウィリアムズ® に ラグビー

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RGB レッド・グリーン・ブルー

シャーウィン・ウィリアムズ® に ラグバ

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RGBA 赤 緑 青 透過率

シャーウィン・ウィリアムズ® に カミーユ

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで CMYK シアン/マゼンタ/イエロー/キー

Icons

シャーウィン・ウィリアムズ® に 呪咀

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで #RRGGBB

シャーウィン・ウィリアムズ® に ラル®

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで RAL® 番号 (RAL 0000)

シャーウィン・ウィリアムズ® に 豚足®

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで HKS® 番号(HKS 00)

シャーウィン・ウィリアムズ® に パントン®

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで Pantone® 番号 (Pantone 0000)

シャーウィン・ウィリアムズ® に エヌシーエス®

から変換する シャーウィン・ウィリアムズ® 番号 (SW 0000) まで NCS番号(S0000-X00X)

nsc-logo

エヌシーエス® に ラグビー

から変換する NCS番号(S0000-X00X) まで RGB レッド・グリーン・ブルー

エヌシーエス® に ラグバ

から変換する NCS番号(S0000-X00X) まで RGBA 赤 緑 青 透過率

エヌシーエス® に カミーユ

から変換する NCS番号(S0000-X00X) まで CMYK シアン/マゼンタ/イエロー/キー

Icons

エヌシーエス® に 呪咀

から変換する NCS番号(S0000-X00X) まで #RRGGBB

エヌシーエス® に ラル®

から変換する NCS番号(S0000-X00X) まで RAL® 番号 (RAL 0000)

エヌシーエス® に 豚足®

から変換する NCS番号(S0000-X00X) まで HKS® 番号(HKS 00)

エヌシーエス® に パントン®

から変換する NCS番号(S0000-X00X) まで Pantone® 番号 (Pantone 0000)

To be able to save color palettes, you must be logged in.

Sign in to your account

or

Create an account

Current color palette Share
Should it be public or private?
Link(s) will follow after sharing.

Cancel Share

Color palette shared
Please copy and save the link you want.

Share

OK, I have copied the links

Your colors will be saved in a new color palette.
View it under your profile.
You can further customize it, and share it.

Show color palette
Close

Create a color palette

DownloadDownload in different formats

Remove All

By clicking you can create palettes and download the color swatches.