Sassメモ:rgba()値を簡単に出す

goto_jp 2,518views 更新:2014年1月17日
.box {
  background: rgba(255,255,102,0.5);
}

rgba()を使った色指定は簡単に半透明も含められるので便利ですが、16進数の色コードに慣れているとRGB値で書くのは手間だったりします。
Sassならば16進数色コードのままで書いてもRGB値に変換されます。

.box {
  background: rgba(#ffff66,0.5);
}

これで前者のHTMLに出力されます。

もちろん変数を利用しても良いです。

$color: #ff6;
.box {
  background: rgba($color,0.5);
}

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません