The following table lists the properties that all element types support.
Many properties use the relative unit system by default.
Name | Default | Description |
---|---|---|
track | null | The track number on which this element is placed. If you are rendering an image, you can leave this value at null. |
time | null | The time at which you want the element to appear within its composition. |
duration | null | The duration for which you would like the element to appear. When set to null, the element will be stretched until the end of the composition or the beginning of the next element on the same track, whichever comes first. |
dynamic | false | Determines what elements to display to the user for Bulk Generation and Shareable Forms. |
locked | false | By setting the property to false, the user is not able to interact with the element in the template designer. |
visible | true | When set to false, the element is not rendered. |
x | 50% | The x-axis position of the element in the composition. |
y | 50% | The y-axis position of the element in the composition. |
width | 100% | The width of the element in relation to the composition. |
height | 100% | The height of the element in relation to the composition. |
aspect_ratio | null | Using this property, the element will be constrained to a particular aspect ratio (width/height). A value of 1 is square, a value of 1.6 is 16:10. |
x_padding | 0 vw | Padding of the element on the horizontal axis. |
y_padding | 0 vh | Padding of the element on the vertical axis. |
z_index | null | The order in which the elements are rendered. When set to null (the default), the element is rendered in the same order in which it was defined. |
x_anchor | 50% | The element's origin from which its x-axis position, scale, rotate, and skew are applied. |
y_anchor | 50% | The element's origin from which its y-axis position, scale, rotate, and skew are applied. |
x_scale | 100% | The horizontal scale transformation in percent. |
y_scale | 100% | The vertical scale transformation in percent. |
x_skew | 0° | The horizontal skew transformation in degrees. |
y_skew | 0° | The vertical skew transformation in degrees. |
x_rotation | 0° | Rotates the element along the x-axis. |
y_rotation | 0° | Rotates the element along the y-axis. |
z_rotation | 0° | Rotates the element along the z-axis. |
perspective | null | The distance between the z=0 plane and the camera. Use it with the z_rotation and y_rotation. As this value decreases, the 3D perspective effect will become stronger. If null, the perspective is calculated by the element's dimensions. |
backface_visible | true | Set to false to hide the backface of the element when rotated around its x and y axes. |
x_alignment | 50% | The position of the element's content on the x-axis. It's often used with the aspect_ratio parameter. Also used to align text in text elements. |
y_alignment | 50% | The position of the element's content on the y-axis. It's often used with the aspect_ratio parameter. Also used to align text in text elements. |
fill_color | null | The fill color of the element. It may be a string or an array of color stops if fill_mode is set to linear or radial. Use the template designer to see how color stops are formatted. |
fill_mode | solid | The fill method used. There are 3 options: solid, linear, and radial. |
fill_x0 | 50% | The start position of the gradient on the x-axis. Use with fill_mode linear or radial. |
fill_y0 | 0% | The start position of the gradient on the y-axis. Use with fill_mode linear or radial. |
fill_x1 | 50% | The end position of the gradient on the x-axis. Use with fill_mode linear or radial. |
fill_y1 | 100% | The end position of the gradient on the y-axis. Use with fill_mode linear or radial. |
fill_radius | 50% | The radius of the radial gradient in relation to the element's max(width,height). |
stroke_color | null | The stroke color of the element. |
stroke_width | 0.1 vmin | The size of the stroke. |
stroke_cap | round | The stroke cap. There are 3 options: but, square, and round. |
stroke_join | round | The stroke join. There are 3 options: miter, bevel, and round. |
stroke_start | 0% | The start of the stroke relative to its total length. |
stroke_end | 100% | The end of the stroke relative to its total length. |
stroke_offset | 0% | The offset of the stroke relative to its total length. |
border_radius | 0 vmin | The border radius of the element. |
shadow_color | null | The shadow color, or null to disable it. |
shadow_blur | 3 vmin | The blurriness of the shadow. |
shadow_x | 0 vmin | The offset of the shadow on the x-axis. |
shadow_y | 0 vmin | The offset of the shadow on the y-axis. |
clip | false | When set to true, the element's content is clipped to its borders. |
opacity | 100% | The opacity of the element. |
blend_mode | none | The blend mode of the element. These options are available: none, multiply, screen, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, lighter, difference, exclusion, hue, saturation, color, luminosity. |
color_filter | none | The color filter that is applied to the element. These options are currently available: none, brighten, contrast, hue, invert, grayscale, and sepia. |
color_filter_value | 0% | This parameter allows you to control the color_filter, such as the intensity. |
color_overlay | null | A color that is applied on top the element. |
blur_radius | 0 | The radius of the blur that is applied to the element. |
blur_mode | stack | The algorithm used to blur the element. There are 3 options: stack, box, and box-2. |
mask_mode | null | By setting the mask mode, the element is used as a mask for the element one track below it. The options alpha and alpha-inverted use the alpha channel of this element, and luma and luma-inverted use the luminance. |
repeat | false | When set to true, the element is repeated in its composition, acting as a fill pattern. |
warp_mode | default | This parameter is used in conjunction with warp_matrix to apply a warp effect to the element. When set to default, the warp is applied based on a grid of points. By choosing the perspective option, you can warp the element using a 2 by 2 grid, similar to Adobe After Effects' "Perspective Corner Pin". |
warp_matrix | null | Array of points that control the warp effect. For a better understanding of how it should be configured, use the template designer. |
animations | null | An array of animation keyframes. |