Filters and effects
There are several graphic effects that you can apply to a layer’s contents. They work on all layers, including video layers.
Framer’s filters applied to different kinds of layers
Note that you can set the values for the filters when editing a layer (or layer animation). They’re in the bottom part of the Properties Panel.
Since the ‘Framer Effects’ update, they can now also be applied in Design.
Blur
Adds a Gaussian blur to the layer. The default value is 0
: no blur.
layer.blur = 10
Background blur
Adds a blur to the layers underneath the layer. The default value is 0
: no blur.
Note that this may not work in every browser, and can produce rendering artifacts.
layer.backgroundBlur = 10
Brightness
Will brighten or darken a layer. The default value is 100
. Setting it to 0
will make your layer completely black. There’s no upper limit.
layer.brightness = 120
Contrast
Sets the contrast of a layer. The default value is 100
. The lowest possible value, 0
, means ‘no contrast,’ and will result in an even, gray layer.
Any value above 100
will add contrast. There’s no upper limit.
layer.contrast = 120
Saturation
The default value is 100
, so setting it to 0
will make everything in the layer grayscale. Values above 100
will intensify the colors.
layer.saturate = 150
Grayscale
Will convert all colors to gray. The default value is 0
and setting grayscale to 100
will remove all color. (The same result as layer.saturate = 0
.)
layer.grayscale = 100
Hue
Shifts the hue of all the colors in a layer. Hue rotation is defined in degrees between 0
and 360
, the default value is 0
.
360º will give a full rotation, appearing the same as 0º.
layer.hueRotate = 180
Invert
Inverts all color and brightness values of a layer.
The default value is 0
, while setting it to 100
will replace all hues with their complementary colors. (Like doing an ‘Invert’ in Photoshop.)
At 50
, everything will meet in the middle, which results in an even, gray layer.
layer.invert = 100
Sepia
Will add a sepia tone to your layer; the maximum value is 100
.
layer.sepia = 50