Skip to main content
Block quote elements render styled containers with a left border, useful for callouts, quoted text, or highlighted sections. They can contain any other content elements as children.

Basic block quote

{
  "type": "blockquote",
  "content": [
    { "type": "text", "text": "This is a block quote with default styling." }
  ]
}
By default, block quotes render with a 3px gray left border and 10mm left indent.

Properties

PropertyTypeRequiredDefaultDescription
typestringYesMust be "blockquote"
idstringNoautoUnique identifier. Auto-generated if not provided. Max: 100 chars.
contentarrayYesArray of child elements (text, lists, images, etc.). Min: 1, max: 200.
fontFamilystringNoinheritedFont family override. Max: 100 chars.
fontSizenumberNoinheritedFont size in pt (6–72).
fontWeightstringNo"normal""normal" or "bold"
fontStylestringNo"normal""normal" or "italic"
colorstringNoinheritedText color in hex (#RGB or #RRGGBB).
alignstringNo"left"Alignment: "left", "center", "right", "justify"
backgroundColorstringNoBackground color in hex (#RGB, #RRGGBB, or #RRGGBBAA with alpha).
borderWidthnumberNo3Border width in px (0–20).
borderColorstringNo"#CCCCCC"Border color in hex (#RGB or #RRGGBB).
borderTopbooleanNofalseShow top border.
borderBottombooleanNofalseShow bottom border.
borderLeftbooleanNotrueShow left border.
borderRightbooleanNofalseShow right border.
indentLeftnumberNo10Left indent in mm (0–100).
indentRightnumberNo0Right indent in mm (0–100).
spacingobjectNoSpacing override with before and after in pt (0–100).
The defaults shown above are the built-in fallbacks. Block quotes also respect styles from defaults.styles.blockquote in your document configuration.

Content

The content array accepts the same element types as a flow section — text, headings, lists, images, tables, etc. This makes block quotes flexible containers:
{
  "type": "blockquote",
  "content": [
    { "type": "text", "text": "**Important:** Review the following items before proceeding." },
    {
      "type": "list",
      "ordered": true,
      "items": ["Check all inputs", "Validate results", "Submit report"]
    }
  ]
}

Styling examples

Callout box with background

{
  "type": "blockquote",
  "backgroundColor": "#FFF3E0",
  "borderColor": "#FF9800",
  "borderWidth": 3,
  "content": [
    { "type": "text", "text": "**Note:** Please review the attached documents before the meeting." }
  ]
}

Box with all borders

{
  "type": "blockquote",
  "borderTop": true,
  "borderBottom": true,
  "borderLeft": true,
  "borderRight": true,
  "borderColor": "#1976D2",
  "backgroundColor": "#E3F2FD",
  "content": [
    { "type": "text", "text": "This block quote has borders on all four sides." }
  ]
}

Italic centered quote

{
  "type": "blockquote",
  "fontStyle": "italic",
  "align": "center",
  "color": "#555555",
  "content": [
    { "type": "text", "text": "\"The best way to predict the future is to invent it.\"" }
  ]
}

Custom indent and spacing

{
  "type": "blockquote",
  "indentLeft": 20,
  "indentRight": 20,
  "spacing": { "before": 12, "after": 12 },
  "content": [
    { "type": "text", "text": "This block quote is indented further from both sides with extra spacing." }
  ]
}

Defaults

Configure default styles for all block quotes via defaults.styles.blockquote:
{
  "defaults": {
    "styles": {
      "blockquote": {
        "fontFamily": "Georgia",
        "fontStyle": "italic",
        "color": "#444444",
        "backgroundColor": "#F5F5F5",
        "borderColor": "#999999",
        "borderWidth": 3,
        "indentLeft": 15
      }
    }
  }
}

Block quote style properties

PropertyTypeDescription
fontFamilystringDefault font family. Max: 100 chars.
fontSizenumberDefault font size in pt (6–72).
fontWeightstring"normal" or "bold"
fontStylestring"normal" or "italic"
colorstringDefault text color in hex.
alignstringDefault alignment.
backgroundColorstringDefault background color in hex (supports alpha).
borderWidthnumberDefault border width in px (0–20).
borderColorstringDefault border color in hex.
borderTopbooleanDefault top border visibility.
borderBottombooleanDefault bottom border visibility.
borderLeftbooleanDefault left border visibility.
borderRightbooleanDefault right border visibility.
indentLeftnumberDefault left indent in mm (0–100).
indentRightnumberDefault right indent in mm (0–100).
You can also configure default spacing for block quotes via defaults.spacing:
{
  "defaults": {
    "spacing": {
      "before": { "blockquote": 8 },
      "after": { "blockquote": 8 }
    }
  }
}

Complete example

{
  "document": { "type": "pdf", "size": "A4" },
  "defaults": {
    "fontFamily": "Noto Sans",
    "fontSize": 11,
    "styles": {
      "blockquote": {
        "fontStyle": "italic",
        "borderColor": "#999999",
        "indentLeft": 12
      }
    }
  },
  "sections": [
    {
      "type": "flow",
      "content": [
        { "type": "h1", "text": "Research Summary" },
        { "type": "text", "text": "The study concluded with the following key finding:" },
        {
          "type": "blockquote",
          "content": [
            { "type": "text", "text": "Automation reduces document production time by an average of **73%** compared to manual processes." }
          ]
        },
        { "type": "text", "text": "This result was consistent across all test groups." },
        {
          "type": "blockquote",
          "backgroundColor": "#FFF8E1",
          "borderColor": "#FFC107",
          "fontStyle": "normal",
          "content": [
            { "type": "text", "text": "**Warning:** These results are preliminary and should be validated with a larger sample size." }
          ]
        }
      ]
    }
  ]
}