Design Format
GroupElement
Documentation for the GroupElement type in the Polotno design JSON Schema.
Type Information
Base Type: object
Properties
| Property | Type | Description |
|---|---|---|
id | string | Unique identifier for the element. |
type | "group" | Element type identifier. |
name | string | Display name for the element. |
custom | unknown | Custom data attached to the element. |
opacity | number | Opacity level (0-1). |
blendMode | "pass-through" | "normal" | "multiply" | "screen" | "overlay" | "darken" | "lighten" | "color-dodge" | "color-burn" | "hard-light" | "soft-light" | "difference" | "exclusion" | "hue" | "saturation" | "color" | "luminosity" | How the group composites with the content beneath it. Omitted means pass-through: children blend with that content directly. Any other mode composites the children together first. |
visible | boolean | Whether the element is visible. |
selectable | boolean | Whether the element can be selected. |
removable | boolean | Whether the element can be removed. |
alwaysOnTop | boolean | Whether the element stays on top of others. |
showInExport | boolean | Whether the element appears in exports. |
animations | Array<Animation> | The element's animations, at most one of each type, so an 'enter', an 'exit' and a 'loop' can play together. A group's animations play on top of its children's. |
children | Array<Element> | Child elements in this group. |
JSON Schema
{
"type": "object",
"properties": {
"id": {
"type": "string",
"description": "Unique identifier for the element."
},
"type": {
"type": "string",
"const": "group",
"description": "Element type identifier."
},
"name": {
"default": "",
"description": "Display name for the element.",
"type": "string"
},
"custom": {
"description": "Custom data attached to the element."
},
"opacity": {
"default": 1,
"description": "Opacity level (0-1).",
"type": "number"
},
"blendMode": {
"description": "How the group composites with the content beneath it. Omitted means pass-through: children blend with that content directly. Any other mode composites the children together first.",
"type": "string",
"enum": [
"pass-through",
"normal",
"multiply",
"screen",
"overlay",
"darken",
"lighten",
"color-dodge",
"color-burn",
"hard-light",
"soft-light",
"difference",
"exclusion",
"hue",
"saturation",
"color",
"luminosity"
]
},
"visible": {
"default": true,
"description": "Whether the element is visible.",
"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"
},
"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"
},
"animations": {
"default": [],
"description": "The element's animations, at most one of each `type`, so an 'enter', an 'exit' and a 'loop' can play together. A group's animations play on top of its children's.",
"type": "array",
"items": {
"$ref": "#/$defs/Animation"
}
},
"children": {
"default": [],
"description": "Child elements in this group.",
"type": "array",
"items": {
"$ref": "#/$defs/__schema0"
}
}
},
"required": [
"id",
"type"
]
}