ねるねるねるねはヒッヒ。練れば練るほど色がかわって
RGB系
色の話です。RGB系の記述方法で色をゴネゴネすることができるようです。
rgb
10進数または%指定のRGB値を16進数のRGB値に変換します。
.example { color: rgb(100,254,10); color: rgb(10%,5%,72%); } /* .example { color: #64fe0a; color: #190cb7; } */
rgba
RGBA値を10進数のRGBA値に変換します。
CSSだと透明度付きの場合16進数で指定できませんが、16進数のRGB値を指定しても10進数に変換してくれます。
また、キーワードも変換してくれます。
なんやこの使いみちなさそうな関数・・・
.example { color: rgba(100,254,10,.5); color: rgba(10%,5%,10,.8); color: rgba(red,.7); color: rgba(#132,.2); } /* .example { color: rgba(100, 254, 10, 0.5); color: rgba(25, 12, 10, 0.8); color: rgba(255, 0, 0, 0.7); color: rgba(17, 51, 34, 0.2); } */
red
16進数のRGB値のR値(赤)を返します。
.example { property: red(#4c61a8); } /* .example { property: 76; } */
green
16進数のRGB値のG値(緑)を返します。
.example { property: green(#4c61a8); } /* .example { property: 97; } */
blue
16進数のRGB値のB値(青)を返します。
.example { property: blue(#4c61a8); } /* .example { property: 168; } */
mix
2つの色を混ぜて中間色が作れます。
.example { background: mix(#000, #fff, 50%); } /* .example { background: #7f7f7f; } */
RGB系の関数は以上ですが・・・・
うーん・・・使うのかこれ・・・