HTML/CSS to Image Blog
RSS feedCode examples and fixes for common problems with screenshots, PDFs, and Open Graph images.
Connect Chrome DevTools MCP to an AI assistant, open a local demo, filter orders and extract data. Learn how the server uses Puppeteer and verify each step.
Compare Playwright and Puppeteer for testing, browser automation, screenshots and PDFs. Choose based on browser support, languages and your existing setup.
Convert PHP-generated HTML to PNG with Chrome PHP, Browsershot or the typed HCTI client. Includes a receipt template, cropping and asset waits.
Render HTML as a PNG with Puppeteer or Playwright in Node.js, capture one element, wait for assets, or use the typed HTML/CSS to Image client.
Generate PNGs from HTML in Python with Playwright or the typed HCTI client. Fill a template from a dict, wait for web fonts and render a whole batch.
Render a shipment card as a PNG in C# using PuppeteerSharp or the typed HTML/CSS to Image client. Capture a page or element and wait for external assets.
Replace an old Open Graph image by checking the live metadata, changing the image URL and refreshing each social platform’s cached preview.
Find out why an Open Graph image is not showing by checking the live metadata, image response, crawler access, format and cached preview.
Capture one card, chart or report section with Puppeteer, PuppeteerSharp, Playwright or the HTML/CSS to Image selector parameter.
Wait for data, fonts, images and charts before taking a screenshot with Puppeteer, Playwright or HTML/CSS to Image.
Build reliable US Letter PDFs from HTML with print CSS for margins, page breaks, repeating table headers, fonts, images, Puppeteer, and Playwright.