HEX(16進しん数すう)#965dad に対応するRGB(10進しん数すう)は...

rgb(150,93,173)

色の変へん換かん

形式表し方
Hex#965dad
RGB150,93,173
RGB(%)59%,36%,68%
CMY0.41,0.64,0.32
CMYK0.13,0.46,0.0,0.32
HSV283°,46%,68%
HSL283°,33%,52%

この色について

#965dadは暗めの色です

この色の反対の色(補色)は#74ad5dです

この色に似ている色(類似色)は#ad5d9c,#ad5d88や#6e5dad,#5d60adです

この色とバランスが良い色(トライアド配色)は#ad965dと#5dad96です

この色より明るい色

#965dadより10%明るい色:

#ac7ebe

#965dadより20%明るい色:

#c2a0cf

#965dadより30%明るい色:

#d7c2e0

#965dadより40%明るい色:

#ede4f1

#965dadより48%明るい色:

#ffffff

この色より暗い色

#965dadより10%暗い色:

#7a488e

#965dadより20%暗い色:

#5d376c

#965dadより30%暗い色:

#40264a

#965dadより40%暗い色:

#231529

#965dadより50%暗い色:

#060307

#965dadより52%暗い色:

#000000

この色よりあざやかな色

#965dadより10%あざやかな色:

#9b51b9

#965dadより20%あざやかな色:

#a044c6

#965dadより30%あざやかな色:

#a638d2

#965dadより40%あざやかな色:

#ab2cde

#965dadより50%あざやかな色:

#b020ea

#965dadより60%あざやかな色:

#b514f6

#965dadより67%あざやかな色:

#b90bff

この色よりあざやかさを下げた色

#965dadより10%あざやかさを下げた色:

#9169a1

#965dadより20%あざやかさを下げた色:

#8c7595

#965dadより30%あざやかさを下げた色:

#878189

#965dadより33%あざやかさを下げた色:

#858585

この色に似ている色

色のブレピュー

#965dadを背景色として利用する

#965dadに白文字を表示する
白の文字が表示されています
background: #965dad;
color: white;
#965dadに黒文字を表示する
黒の文字が表示されています
background: #965dad;
color: black;

#965dadを文字色として利用する

白背景に#965dadを文字色として表示する
白の背景に文字が表示されています
background: white;
color: #965dad;
黒背景に#965dadを文字色として表示する
黒の背景に文字が表示されています
background: black;
color: #965dad;

#965dadを線の色として利用する

白背景に#965dadを線の色として表示する
1pxの#965dadの線に囲まれています
border: 1px solid #965dad;
color: #4a4a4a;
2pxの#965dadの線に囲まれています
border: 2px solid #965dad;
color: #4a4a4a;
3pxの#965dadの線に囲まれています
border: 3px solid #965dad;
color: #4a4a4a;
黒背景に#965dadを線の色として表示する
1pxの#965dadの線に囲まれています
border: 1px solid #965dad;
background: black;
color: white;
2pxの#965dadの線に囲まれています
border: 2px solid #965dad;
background: black;
color: white;
3pxの#965dadの線に囲まれています
border: 3px solid #965dad;
background: black;
color: white;

#965dadをボックスの影の色として利用する

白背景に#965dadを影の色として表示する
#965dadの影に囲まれています
box-shadow: 0 2px 5px #965dad;
color: #4a4a4a;
#965dadを80%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.8);
color: #4a4a4a;
#965dadを60%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.6);
color: #4a4a4a;
#965dadを40%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.4);
color: #4a4a4a;
#965dadを20%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.2);
color: #4a4a4a;
黒背景に#965dadを影の色として表示する
#965dadの影に囲まれています
box-shadow: 0 2px 5px #965dad;
background: black;
color: white;
#965dadを80%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.8);
background: black;
color: white;
#965dadを60%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.6);
background: black;
color: white;
#965dadを40%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.4);
background: black;
color: white;
#965dadを20%うすくした影に囲まれています
box-shadow: 0 2px 5px rgba(150,93,173,0.2);
background: black;
color: white;

#965dadを文字の影の色として利用する

#965dadを黒文字の影の色として表示する
#965dadの影に囲まれています
text-shadow: 2px 2px 3px #965dad;
color: #4a4a4a;
#965dadを80%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.8);
color: #4a4a4a;
#965dadを60%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.6);
color: #4a4a4a;
#965dadを40%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.4);
color: #4a4a4a;
#965dadを20%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.2);
color: #4a4a4a;
#965dadを白文字の影の色として表示する
#965dadの影に囲まれています
text-shadow: 2px 2px 3px #965dad;
background: black;
color: white;
#965dadを80%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.8);
background: black;
color: white;
#965dadを60%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.6);
background: black;
color: white;
#965dadを40%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.4);
background: black;
color: white;
#965dadを20%うすくした影に囲まれています
text-shadow: 2px 2px 3px rgba(150,93,173,0.2);
background: black;
color: white;