Referencing palette colors in svg code

[Steven Schneider]

Below is code for an svg. I would like to reference palette colors or any other field values or tiddler names, so that I can render the graphic in different colors depending on a filter value. Any help would be much appreciated.

Thanks, 

//steve.

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

viewBox="0 0 1366 768" style="enable-background:new 0 0 1366 768;" xml:space="preserve">

<style type="text/css">

.st0{stroke:#04202f;fill:#feb1a4;stroke-width:0.75;stroke-miterlimit:10;}

</style>

<g>

<path class="st0" d="M683.3,359.7H567c-2.8,0-5-2.2-5-5V243.4c0-2.8,2.2-5,5-5h111.3c2.8,0,5,2.2,5,5V359.7z"/>

<path class="st0" d="M798.5,359.7H682.2V243.4c0-2.8,2.2-5,5-5h111.3c2.8,0,5,2.2,5,5v111.3C803.5,357.4,801.3,359.7,798.5,359.7z"

/>

<path class="st0" d="M798.5,479.9H687.2c-2.8,0-5-2.2-5-5V358.6h116.3c2.8,0,5,2.2,5,5v111.3C803.5,477.7,801.3,479.9,798.5,479.9z

"/>

<path class="st0" d="M678.3,479.9H567c-2.8,0-5-2.2-5-5V363.6c0-2.8,2.2-5,5-5h116.3v116.3C683.3,477.7,681.1,479.9,678.3,479.9z"

/>

</g>

</svg>

[Thomas Elmiger]

Hi Steve

My first idea would be to remove the CSS you placed in the <style> tag from the graphic and place it in a separate stylesheet tiddler:

.st0 {
   stroke: #04202f;
   fill: <<colour primary>>;
   stroke-width: 0.75;
   stroke-miterlimit:10;
}

Does this work for you?

All the best,

Thomas