SVG Dynamic Themes

Symbol list

Signal elements

Besides the track color the colors for the red, green, yellow and white state are coded.
To support different addressing modes of this signal the states should have a list of the state name as well as the state number:
- state="red,0"
- state="green,1"
- state="yellow,2"
- state="white,3"

symbol SVG code
red
green
yellow
white 
<svg name="signalmain" ledsupport="true" width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <!-- track -->
    <path stroke="rgb(000,000,000)" fill="rgb(000,000,000)" d="M 0,12 L 31,12 L 31,19 L 0,19 z "/>
    <path led="101" stroke="rgb(255,255,255)" fill="rgb(255,255,255)" d="M 8,14 L 23,14 L 23,17 L 8,17 z "/>
    <!-- signal -->
    <path stroke="rgb(000,000,000)" fill="rgb(000,000,000)" d="M 1,5 L 4,2 L 22,2 L 25,5 L 28,5 L 28,2 L 30,2 L 30,9 L 28,9 L 28,6 L 25,6 L 22,9 L 4,9 L 1,6 z "/>
    <!-- green -->
    <path led="103" state="green,1" stroke="rgb(000,090,000)" fill="rgb(000,090,000)" d="M 5,4 L 7,4 L 8,5 L 8,6 L 7,7 L 5,7 L 4,6 L 4,5 z "/>

    <!-- red -->
    <path led="102" state="red,0" stroke="rgb(255,000,000)" fill="rgb(255,000,000)" d="M 12,4 L 14,4 L 15,5 L 15,6 L 14,7 L 12,7 L 11,6 L 11,5 z "/>

    <!-- yellow -->
    <path led="104" state="yellow,2" stroke="rgb(090,090,000)" fill="rgb(090,090,000)" d="M 19,4 L 21,4 L 22,5 L 22,6 L 21,7 L 19,7 L 18,6 L 18,5 z "/>

    <!-- white -->
    <path led="102" state="white,3" stroke="rgb(000,090,000)" fill="rgb(000,090,000)" d="M 5,4 L 7,4 L 8,5 L 8,6 L 7,7 L 5,7 L 4,6 L 4,5 z "/>
    <path led="105" state="white,3" stroke="rgb(255,000,000)" fill="rgb(255,000,000)" d="M 12,4 L 14,4 L 15,5 L 15,6 L 14,7 L 12,7 L 11,6 L 11,5 z "/>
    <path led="105" state="white,3" stroke="rgb(090,090,000)" fill="rgb(090,090,000)" d="M 19,4 L 21,4 L 22,5 L 22,6 L 21,7 L 19,7 L 18,6 L 18,5 z "/>

    <!-- ID -->
    <rect txt="1" txtalign="center" x="0" y="21" rx="0" width="31" height="10" stroke="none" fill="none"/>
  </g>
</svg>

For coding the LED attribute see LED Attribute Values .

Multi aspect signal elements

A multi aspect signal is coded as a list of g states.
The first state must be coded as <g state="all"> which in general
- describes the track,
- the basic signal symbol with no lights and
- the placeholder for the ID of the Rocrail plan object.

The next g states describe the states of the signal starting with state 0 and ending with the last state - in this state it is state 23.

The file name requires a prefix (here "hl_") to be able to use more than one multi aspect signal.
The file name of multi aspect signals is constructed: prefix + "signalaspect-0" + ".svg" .
The file name of this example is "hl_signalaspect-0.svg".

symbol SVG code
00
01
02
03
…
06
… 
<svg name="hl_signalaspect" ledsupport="true" width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g state="all">
    <!-- Track -->
    <path stroke="rgb(0,0,0)" fill="rgb(0,0,0)" d="M 0,12 L 31,12 L 31,19 L 0,19 z " />
...
    <!-- ID -->
    <rect txt="1" txtalign="center" x="0" y="21" rx="0" width="31" height="10" stroke="none" fill="none"/>
  </g>

  <g state="0">
   <!-- Hp 0 (Hl 13); Halt -->
   <!-- Leuchte 1 -->
    <path led="2" stroke="none" fill="rgb(255,000,000)" d="M 09,04 L 13,04 L 13,08 L 09,08 z " /> <!-- Leuchte 1 -->
  </g>
...
  <g state="6">
   <!-- Hl 5; Fahrt mit 100 km/h -->
   <!-- Leuchte 2blink,4,6 -->
    <path led="3" alt="true" stroke="none" fill="rgb(000,255,000)" d="M 04,02 L 07,02 L 07,05 L 04,05 z " /> <!-- Leuchte 2 blink -->
    <path led="4" stroke="none" fill="rgb(255,255,000)" d="M 15,07 L 18,07 L 18,10 L 15,10 z " /> <!-- Leuchte 4 -->
    <path led="3" stroke="none" fill="rgb(000,255,000)" d="M 24,02 L 25,02 L 25,03 L 24,03 z " /> <!-- Leuchte 6.1 -->
    <path led="3" stroke="none" fill="rgb(000,255,000)" d="M 24,04 L 25,04 L 25,05 L 24,05 z " /> <!-- Leuchte 6.2 -->
    <path led="3" stroke="none" fill="rgb(000,255,000)" d="M 24,06 L 25,06 L 25,07 L 24,07 z " /> <!-- Leuchte 6.3 -->
    <path led="3" stroke="none" fill="rgb(000,255,000)" d="M 24,08 L 25,08 L 25,09 L 24,09 z " /> <!-- Leuchte 6.4 -->
  </g>
...
  <g state="23">
   <!-- 23 for blank -->
    <path stroke="none" fill="rgb(063,063,063)" d="M 09,04 L 13,04 L 13,08 L 09,08 z " /> <!-- Leuchte 1 -->
  </g>
</svg>

For coding the LED attribute see LED Attribute Values .