Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

SVG images on custom character sheet

I'm looking to use SVG images instead of PNGs on my custom character sheet. Except, they don't seem to work. If I upload a PNG file to my github and use CSS in roll20 to place it as a background image, everything is good to go, but if i use the same code to place an SVG, it doesn't show. 

Is SVG not supported on custom character sheets? Or am I missing something? 

HTML:
<div>
<div>
<input type="radio" value="0" name="attr_npc_narr_xp" class="sheet-tri sheet-zero" checked/>
<span></span>
<input type="radio" value="1" name="attr_npc_narr_xp" class="sheet-tri sheet-xptri"/>
<span></span>
<input type="radio" value="2" name="attr_npc_narr_xp" class="sheet-tri sheet-xptri"/>
<span></span>
<input type="radio" value="3" name="attr_npc_narr_xp" class="sheet-tri sheet-xptri"/>
<span></span>
</div>
</div>


CSS:
WORKS:
/* white XP tri */
input.sheet-xptri[type=checkbox] + span,
input.sheet-xptri:checked ~ input.sheet-xptri[type=radio] + span,
input.sheet-xptri:checked ~ input.sheet-xptri[type=radio] + span {
background-image: url(https://raw.githubusercontent.com/haushalter/VigorRPG/master/xp-tri-small-0.png);
}

DOESN'T WORK:
/* white XP tri */
input.sheet-xptri[type=checkbox] + span,
input.sheet-xptri:checked ~ input.sheet-xptri[type=radio] + span,
input.sheet-xptri:checked ~ input.sheet-xptri[type=radio] + span {
background-image: url(https://raw.githubusercontent.com/haushalter/VigorRPG/master/xp-tri-small-0.svg);
}
May 03 (7 years ago)
Jakob
Sheet Author
API Scripter
It doesn't work because the svg link gives a 404....
May 03 (7 years ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Svgs don't work at all on roll20 (chat, tokens, or character sheets).
May 03 (7 years ago)
Jakob
Sheet Author
API Scripter

Scott C. said:

Svgs don't work at all on roll20 (chat, tokens, or character sheets).

I've just used an SVG on a sheet in development, and it seems to work just fine.

Jakob said:

It doesn't work because the svg link gives a 404....

I've since removed it from my github because it wasn't working, but when it was there it still didn't work. You've not had trouble using SVGs as images on a custom character sheet? 
May 03 (7 years ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator

Jakob said:

Scott C. said:

Svgs don't work at all on roll20 (chat, tokens, or character sheets).

I've just used an SVG on a sheet in development, and it seems to work just fine.

Huh, I've tried inline, and referencing a file. Neither generated anything for me.
May 04 (7 years ago)
Pat S.
Forum Champion
Sheet Author
Jpg and Png are the supported format.
May 04 (7 years ago)
Jakob
Sheet Author
API Scripter
I have used "https://svgshare.com/i/6Vz.svg" successfully in a custom sheet. (Via background-image: url("https://svgshare.com/i/6Vz.svg");).
May 04 (7 years ago)

Edited May 04 (7 years ago)
Andreas J.
Forum Champion
Sheet Author
Translator

Haushalter said:

I'm looking to use SVG images instead of PNGs on my custom character sheet. 

Pat S.(Roll20 Mod team) said:

Jpg and Png are the supported format.

Jakob said:

I have used "https://svgshare.com/i/6Vz.svg" successfully in a custom sheet. (Via background-image: url("https://svgshare.com/i/6Vz.svg");).

Jacob is clearly a high-level wizard and scriptomancer bending the reality placed down by the Roll20 framework. I wonder why it works for him and not for you, as you use the same "background-image:" part, maybe try to host the picture at the same site?  As Mod Pat said, it isn't officially supported, but didn't explicitly forbid either, so I guess you can continue this occult endeavour under Jacob's guidance. :D Best of luck.
May 04 (7 years ago)
Pat S.
Forum Champion
Sheet Author
As Andreas points out, it is not officially supported. Gifs sometimes will upload (only first frame will show) but not play but they are not officially supported. SVGs might also fall into that aspect also but just remember that only JPG and PNG are the format that is officially supported.
That is what I suspected, but was just having trouble tracking down the definitive answer. Thanks so much, everyone for the assistance!