How to Display a specific dice font in a roll20 character sheet

This feels like it should be obvious, so maybe I'm missing something. Roll20 has dice fonts, I want to use the d10 font: dicefontd10 I have a roll to generate a number between 1 and 10. How do I display that in chat as the dice font (where a = 1 in that font)?

I realised I made a silly mistake and the problem is solved, but i'll leave this up to see if people post methods.

I would probably do this; Use a roll template to test for a roll of 1 and apply the font to an empty sibling span of the roll using css content. (I'm sure there are other, more elegant methods) <!-- template -- > <div class="sheet-key">Roll:</div> {{#rollTotal() d10roll 1}} <div class="sheet-value"><span class="d10-font">{{d10roll}}</span><span></span></div> {{/rollTotal() d10roll 1}} {{#^rollTotal() d10roll 1}} <div class="sheet-value">{{d10roll}}</div> {{/^rollTotal() d10roll 1}} /*css*/ .sheet-rolltemplate-example .sheet-d10-font { visibility:hidden; } .sheet-rolltemplate-example .sheet-d10-font + span::after { content: 'a'; font-family: dicefontd10; font-size: 2em; margin-left: -1em; position: relative; } test roll <button type="roll" name="roll_d10_test" title="%{d10_test}" value="&{template:example}{{d10roll=[[d10]]}}">d10</button>

I've usually just done conditional logic to wrap the inline roll in a class and then used the before element to display the font. (done this a lot for some recent sheets that have specialty dice) HTML <rolltemplate class="sheet-rolltemplate-number"> {{#rollTotal() roll 1}} <div class="roll result-1"> {{roll}} </div> {{/rollTotal() roll 1}} {{#rollTotal() roll 2}} <div class="roll result-2"> {{roll}} </div> {{/rollTotal() roll 2}} </rolltemplate> CSS .sheet-rolltemplate-number .sheet-roll .inlinerollresult{ display: grid; grid-template-areas: 'content'; color: transparent; position: relative; place-items: center; } .sheet-rolltemplate-number .sheet-roll .inlinerollresult:before{ grid-area: content; position: absolute; font-family: 'dicefontd10'; } .sheet-rolltemplate-number .sheet-result-1 .inlinerollresult:before{ content: 'A'; } .sheet-rolltemplate-number .sheet-result-2 .inlinerollresult:before{ content: 'B'; } This maintains the ability to hover over the roll and get the tooltip showing the quantum roll information. It also keeps the information for screen readers to parse.