diff --git a/README.md b/README.md index 782d2525..727665bb 100644 --- a/README.md +++ b/README.md @@ -279,6 +279,14 @@ html2Image.toSVG(element1, { fontEmbedCss }); html2Image.toSVG(element2, { fontEmbedCss }); ``` +### extraStyleContent + +When supplied, the library will add the given css definitions to the style tag from resulting svg. +For example the following code will change the color from scrollbars to green: +```javascript +htmlToImage.toPng(node, { extraStyleContent: '*::-webkit-scrollbar {background-color: green;}'}); +``` + ### skipAutoScale When supplied, the library will skip the process of scaling extra large doms into the canvas object. diff --git a/src/embed-webfonts.ts b/src/embed-webfonts.ts index 42c73da6..17c3c29c 100644 --- a/src/embed-webfonts.ts +++ b/src/embed-webfonts.ts @@ -228,9 +228,14 @@ export async function embedWebFonts( ? null : await getWebFontCSS(clonedNode, options) - if (cssText) { + const finalCssText = + options.extraStyleContent != null + ? options.extraStyleContent.concat(cssText || '') + : cssText + + if (finalCssText) { const styleNode = document.createElement('style') - const sytleContent = document.createTextNode(cssText) + const sytleContent = document.createTextNode(finalCssText) styleNode.appendChild(sytleContent) diff --git a/src/types.ts b/src/types.ts index b511363f..7070b67b 100644 --- a/src/types.ts +++ b/src/types.ts @@ -76,6 +76,11 @@ export interface Options { * create embed CSS for use across multiple calls to library functions. */ fontEmbedCSS?: string + /** + * A CSS string to specify additional custom style content. It will be + * added to the style-tag. + */ + extraStyleContent?: string /** * A boolean to turn off auto scaling for truly massive images.. */