Blog Thumbnail Generation

Overview #

Davix H2I can generate blog thumbnail images dynamically by rendering HTML layouts into image output through the public HTML-rendering endpoint. Requests sent to Davix H2I are executed by the H2I engine (PixLab), which renders the HTML and returns a generated image URL. HTML rendering into images or PDFs is a defining capability of the platform and supports automated generation workflows based on templates and dynamically generated markup.

This recipe is appropriate when a CMS, blog platform, or publishing workflow needs to generate consistent preview-style images automatically from article content without maintaining separate rendering infrastructure. Davix H2I provides that rendering layer through an API-based backend service.

When to use this recipe #

This workflow fits systems that need to generate visual preview images automatically from application content. The broader Davix H2I docs support automated visual assets, template-based content generation, and HTML-driven rendering workflows as core platform use cases.

Example architecture #

Typical blog-thumbnail generation flow:

Blog CMS / Publishing System
        │
        │ generate thumbnail HTML template
        │
        ▼
Davix H2I API
https://pixlab.davix.dev/v1/h2i
        │
        │ HTML rendered by
        │ H2I engine (PixLab)
        │
        ▼
Generated thumbnail image URL
        │
        ▼
Used by the application workflow

This reflects the documented model in which the client sends a request to the public API, the backend engine performs the render, and the result is returned as a generated output URL.

Step 1 — Create a thumbnail HTML template #

Davix H2I accepts HTML layouts, templates, and dynamically generated markup as input to the H2I rendering workflow. A template can therefore be built as a reusable blog-thumbnail layout and populated with dynamic article content before sending it to the API.

Example thumbnail template:

<div style="
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
background:#0f172a;
color:white;
font-family:Arial, sans-serif;
padding:60px;
text-align:center;
box-sizing:border-box;
">
  <h1 style="font-size:60px;margin-bottom:20px;">
    How to Automate Image Generation
  </h1>
  <p style="font-size:28px;color:#94a3b8;">
    Blog Preview Image
  </p>
</div>

Applications can replace the example values with real article content such as title or category before sending the request.

Step 2 — Send the rendering request #

Endpoint:

POST https://pixlab.davix.dev/v1/h2i

The /v1/h2i endpoint is the public HTML-rendering route. It accepts JSON or URL-encoded request bodies, supports both image and pdf actions, and requires API-key authentication. This recipe uses the image action.

Authentication is accepted through:

  • X-Api-Key: <key>
  • Authorization: Bearer <key>

In production, body-based api_key and query-based ?key= authentication are rejected.

Full example request #

curl -sS -X POST "https://pixlab.davix.dev/v1/h2i" \
  -H "X-Api-Key: <YOUR_API_KEY>" \
  -H "Idempotency-Key: blog-thumb-001" \
  -H "Content-Type: application/json" \
  -d '{
    "action": "image",
    "html": "<div style=\"width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0f172a;color:white;font-size:48px\">Blog Title</div>",
    "css": "body{margin:0}",
    "width": 1200,
    "height": 630,
    "format": "jpeg"
  }'

This is the documented public parameter set for the /v1/h2i image action:

  • action
  • html
  • css
  • width
  • height
  • format

Request parameters #

ParameterRequiredDescription
actionyesMust be image for image generation
htmlyesHTML layout to render
cssnoAdditional CSS styling injected into the rendered document
widthnoRendering viewport width
heightnoRendering viewport height
formatnoOutput image format

Documented image behavior for /v1/h2i:

  • width defaults to 1000
  • height defaults to 1500
  • format defaults to png
  • format=jpeg yields JPEG output; other values become PNG

Example success response #

A successful /v1/h2i image request returns a generated output URL:

{
  "url": "https://pixlab.davix.dev/h2i/<generated-image>?exp=<SIGNED_EXPIRY>&sig=<SIGNED_SIGNATURE>",
  "request_id": "<REQUEST_ID>"
}

The documented success shape for /v1/h2i is { url, request_id? }. url is the required field, and request_id may also be included.

Output behavior #

H2I-generated outputs are served through the /h2i/* output path. Signed output URLs are built through the platform’s signed URL system, and guarded output fetches require valid signature parameters when signed URL enforcement is enabled. Clients should use the returned url directly rather than constructing file paths manually.

Using the generated thumbnail #

After the API returns the generated image URL, the calling application can store that URL and use it in its own publishing workflow. Davix H2I handles the rendering and output generation; downstream storage and display are handled by the application. This aligns with the documented role of Davix H2I as a backend processing service rather than a full hosting or storage platform.

Automation workflow #

A common automation pattern is:

New blog post published
        │
        ▼
Generate thumbnail HTML template
        │
        ▼
Call Davix H2I API
        │
        ▼
Receive generated image URL
        │
        ▼
Store URL in article metadata

This aligns with the broader Davix H2I model of API-based automation workflows and template-driven content generation.

Rendering limits #

The /v1/h2i route applies documented rendering controls, including:

  • HTML length cap
  • render width cap
  • render height cap
  • render pixel-area cap

The canonical limits documentation states:

  • HTML over the cap returns html_too_large
  • width and height are clamped to configured ceilings
  • render pixel-area overflow is rejected

The loaded docs are not fully aligned on the exact render-size error name:

  • the external API reference and error architecture use render_size_exceeded
  • the limits-side material uses render_too_large for H2I pixel-area overflow

Because you want numeric limits centralized under Errors and Limits, this page should link there instead of repeating limit values here.

Summary #

This recipe demonstrates how to automatically generate blog-thumbnail images using Davix H2I’s HTML-to-image workflow.

The documented flow is:

  • create an HTML layout template
  • send it to POST /v1/h2i
  • render the image through the H2I engine (PixLab)
  • receive a generated output URL in response
Was it helpful ?
Table of contents
Login
Login
Login
Login
Scroll to Top