【謎CSS】なんとも言えない色

　どうも！LSSです！！

当ブログでは、「HTMLなど カテゴリー」で様々なCSSアイデアを書いてきました。

「どういう表現に使えるか」が明確なものが、使用するのをオススメしやすくて望ましいのですが、「とりあえず作っては見たけど…何に使えるんだ？コレ」とお蔵入りする事も多々あります。

また、最近では自分でイマイチ使い途が思いつかないネタでも、うまくアレンジして試していただいている読者の方もおられ、それに甘えている自分もいますｗ

…という前置きで、また実験的によく分からないものが出来てしまいました。

なんとも言えない色

 

コード

<div style="
width: 280px;
height: 280px;
background:
linear-gradient(to top right,#ff000040,#ff000000),
linear-gradient(0deg,#00ff0040,#00ff0000),
linear-gradient(to top left,#0000ff40,#0000ff00);
"> </div>

３つのグラデーションを重ねています

to top right な赤

0deg な緑

to top left な青

赤・緑・青の３色、それぞれ角度の異なるグラデーションを半透明にして重ねています。

そうする事で、色の混ざり具合が奇妙な感じのものになるかな？と思ったのですが…奇妙すぎますよねｗｗｗ

使うとしたら…何？

この配色を何かに使うとしたら…なんだろう？

不安な気持ちの表現とかに使えるかも？とか思いましたが

うん、やっぱりなんとも言えないですね…。

<div style="border-radius: 20px; padding: 10px; border: 3px solid transparent; background: linear-gradient(to top right,#ff000040,#ff000000),linear-gradient(0deg,#00ff0040,#00ff0000),linear-gradient(to top left,#0000ff40,#0000ff00);">うん、やっぱりなんとも言えないですね…。</div>

ってなとこで、今回はこのへんで！

次回もまた、よろしくお願いします^^