PPTX.gallery

Layout Pattern

Hero

Combine a prominent visual or message with supporting content. Use it when one element should lead the audience into the details.

TextMixed

How to Use It

Combine a prominent visual or message with supporting content. Use it when one element should lead the audience into the details.

Preview + source

Explore this layout

Introduce one central idea with a dominant image and concise supporting copy.

All people, quotations and business figures in these examples are illustrative.

Hero: canonical rendered example
Inspect full-size SVG

This prepared preview and the OPF describe the same example. Area outlines show measured allocation; toggling them does not change the slide.

Copy complete portable OPF

Inspect compact default-catalog references. Your host must register the matching catalog; source identifies it without fetching over the network. Copy always includes complete embedded records.

{5 keys
"$schema": "https://openpresentation.org/schema/opf/v1",
"name": "Layout fixture hero",
"design": {1 keys
"background": "light1"
},
"slides": [1 items
{4 keys
"layout": "hero",
"title": "One team. One outcome.",
"subtitle": "Illustrative example • fictional data",
"blocks": [5 items
{2 keys
"region": "lead",
"text": "Test with two teams for six weeks. Measure task completion and time before deciding what to scale."
},
{2 keys
"region": "media",
"image": {2 keys
"src": "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNjAgMTAwIiB3aWR0aD0iMTYwMCIgaGVpZ2h0PSIxMDAwIj48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9InMiIHgxPSIwIiB5MT0iMCIgeDI9IjAiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiM3YWE3ZTYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNjZmUwZjUiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB3aWR0aD0iMTYwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNzKSIvPjxwYXRoIGQ9Ik0wIDYyIFE0MCA0MCA4MCA1OCBUMTYwIDUwIFYxMDAgSDAgWiIgZmlsbD0iIzNmOGE1NSIvPjxwYXRoIGQ9Ik0wIDc4IFE1MCA2NCAxMDAgNzYgVDE2MCA3MiBWMTAwIEgwIFoiIGZpbGw9IiMyZjZiNDIiLz48L3N2Zz4=",
"alt": "Illustrative landscape with two green ridges"
}
},
{2 keys
"region": "support",
"text": "Keep the scope narrow, collect feedback weekly and give each decision a named owner."
},
{2 keys
"region": "support",
"text": "Compare the results with the baseline. Expand only when the evidence supports the next step."
},
{2 keys
"region": "support",
"text": "Test with two teams for six weeks. Measure task completion and time before deciding what to scale."
}
]
}
],
"catalogs": {1 keys
"default": {1 keys
"source": "https://www.pptx.gallery"
}
}
}
Layout structure and reference fields
How automatic composition differs

Try dynamic composition

Explore how a text slide reflows as you change its content and shape. These examples use OPF’s shared composition rules; the copied document includes your choices.

Let the content find its spaceStart with the decision. State what the audience should understand or do.Show the evidence. Give each supporting idea enough space to be read.Make the next step clear. Keep the action specific and easy to remember.

All sample text fits within its content areas.

View the complete OPF example
{
  "$schema": "https://openpresentation.org/schema/opf/v1",
  "name": "Dynamic composition example",
  "design": {
    "dimensions": {
      "widthInches": 13.333333333333334,
      "heightInches": 7.5
    }
  },
  "slides": [
    {
      "title": "Let the content find its space",
      "composition": {
        "mode": "auto"
      },
      "blocks": [
        {
          "text": "Start with the decision. State what the audience should understand or do."
        },
        {
          "text": "Show the evidence. Give each supporting idea enough space to be read."
        },
        {
          "text": "Make the next step clear. Keep the action specific and easy to remember."
        }
      ]
    }
  ]
}

Composition rules and examples as JSON · Pagination rules and example JSON

Related Layouts

Similar OPF layout slugs with matching content types, spatial patterns, or presentation use cases.

Groups Of Items

Comparison

Compare alternatives using parallel information. Keep the same criteria and level of detail for every option.

/layouts/comparison

Visuals

Image beside

Explain a visual alongside its supporting text. Use the text to direct attention to the meaningful parts of the image.

/layouts/image-beside

Text

Two columns

Place two bodies of content beside each other. Use it for paired explanations or an argument with supporting evidence.

/layouts/two-column

Groups Of Items

Pillars

Show the main themes or principles behind an idea. Give each item a short heading and a comparable amount of detail.

/layouts/pillars

Mixed

Team

Introduce people and their roles. Use consistent names, descriptions and portraits when available.

/layouts/team

Openers And Closers

Closing

End with the action the audience should take. Include contact details or a brief thank-you when useful.

/layouts/closing