0
私はスタイラス、CSSプリプロセッサを使用しています。たとえば、色の「知覚される明るさ」を20%または-10%調整する機能が必要です。スタイラスの色の輝度を調整する
「輝度」という用語を発見しましたが、スタイラスの機能はです。は色の輝度を取得しますが、色の輝度は調整しません。
このような関数はどのように作成できますか?
私はスタイラス、CSSプリプロセッサを使用しています。たとえば、色の「知覚される明るさ」を20%または-10%調整する機能が必要です。スタイラスの色の輝度を調整する
「輝度」という用語を発見しましたが、スタイラスの機能はです。は色の輝度を取得しますが、色の輝度は調整しません。
このような関数はどのように作成できますか?
若干の微妙な変化の後で、これはうまくいくようです。私は100%正しいのかどうかは分かりません。
adjust-luminance($color, $amount = 10%)
$scale = unit($amount, '')/100 * 255
//green is the lightest component, followed by red, then blue.
$redWeight = 0.2126
$greenWeight = 0.7152
$blueWeight = 0.0722
// get the individual components of the color
$red = red($color)
$green = green($color)
$blue = blue($color)
//get percent
$percentRed = $red/255
$percentGreen = $green/255
$percentBlue = $blue/255
$lumRed = $percentRed * $redWeight
$lumGreen = $percentGreen * $greenWeight
$lumBlue = $percentBlue * $blueWeight
$lumTotal = 1 + ($lumRed + $lumGreen + $lumBlue)
$red += $scale * (1 - $redWeight) * $lumTotal
$green += $scale * (1 - $greenWeight) * $lumTotal
$blue += $scale * (1 - $blueWeight) * $lumTotal
$adjusted = rgb($red, $green, $blue)
$adjusted = saturation($adjusted, saturation($color))
return $adjusted
'lighten'機能があなたの目的 – blonfu
や' lightness'例えばはるかに良いためenoughtではありません: '明度(#000、50%)==>#808080' – blonfu