Polotno
Design Format

GroupElement

Documentation for the GroupElement type in the Polotno design JSON Schema.

Type Information

Base Type: object

Properties

PropertyTypeDescription
idstringUnique identifier for the element.
type"group"Element type identifier.
namestringDisplay name for the element.
customunknownCustom data attached to the element.
opacitynumberOpacity 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.
visiblebooleanWhether the element is visible.
selectablebooleanWhether the element can be selected.
removablebooleanWhether the element can be removed.
alwaysOnTopbooleanWhether the element stays on top of others.
showInExportbooleanWhether the element appears in exports.
animationsArray<Animation>Animation configurations.
childrenArray<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": "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"
        ]
      }
    },
    "children": {
      "default": [],
      "description": "Child elements in this group.",
      "type": "array",
      "items": {
        "$ref": "#/$defs/__schema0"
      }
    }
  },
  "required": [
    "id",
    "type"
  ]
}

On this page