diff --git a/source/app/metrics/index.mjs b/source/app/metrics/index.mjs
index 736ab872..e7062d89 100644
--- a/source/app/metrics/index.mjs
+++ b/source/app/metrics/index.mjs
@@ -24,7 +24,8 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
     //Initialization
     const pending = []
     const {queries} = conf
-    const data = {q, animated:true, large:false, base:{}, config:{}, errors:[], plugins:{}, computed:{}}
+    const extras = {css:(conf.settings.extras?.css ?? conf.settings.extras?.default ? q["extras.css"] ?? "" : "")}
+    const data = {q, animated:true, large:false, base:{}, config:{}, errors:[], plugins:{}, computed:{}, extras}
     const imports = {
       plugins:Plugins,
       templates:Templates,
@@ -153,7 +154,7 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
       if (convert === "markdown-pdf") {
         return imports.svg.pdf(rendered, {
           paddings:q["config.padding"] || conf.settings.padding,
-          style:(conf.settings.extras?.css ?? conf.settings.extras?.default ? q["extras.css"] ?? "" : ""),
+          style:extras.css,
           twemojis:q["config.twemoji"],
           gemojis:q["config.gemoji"],
           rest,
@@ -164,7 +165,7 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
 
     //Rendering
     console.debug(`metrics/compute/${login} > render`)
-    let rendered = await ejs.render(image, {...data, s:imports.s, f:imports.format, style:style + (conf.settings.extras?.css ?? conf.settings.extras?.default ? q["extras.css"] ?? "" : ""), fonts}, {views, async:true})
+    let rendered = await ejs.render(image, {...data, s:imports.s, f:imports.format, style, fonts}, {views, async:true})
 
     //Additional transformations
     if (q["config.twemoji"])
diff --git a/source/app/web/statics/app.placeholder.js b/source/app/web/statics/app.placeholder.js
index 0995ff6a..ee47d62b 100644
--- a/source/app/web/statics/app.placeholder.js
+++ b/source/app/web/statics/app.placeholder.js
@@ -59,6 +59,8 @@
       columns: set.config.display === "columns",
       //Config
       config: set.config,
+      //Extras
+      extras:{css:options["extras.css"] ?? ""},
       //Base elements
       base: set.plugins.enabled.base,
       //Computed elements
diff --git a/source/templates/classic/image.svg b/source/templates/classic/image.svg
index 7ef05398..5982dab2 100644
--- a/source/templates/classic/image.svg
+++ b/source/templates/classic/image.svg
@@ -2,6 +2,7 @@
 
   <defs><style><%= fonts %></style></defs>
   <style data-optimizable="true"><%= style %></style>
+  <style><%= extras.css %></style>
 
   <foreignObject x="0" y="0" width="100%" height="100%">
     <div xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink" class="items-wrapper">
diff --git a/source/templates/repository/image.svg b/source/templates/repository/image.svg
index 07eb95ba..a8ac7fa3 100644
--- a/source/templates/repository/image.svg
+++ b/source/templates/repository/image.svg
@@ -2,9 +2,8 @@
 
   <defs><style><%= fonts %></style></defs>
 
-  <style data-optimizable="true">
-    <%= style %>
-  </style>
+  <style data-optimizable="true"><%= style %></style>
+  <style><%= extras.css %></style>
 
   <foreignObject x="0" y="0" width="100%" height="100%">
     <div xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink">
diff --git a/source/templates/terminal/image.svg b/source/templates/terminal/image.svg
index 1002d4f9..ac064701 100644
--- a/source/templates/terminal/image.svg
+++ b/source/templates/terminal/image.svg
@@ -28,6 +28,7 @@
         <% } %>
       <% } %>
   </style>
+  <style><%= extras.css %></style>
 
   <foreignObject x="0" y="0" width="100%" height="100%">
     <div xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink">