Aug 20, 2026

OpenWhisk (Adobe IO Runtime) output can present whatever content type is desired. In the case of SVG that content type would be "image/svg+xml" with the body of the response being the text string representing the SVG. You can use string literals to dynamically build the SVG.

function main( params ) {
  const svg = `
    <svg
      width="640"
      height="480"
      viewBox="0 0 640 480"
      xmlns="http://www.w3.org/2000/svg">
      <style>
        rect {
          fill: ${params.backgroundColor ?? 'red'};
          stroke: none;
        }
      </style>
      <rect 
        x="${calculateX()}" 
        y="${calculateY()}" 
        width="640" 
        height="480" />
    </svg>
  `;

  return {
    statusCode: 200,
    headers: {
      'Content-Type': 'image/svg+xml'
    },
    body: svg
  };
}
Back to Notes