I'm interested in the following CSS filters:
blur
brightness
contrast
grayscale
hue-rotate
invert
opacity
saturate
sepia
What are the default values for each (preferably as a % value, where appropriate)?
The MDN docs don't cover this!
Only for those who want context.
In Angular, I am applying some filters like so:
<div [ngStyle]="{ filter:
'brightness(' + filters.brightness + '%) ' +
'contrast(' + filters.contrast + '%) ' +
'grayscale(' + filters.grayscale + '%) ' +
'saturate(' + filters.saturate + '%) ' +
'sepia(' + filters.sepia + '%) ' +
'hue-rotate(' + filters['hue-rotate'] + 'deg) ' +
'invert(' + filters.invert + '%)'
}">
<span>herro</hello>
</div>
As such, I need to set a default value for each in the controller, which I want to be the "usual" default values - but I don't know what those values are!
The specification covers this but you can have them as percentage only when the filter accept number
or percentage
for blur
The initial value for interpolation is 0px.
for brightness
The initial value for interpolation is 1.
and so on...