{"library":"satori-bg","title":"Satori (fork with basic support)","description":"Satori-bg is a community fork of Vercel's Satori library (v1.1.3) that adds basic support for background images on HTML elements. The original Satori is an enlightened library to convert HTML and CSS (via JSX) to SVG, primarily used for generating Open Graph images and social cards. It uses a Flexbox layout engine (Yoga) and supports a limited subset of HTML and CSS. Satori is maintained actively by Vercel and releases are frequent. Differentiators from alternatives like Puppeteer or Playwright: no headless browser needed, works on edge runtimes, produces deterministic SVG output. This fork specifically adds background-image support (not present in original Satori). Node.js >=16 required, ships TypeScript types.","language":"javascript","status":"maintenance","last_verified":"Fri May 01","install":{"commands":["npm install satori-bg"],"cli":null},"imports":["import satori from 'satori-bg'","import satori from 'satori-bg'","import type { SatoriOptions } from 'satori-bg'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import satori from 'satori-bg'\n\nconst robotoUrl = 'https://fonts.cdnfonts.com/s/103369/Roboto-Regular.woff'\nconst fontResponse = await fetch(robotoUrl)\nconst fontData = await fontResponse.arrayBuffer()\n\nconst svg = await satori(\n  {\n    type: 'div',\n    props: {\n      children: 'Hello, world!',\n      style: {\n        color: 'black',\n        fontSize: 48,\n        fontWeight: 700,\n        backgroundColor: '#f0f0f0',\n        padding: 20,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        backgroundImage: 'url(https://example.com/bg.png)'\n      }\n    }\n  },\n  {\n    width: 600,\n    height: 400,\n    fonts: [\n      {\n        name: 'Roboto',\n        data: fontData,\n        weight: 700,\n        style: 'normal'\n      }\n    ]\n  }\n)\n\nconsole.log(svg)","lang":"typescript","description":"Demonstrates using satori-bg with a non-JSX object, fetching a font, and including a background image.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}