Design Format
FigureElement
Documentation for the FigureElement type in the Polotno design JSON Schema.
Type Information
Base Type: object
Properties
| Property | Type | Description |
|---|---|---|
id | string | Unique identifier for the element. |
type | "figure" | No description provided |
name | string | Display name for the element. |
custom | unknown | Custom data attached to the element. |
x | number | X position in pixels. |
y | number | Y position in pixels. |
width | number | Width in pixels. |
height | number | Height in pixels. |
rotation | number | Rotation angle in degrees. |
opacity | number | Opacity level (0-1). |
animations | Array<Animation> | Animation configurations. |
blurEnabled | boolean | Whether blur effect is enabled. |
blurRadius | number | Blur radius in pixels. |
brightnessEnabled | boolean | Whether brightness effect is enabled. |
brightness | number | Brightness level (-1 to 1). |
sepiaEnabled | boolean | Whether sepia effect is enabled. |
grayscaleEnabled | boolean | Whether grayscale effect is enabled. |
filters | object | Applied image filters keyed by filter name. |
shadowEnabled | boolean | Whether shadow is enabled. |
shadowBlur | number | Shadow blur radius in pixels. |
shadowOffsetX | number | Shadow horizontal offset in pixels. |
shadowOffsetY | number | Shadow vertical offset in pixels. |
shadowColor | string | Shadow color. |
shadowOpacity | number | Shadow opacity (0-1). |
visible | boolean | Whether the element is visible. |
draggable | boolean | Whether the element can be dragged. |
resizable | boolean | Whether the element can be resized. |
selectable | boolean | Whether the element can be selected. |
removable | boolean | Whether the element can be removed. |
contentEditable | boolean | Whether the element content can be edited. |
styleEditable | boolean | Whether the element style can be edited. |
alwaysOnTop | boolean | Whether the element stays on top of others. |
showInExport | boolean | Whether the element appears in exports. |
subType | string | Figure subtype: rect, ellipse, triangle, etc. |
fill | string | Fill color. |
dash | Array<number> | Dash pattern array. |
strokeWidth | number | No description provided |
stroke | string | No description provided |
cornerRadius | number | No description provided |
JSON Schema
{
"type": "object",
"properties": {
"id": {
"type": "string",
"description": "Unique identifier for the element."
},
"type": {
"type": "string",
"const": "figure"
},
"name": {
"default": "",
"description": "Display name for the element.",
"type": "string"
},
"custom": {
"description": "Custom data attached to the element."
},
"x": {
"default": 0,
"description": "X position in pixels.",
"type": "number"
},
"y": {
"default": 0,
"description": "Y position in pixels.",
"type": "number"
},
"width": {
"default": 100,
"description": "Width in pixels.",
"type": "number"
},
"height": {
"default": 100,
"description": "Height in pixels.",
"type": "number"
},
"rotation": {
"default": 0,
"description": "Rotation angle in degrees.",
"type": "number"
},
"opacity": {
"default": 1,
"description": "Opacity level (0-1).",
"type": "number"
},
"animations": {
"default": [],
"description": "Animation configurations.",
"type": "array",
"items": {
"type": "object",
"properties": {
"delay": {
"default": 0,
"description": "Delay before the animation starts, in milliseconds.",
"type": "number"
},
"duration": {
"default": 500,
"description": "Animation duration in milliseconds.",
"type": "number"
},
"enabled": {
"default": true,
"description": "Whether the animation is enabled.",
"type": "boolean"
},
"type": {
"type": "string",
"enum": [
"enter",
"exit",
"loop"
],
"description": "Animation phase."
},
"name": {
"default": "none",
"description": "Animation name identifier.",
"type": "string"
},
"data": {
"default": {},
"description": "Animation-specific data."
}
},
"required": [
"type"
]
}
},
"blurEnabled": {
"default": false,
"description": "Whether blur effect is enabled.",
"type": "boolean"
},
"blurRadius": {
"default": 10,
"description": "Blur radius in pixels.",
"type": "number"
},
"brightnessEnabled": {
"default": false,
"description": "Whether brightness effect is enabled.",
"type": "boolean"
},
"brightness": {
"default": 0,
"description": "Brightness level (-1 to 1).",
"type": "number"
},
"sepiaEnabled": {
"default": false,
"description": "Whether sepia effect is enabled.",
"type": "boolean"
},
"grayscaleEnabled": {
"default": false,
"description": "Whether grayscale effect is enabled.",
"type": "boolean"
},
"filters": {
"default": {},
"type": "object",
"propertyNames": {
"type": "string"
},
"additionalProperties": {
"type": "object",
"properties": {
"intensity": {
"default": 1,
"description": "Filter intensity (-1 to 1).",
"type": "number"
}
}
},
"description": "Applied image filters keyed by filter name."
},
"shadowEnabled": {
"default": false,
"description": "Whether shadow is enabled.",
"type": "boolean"
},
"shadowBlur": {
"default": 5,
"description": "Shadow blur radius in pixels.",
"type": "number"
},
"shadowOffsetX": {
"default": 0,
"description": "Shadow horizontal offset in pixels.",
"type": "number"
},
"shadowOffsetY": {
"default": 0,
"description": "Shadow vertical offset in pixels.",
"type": "number"
},
"shadowColor": {
"default": "black",
"description": "Shadow color.",
"type": "string"
},
"shadowOpacity": {
"default": 1,
"description": "Shadow opacity (0-1).",
"type": "number"
},
"visible": {
"default": true,
"description": "Whether the element is visible.",
"type": "boolean"
},
"draggable": {
"default": true,
"description": "Whether the element can be dragged.",
"type": "boolean"
},
"resizable": {
"default": true,
"description": "Whether the element can be resized.",
"type": "boolean"
},
"selectable": {
"default": true,
"description": "Whether the element can be selected.",
"type": "boolean"
},
"removable": {
"default": true,
"description": "Whether the element can be removed.",
"type": "boolean"
},
"contentEditable": {
"default": true,
"description": "Whether the element content can be edited.",
"type": "boolean"
},
"styleEditable": {
"default": true,
"description": "Whether the element style can be edited.",
"type": "boolean"
},
"alwaysOnTop": {
"default": false,
"description": "Whether the element stays on top of others.",
"type": "boolean"
},
"showInExport": {
"default": true,
"description": "Whether the element appears in exports.",
"type": "boolean"
},
"subType": {
"default": "rect",
"description": "Figure subtype: rect, ellipse, triangle, etc.",
"type": "string"
},
"fill": {
"default": "rgb(0, 161, 255)",
"description": "Fill color.",
"type": "string"
},
"dash": {
"default": [],
"description": "Dash pattern array.",
"type": "array",
"items": {
"type": "number"
}
},
"strokeWidth": {
"default": 0,
"type": "number"
},
"stroke": {
"default": "rgba(98, 197, 255, 1)",
"type": "string"
},
"cornerRadius": {
"default": 0,
"type": "number"
}
},
"required": [
"id",
"type"
]
}