Skip to main content
Glama

HTML/CSS to Image API

by io.github.htmlcsstoimage
OverviewDiscussionsAdmin

Create an Image of a URL

create_url_image
Destructive

Creates a screenshot of an existing web page at content.url. Rendering loads the page and its resources in a browser and executes its JavaScript. Set content.full_screen for the entire scrollable page, or content.selector to capture a particular element. Returns asset ID, URL, and format information in item; include_image_data requests an eager inline preview. Use create_image when supplying HTML/CSS directly, or create_templated_image when rendering a saved template.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
contentYesPublic HTTP or HTTPS page URL in url, plus optional CSS overrides, viewport, cropping, and loading controls. Set ms_delay when client-side content needs extra time; use render_when_ready only when the page provides the HCTIReadyNow readiness element.
include_image_dataNoEagerly render and include up to 4 MiB of image data for an inline preview. This takes longer and reports progress when the client supports progress notifications. Successful stored renders also return a URL that can be opened or embedded outside the MCP context. Use only when the user requests or needs an inline preview.

Output Schema

TableJSON Schema
NameRequiredDescriptionDefault
itemNoOperation result. Check success before using this value.
errorNoError details when the operation failed; null on success.
successNoWhether the operation succeeded. If false, inspect error before retrying.

Schema Changelog

Changes observed during successful MCP inspections.

  1. Changed1 schema field changed
    • changedInput schema / properties / content / properties / disable_twemoji / description
      Previous value: -"Use native Linux emoji rendering instead of HCTI's consistent Twemoji images. Leave `disable_twemoji` unset unless native emoji rendering is specifically needed."New value: +"Set `disable_twemoji: false` explicitly to inject Twemoji into the loaded page. Omitted, `null`, or `true` leaves the page's emoji handling unchanged and does not disable the website's own emoji scripts."
  2. Changed5 schema fields changed
    • changedInput schema / properties / content / description
      Previous value: -"Parameters for creating the image"New value: +"Public HTTP or HTTPS page URL in url, plus optional CSS overrides, viewport, cropping, and loading controls. Set ms_delay when client-side content needs extra time; use render_when_ready only when the page provides the HCTIReadyNow readiness element."
    • changedInput schema / properties / content / properties / url / description
      Previous value: -"The exact public HTTP or HTTPS URL to capture. Use `html` instead when the content can be supplied directly."New value: +"The exact public HTTP or HTTPS URL to capture. Call `create_image` when supplying HTML and CSS directly."
    • addedOutput schema / properties / error / description
      Added value: +"Error details when the operation failed; null on success."
    • addedOutput schema / properties / item / description
      Added value: +"Operation result. Check success before using this value."
    • addedOutput schema / properties / success / description
      Added value: +"Whether the operation succeeded. If false, inspect error before retrying."
  3. First observed

TDQS

A4.5/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Beyond the annotations, the description discloses that rendering loads the page and resources in a browser and executes JavaScript, which is important behavioral context. It also says the call returns asset ID, URL, and format info, and that include_image_data requests an eager inline preview. It does not explain the destructiveHint annotation, but the description still covers the main behavioral surface.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is compact and front-loaded: the core purpose comes first, followed by the most decision-relevant details and sibling alternatives. Every sentence contributes useful information without repetition or filler.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness5/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

The definition is complete for a correct call: the input schema is fully documented, an output schema exists, and the description adds rendering behavior, return-payload expectations, and sibling routing. An agent has enough context to select and invoke the tool correctly.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the schema already fully documents every parameter. The description adds modest value by highlighting content.url, content.full_screen, content.selector, and include_image_data, but it does not need to compensate for any schema gaps.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description opens with a specific action and resource: 'Creates a screenshot of an existing web page at content.url.' It also differentiates the tool from siblings by naming create_image and create_templated_image, making the tool's exact role unambiguous.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines5/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description explicitly says when to use create_image for HTML/CSS input and create_templated_image for saved templates, which is direct alternative routing. It also gives actionable selection guidance for full_screen, selector, and include_image_data.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

All HTML/CSS to Image API toolsInspect
Try in Browser
One endpoint for every MCP toolRayrun runs every MCP server behind one URL and holds the credentials. Each call is decided per client, tool, and argument, then recorded.ray.runAd

Glama MCP Gateway

Add one secure layer between your agents and this server.

Resources