Skip to content
HTML/CSS to ImageDocs

Manage configurations that generate automatic Open Graph images for your site’s pages.

Manage this resource alongside your application with Terraform or Pulumi. See infrastructure as code for application setups, credentials, and lifecycle behavior.

Reads share 100 requests/minute, and writes share 20 requests/minute, per organization across REST and MCP. See authentication, rate limits, and the interactive API reference.

Create a new OG configuration

POST/v1/og-configs

Permission required: og_configs:create_update

MCP tool: create_og_config

List OG configurations

GET/v1/og-configs

Permission required: og_configs:read

MCP tool: list_og_configs

Retrieve an OG configuration

GET/v1/og-configs/{id}

Permission required: og_configs:read

MCP tool: get_og_config

Update an OG configuration

POST/v1/og-configs/{id}

Permission required: og_configs:create_update

MCP tool: update_og_config

Delete an OG configuration

DELETE/v1/og-configs/{id}

Permission required: og_configs:delete

MCP tool: delete_og_config

Set config_type to html_css to render page HTML/CSS using default image options and, optionally, options extracted from page metadata.

Terminal window
curl 'https://hcti.io/v1/og-configs' \
--user "$HCTI_API_ID:$HCTI_API_KEY" \
--header 'Content-Type: application/json' \
--data '{
"config_type": "html_css",
"name": "Website screenshots",
"base_url": "https://example.com",
"disabled": false,
"optimization_mode": "post_process",
"extract_values": false,
"default_options": {
"viewport_width": 1200,
"viewport_height": 630,
"device_scale": 1
}
}'
Field Description
config_type Required: html_css or templated. Determines the request’s remaining fields.
name Required, up to 255 characters.
base_url Required HTTPS origin, such as https://example.com. No path, query, fragment, or credentials.
description Optional, up to 1,023 characters.
disabled Defaults to false; response uses enabled.
refresh_interval_s Seconds before cached images become eligible for refresh. Minimum depends on the plan; maximum one year. Defaults to 86,400 seconds (24 hours). See refresh behavior and plan options.
optimization_mode no_optimization retains dimensions; post_process (default) adapts one render to social sizes; set_viewport renders for crawler-specific viewport sizes and consumes multiple renders.

Set image rendering defaults in default_options using the supported parameters below.

extract_values defaults to false. When true, extracted page metadata overrides configured default image options. See OG parameter support.

NameTypeDescription
cssStringCSS used to style the rendered image or modify a captured page.
additional_header_originsArrayAllow custom headers on requests to specific additional HTTP or HTTPS origins.
block_consent_bannersBooleanWhen set to true, automatically blocks cookie consent banners and popups on websites. Most useful for URL screenshots.
color_schemeStringSet Chrome to render in light or dark mode. Affects websites using prefers-color-scheme.
device_scaleDoubleControl resolution by adjusting the pixel ratio from 0.1 to 3. Higher values increase image quality and file size.
disable_twemojiBooleanHTML/CSS and template images use Twemoji by default; set true to disable it. URL images inject Twemoji only when explicitly set to false.
headersObjectAdd custom HTTP headers when screenshotting a URL. Headers are restricted to the requested URL's origin and any additional_header_origins.
identify_as_hctiBooleanAdd X-HCTI-SCREENSHOT: 1 to the top-level request when screenshotting a URL.
include_headers_on_subrequestsBooleanAlso add custom headers to same-origin subrequests and subrequests matching additional_header_origins.
max_wait_msIntegerSet a maximum time limit from 500 to 10000 milliseconds for waiting before taking the screenshot.
media_typeStringSet Chrome to render using screen or print CSS media styles.
ms_delayIntegerDelay before generating the image. Useful when waiting for JavaScript; start with 500 milliseconds.
proxy_idStringRoute outbound traffic through one of your organization's configured HTTP proxies. Available on the 10,000 images/month plan or higher.
render_when_readyBooleanWait to generate the image until JavaScript calls ScreenshotReady().
request_overridesArrayBlock browser network requests matching a URL wildcard pattern and/or resource types. Requires a paid plan.
selectorStringCrop the image to an element matching this CSS selector, such as section#complete-toolkit.container-lg.
storage_destination_idStringSave rendered files to one of your organization's configured storage destinations. Available on the 10,000 images/month plan or higher.
timezoneStringSet Chrome's timezone with an IANA identifier such as America/New_York.
transparent_backgroundBooleanSet to true to render with a transparent background.
viewport_heightIntegerSet the height of Chrome's viewport. Both dimensions must be set when using either.
viewport_landscapeBooleanSet Chrome's viewport to landscape mode.
viewport_mobileBooleanSet Chrome's viewport to emulate a mobile device.
viewport_touchBooleanSet Chrome's viewport to support touch events.
viewport_widthIntegerSet the width of Chrome's viewport. Both dimensions must be set when using either.

