Content types

Every content block in a column carries the Content envelope — id, type, and values. The type discriminates which shape values takes. This page is the per-type reference.

Per-mode variants

Content blocks render in four display modes — email, web, document, popup. Each mode exposes a subset of values fields (e.g. email-only border-collapse handling, web-only hover states). The embedded editor surfaces only the options that apply to the active mode; the API endpoints expect the union. If you're hand-crafting designs, pass displayMode to /v3/templates/validate so per-mode rules apply.

Built-in types

type	What it is
text	A rich-text paragraph. values.text holds inline HTML (<a>, <strong>, <em>, spans for color/size). Merge tags supported via {{ tag }}.
image	An image with optional link, alt text, alignment, and per-device sizing.
button	A call-to-action button — label, link, color, border, padding, alignment.
heading	A <h1>–<h6> heading. values.headingType controls the level; values.text holds the inline HTML.
divider	A horizontal rule with color, thickness, and width controls.
html	A raw-HTML escape hatch. Use sparingly — the editor renders the string verbatim, no sanitization.
video	A linked video thumbnail with an overlaid play icon — emails can't embed real video players, so this is the conventional fallback.
social	A row of social-network icons with per-network URLs and a shared style.
menu	A horizontal navigation menu — list of { label, url }, shared style.
timer	A countdown to a target timestamp. Renders a server-side image so it works in email clients without JS.

Custom tools

Embedders can register their own content types via unlayer.registerTool(...). Custom blocks carry an extra slug discriminator:

{
  "type": "custom",
  "slug": "my_pricing_block",
  "values": {
    /* shape defined by the embedder */
  }
}

The values shape is whatever your tool definition declares — Unlayer validates the envelope but treats values as opaque. See Custom Tools for the registration API.

Shared value fields

All content values share a common envelope of styling and layout fields — exact subset varies by type and display mode:

Field	Type	Notes
containerPadding	string	CSS-style padding shorthand, e.g. "10px 0px".
hideDesktop	boolean	Hide on desktop breakpoint.
hideMobile	boolean	Hide on mobile breakpoint.
_meta	{ htmlID: string, htmlClassNames: string }	Stable identifiers for CSS targeting. Editor-managed.
displayCondition	object | null	Merge-tag-based show/hide condition; null = always show.
anchor	string	Optional fragment id for in-page anchor links.

For the canonical per-type schema, validate a payload against /v3/templates/validate — the response will tell you exactly which fields are required and which are extras.

Related

• Design object — the root that contains everything.
• Block object — the rows / columns that hold these content items.
• Custom Tools — register your own content types.
• Validate — verify a design against the canonical schema.