Note: This element supports both static images (Image type) and animated images (Gif type). The element type should be set to "Image" for static images and "Gif" for animated GIF files.
| Prop | Type | Required | Example | Value Range | Description |
|---|---|---|---|---|---|
| width | number | true | - | - | The width of the image element. |
| height | number | true | - | - | The height of the image element. |
| externalUrl | string | false | - | - | The URL of the image file from an external source. |
| ext | string | true | - | - | The file extension of the image (e.g., "jpeg", "png", "gif"). |
| tone | object | false | - | - | Adjustments to the image tone, including gamma, saturation, contrast, brightness, and color channels. |
| lut | object | false | - | - | The lookup table used to adjust the image tone. |
| filterAgent | object | false | - | - | The filter configuration applied to the image. Supports optional region masking. |
| maskData | object | false | - | - | Mask configuration to crop or shape the image element itself (node-level clipping). This is different from filterAgent.region, which limits where filter effects are applied. |
Note: The externalUrl must be accessible.
1{
2 "id": "cc150dd5-f952-4945-a0f6-e09707c096a6",
3 "type": "Image",
4 "width": 2621,
5 "height": 3931,
6 "start": 0,
7 "duration": 5,
8 "trackIndex": 0,
9 "x": 0,
10 "y": 0,
11 "blendMode": "normal",
12 "anchorX": 1310.5,
13 "anchorY": 1965.5,
14 "rotation": 0,
15 "scaleX": 0.27473925209870265,
16 "scaleY": 0.27473925209870265,
17 "alpha": 1,
18 "skewX": 0,
19 "skewY": 0,
20 "keyframes": [],
21 "filterAgent": {
22 "type": "Ascii",
23 "options": [{ "key": "size", "value": 8, "min": 1, "max": 100 }]
24 },
25 "externalUrl": "https://images.pexels.com/photos/30473423/pexels-photo-30473423.jpeg",
26 "ext": "jpeg",
27 "tone": {
28 "gamma": 0.67,
29 "saturation": 0,
30 "contrast": 0,
31 "brightness": 0,
32 "red": 0,
33 "green": 0,
34 "blue": 0
35 }
36 }
37