For config_type: "templated", supply template_id. The referenced template must belong to your organization. To submit this example, save it as og-config.json, replace the template ID, and send it using --data @og-config.json with the same endpoint and authentication above.

This example includes optional headers for fetching the source page. Omit headers and additional_header_origins if you don’t need them.

{
"config_type": "templated",
"name": "Blog social cards",
"base_url": "https://example.com",
"template_id": "your-template-id",
"headers": {
"X-Site-Token": "your-site-token"
},
"additional_header_origins": ["https://www.example.com"],
"template_values_mapping": [
{ "template_key": "headline", "fallback": "titles" },
{ "template_key": "summary", "fallback": "descriptions" }
]
}

Use the Template Editor to design the card and define the template keys, or create a template through the API. Use those keys in template_values_mapping. template_version is optional; omitted/null uses the latest version. Each of up to 32 mappings supplies a template_key and exactly one of:

  • meta_key: a page metadata key to extract.
  • fallback: titles or descriptions, using HCTI’s title or description fallbacks.

The optional fetching settings shown above apply when extracting template values from the source page:

  • headers supplies custom HTTP headers for the source origin.
  • additional_header_origins allows those headers to be sent to other specified origins, such as https://www.example.com after a redirect.

Read the response and use the configuration

Section titled “Read the response and use the configuration”

Create, get, and update return 200 OK with the configuration fields, timestamps, and:

Field Use
id Management API/MCP identifier for reading, updating, or deleting the configuration.
domain_id Identifier used in the public OG image URL.
enabled Whether the configuration can serve OG images.

Use domain_id to add the OG image URL to your pages. Creating a configuration does not itself render every page. The public OG image URL needs no API key or HMAC signature.

  • List configurations: GET /v1/og-configs returns configurations newest first, including disabled configurations.
  • Paginate: Use count (1–100, default 10) and pass pagination.next_page_start as the next request’s page_start. Stop when the cursor is null. See pagination.
  • Retrieve one configuration: Use GET /v1/og-configs/{id}.

POST /v1/og-configs/{id} replaces the configuration. Send config_type, required fields, and every optional setting you want to keep; omitted settings clear or reset. To disable it temporarily, send the complete configuration with disabled: true.

DELETE /v1/og-configs/{id} returns 204 No Content on success. Removing or disabling a configuration affects its ability to serve OG images; remove or replace the corresponding metadata on your site as appropriate.

Invalid settings return 400; inaccessible references can return 404; conflicting configurations can return 409. Plan and permission errors return 403. Check the response message before retrying.

Create accepts the same request under content; update takes id and content. Get/delete take id, and list accepts count and page_start. See MCP tools.

For example: “Use HCTI to list my OG configurations, inspect the blog configuration, and explain its refresh interval and template mappings.” This needs og_configs:read. Creating or changing a configuration also needs og_configs:create_update approved through OAuth.

Need help?

Talk to a human. Email support@htmlcsstoimage.com and we’ll help you get started.