HEX(16しんすう)#adfead に対応するRGB(10しんすう)は...

rgb(173,254,173)

色のへんかん

形式表し方
Hex#adfead
RGB173,254,173
RGB(%)68%,100%,68%
CMY0.32,0.0,0.32
CMYK0.32,0.0,0.32,0.0
HSV120°,32%,100%
HSL120°,98%,84%

この色について

#adfeadは明るめの色です

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

この色に似ている色(類似色)は#adfed6,#adfeea#d6fead,#eafeadです

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

この色より明るい色

#adfeadより10%明るい色:

#e1ffe1

#adfeadより16%明るい色:

#ffffff

この色より暗い色

#adfeadより10%暗い色:

#7cfd7c

#adfeadより20%暗い色:

#4afd4a

#adfeadより30%暗い色:

#17fc17

#adfeadより40%暗い色:

#03de03

#adfeadより50%暗い色:

#02ab02

#adfeadより60%暗い色:

#017901

#adfeadより70%暗い色:

#014701

#adfeadより80%暗い色:

#001400

#adfeadより84%暗い色:

#000000

この色よりあざやかな色

#adfeadより2%あざやかな色:

#acffac

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

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

#b1fab1

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

#b5f6b5

#adfeadより29%あざやかさを下げた色:

#b9f2b9

#adfeadより39%あざやかさを下げた色:

#bdeebd

#adfeadより51%あざやかさを下げた色:

#c2e9c2

#adfeadより61%あざやかさを下げた色:

#c6e5c6

#adfeadより70%あざやかさを下げた色:

#cae1ca

#adfeadより80%あざやかさを下げた色:

#ceddce

#adfeadより90%あざやかさを下げた色:

#d2d9d2

#adfeadより98%あざやかさを下げた色:

#d6d6d6

この色に似ている色

色のブレピュー

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

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

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

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

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

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

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

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

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

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