Design Format
TextElement
Documentation for the TextElement type in the Polotno design JSON Schema.
Type Information
Base Type: object
Properties
| Property | Type | Description |
|---|---|---|
id | string | Unique identifier for the element. |
type | "text" | 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 (0 until measured/rendered). |
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. |
text | string | Visible text shown on canvas. |
placeholder | string | Placeholder text shown when empty. |
fontSize | number | Font size in pixels. |
fontFamily | string | Font family name. |
fontStyle | string | Font style: 'normal' or 'italic'. |
fontWeight | string | Font weight: 'normal', 'bold', or numeric string. |
textDecoration | string | Text decoration (e.g. underline, line-through). |
textTransform | string | Text transform: uppercase, lowercase, capitalize, none. |
fill | string | Text color. |
align | string | Horizontal alignment (commonly left |
verticalAlign | string | Vertical alignment: top, middle, bottom. |
strokeWidth | number | Stroke width in pixels. |
stroke | string | Stroke color. |
lineHeight | number | string | Line height multiplier or 'auto'. |
letterSpacing | number | Letter spacing as a fraction of font size. |
backgroundEnabled | boolean | Whether the text background is enabled. |
backgroundColor | string | Text background color. |
backgroundOpacity | number | Text background opacity (0-1). |
backgroundCornerRadius | number | Text background corner radius. |
backgroundPadding | number | Text background padding. |
curveEnabled | boolean | Whether the text curve effect is enabled. |
curvePower | number | Text curve power (-1 to 1, 0 = straight). |
legacyBackground | boolean | Internal compatibility flag stamped by the v2→v3 migration. |
JSON Schema
{
"type": "object",
"properties": {
"id": {
"type": "string",
"description": "Unique identifier for the element."
},
"type": {
"type": "string",
"const": "text"
},
"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": 0,
"description": "Height in pixels (0 until measured/rendered).",
"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"
},
"text": {
"default": "",
"description": "Visible text shown on canvas.",
"type": "string"
},
"placeholder": {
"default": "",
"description": "Placeholder text shown when empty.",
"type": "string"
},
"fontSize": {
"default": 14,
"description": "Font size in pixels.",
"type": "number"
},
"fontFamily": {
"default": "Roboto",
"description": "Font family name.",
"type": "string"
},
"fontStyle": {
"default": "normal",
"description": "Font style: 'normal' or 'italic'.",
"type": "string"
},
"fontWeight": {
"default": "normal",
"description": "Font weight: 'normal', 'bold', or numeric string.",
"type": "string"
},
"textDecoration": {
"default": "",
"description": "Text decoration (e.g. underline, line-through).",
"type": "string"
},
"textTransform": {
"default": "none",
"description": "Text transform: uppercase, lowercase, capitalize, none.",
"type": "string"
},
"fill": {
"default": "black",
"description": "Text color.",
"type": "string"
},
"align": {
"default": "center",
"description": "Horizontal alignment (commonly left | center | right | justify).",
"type": "string"
},
"verticalAlign": {
"default": "top",
"description": "Vertical alignment: top, middle, bottom.",
"type": "string"
},
"strokeWidth": {
"default": 0,
"description": "Stroke width in pixels.",
"type": "number"
},
"stroke": {
"default": "black",
"description": "Stroke color.",
"type": "string"
},
"lineHeight": {
"default": 1.2,
"description": "Line height multiplier or 'auto'.",
"anyOf": [
{
"type": "number"
},
{
"type": "string"
}
]
},
"letterSpacing": {
"default": 0,
"description": "Letter spacing as a fraction of font size.",
"type": "number"
},
"backgroundEnabled": {
"default": false,
"description": "Whether the text background is enabled.",
"type": "boolean"
},
"backgroundColor": {
"default": "#7ED321",
"description": "Text background color.",
"type": "string"
},
"backgroundOpacity": {
"default": 1,
"description": "Text background opacity (0-1).",
"type": "number"
},
"backgroundCornerRadius": {
"default": 0.5,
"description": "Text background corner radius.",
"type": "number"
},
"backgroundPadding": {
"default": 0.5,
"description": "Text background padding.",
"type": "number"
},
"curveEnabled": {
"default": false,
"description": "Whether the text curve effect is enabled.",
"type": "boolean"
},
"curvePower": {
"default": 0.5,
"description": "Text curve power (-1 to 1, 0 = straight).",
"type": "number"
},
"legacyBackground": {
"description": "Internal compatibility flag stamped by the v2→v3 migration.",
"type": "boolean"
}
},
"required": [
"id",
"type"
]
}