Polotno
Design Format

Design

The root Polotno design document – width, height, fonts, pages and other top-level metadata. This is what `store.toJSON()` produces and `store.loadJSON()` accepts.

Type Information

Base Type: object

Properties

PropertyTypeDescription
schemaVersionnumberSchema version for compatibility / migration. A design without it counts as version 0, the oldest format, and is migrated on load, so write the current version in new JSON.
widthnumberCanvas width in pixels.
heightnumberCanvas height in pixels.
unit"px" | "pt" | "mm" | "cm" | "in"Unit type for print measurements.
dpinumberDots per inch for print calculations.
customunknownCustom data attached to the design.
fontsArray<Font>Fonts used in the design.
pagesArray<Page>Pages in the design.
audiosArray<Audio>Audio tracks in the design.

JSON Schema

{
  "type": "object",
  "properties": {
    "schemaVersion": {
      "default": 5,
      "description": "Schema version for compatibility / migration. A design without it counts as version 0, the oldest format, and is migrated on load, so write the current version in new JSON.",
      "type": "number"
    },
    "width": {
      "default": 1080,
      "description": "Canvas width in pixels.",
      "type": "number"
    },
    "height": {
      "default": 1080,
      "description": "Canvas height in pixels.",
      "type": "number"
    },
    "unit": {
      "default": "px",
      "description": "Unit type for print measurements.",
      "type": "string",
      "enum": [
        "px",
        "pt",
        "mm",
        "cm",
        "in"
      ]
    },
    "dpi": {
      "default": 72,
      "description": "Dots per inch for print calculations.",
      "type": "number"
    },
    "custom": {
      "description": "Custom data attached to the design."
    },
    "fonts": {
      "default": [],
      "description": "Fonts used in the design.",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "fontFamily": {
            "type": "string",
            "description": "Font family name."
          },
          "url": {
            "default": "",
            "description": "URL to load the font from (single-variant fonts).",
            "type": "string"
          },
          "styles": {
            "description": "Per-weight/style variants for multi-variant families.",
            "type": "array",
            "items": {
              "type": "object",
              "properties": {
                "src": {
                  "type": "string",
                  "description": "Font source, typically in CSS url() form."
                },
                "fontStyle": {
                  "type": "string"
                },
                "fontWeight": {
                  "type": "string"
                }
              },
              "required": [
                "src"
              ]
            }
          }
        },
        "required": [
          "fontFamily"
        ]
      }
    },
    "pages": {
      "default": [],
      "description": "Pages in the design.",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "id": {
            "type": "string",
            "description": "Unique identifier for the page."
          },
          "width": {
            "default": "auto",
            "description": "Page width in pixels or 'auto'.",
            "anyOf": [
              {
                "type": "number"
              },
              {
                "type": "string",
                "const": "auto"
              }
            ]
          },
          "height": {
            "default": "auto",
            "description": "Page height in pixels or 'auto'.",
            "anyOf": [
              {
                "type": "number"
              },
              {
                "type": "string",
                "const": "auto"
              }
            ]
          },
          "background": {
            "default": "white",
            "description": "Background color or image.",
            "type": "string"
          },
          "bleed": {
            "default": 0,
            "description": "Bleed area in pixels for print (all sides; base value for per-side overrides).",
            "type": "number"
          },
          "bleedTop": {
            "description": "Per-side bleed override (top), in pixels. Inherits `bleed` when omitted.",
            "type": "number"
          },
          "bleedRight": {
            "description": "Per-side bleed override (right), in pixels. Inherits `bleed` when omitted.",
            "type": "number"
          },
          "bleedBottom": {
            "description": "Per-side bleed override (bottom), in pixels. Inherits `bleed` when omitted.",
            "type": "number"
          },
          "bleedLeft": {
            "description": "Per-side bleed override (left), in pixels. Inherits `bleed` when omitted.",
            "type": "number"
          },
          "custom": {},
          "duration": {
            "default": 5000,
            "description": "Page duration in milliseconds.",
            "type": "number"
          },
          "children": {
            "default": [],
            "description": "Elements on this page.",
            "type": "array",
            "items": {
              "$ref": "#/$defs/__schema0"
            }
          }
        },
        "required": [
          "id"
        ]
      }
    },
    "audios": {
      "default": [],
      "description": "Audio tracks in the design.",
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "id": {
            "type": "string",
            "description": "Unique identifier for the audio track."
          },
          "name": {
            "default": "",
            "description": "Display name shown on the timeline.",
            "type": "string"
          },
          "src": {
            "default": "",
            "description": "URL or data URI of the audio file.",
            "type": "string"
          },
          "duration": {
            "default": 0,
            "description": "Duration in milliseconds.",
            "type": "number"
          },
          "startTime": {
            "default": 0,
            "description": "Start offset (0-1).",
            "type": "number"
          },
          "endTime": {
            "default": 1,
            "description": "End offset (0-1).",
            "type": "number"
          },
          "volume": {
            "default": 1,
            "description": "Volume level (0-1).",
            "type": "number"
          },
          "delay": {
            "default": 0,
            "description": "Delay before playing, in milliseconds.",
            "type": "number"
          },
          "speed": {
            "default": 1,
            "description": "Playback speed multiplier (1 = normal).",
            "type": "number"
          },
          "custom": {}
        },
        "required": [
          "id"
        ]
      }
    }
  }
}

On this page