Text-size not working correctly in HTML component

I'm trying to build a custom HTML component that uses the font-size CSS property.

However, it seems like Retool doesn't properly render font-size as a CSS property in the custom HTML component.

When I open the html/css file locally, the font renders exactly as it's supposed to but when I render it in the HTML custom component it does not, see below:

Opening the HTML file locally

The HTML component with the same code in Retool

Is this a bug, or is there something I need to do special in Retool?


Hi @cary.snyder_umbra! Are you using a heading tag for your title, perhaps? Retool has some default font sizes applied to headings inside the HTML component that may be taking precedence (you can inspect the styles in your browser's dev tools to confirm). To work around this, having a more specific CSS selector or adding !important after your font-size style definition may fix it

Thanks, good to know that Retool has default fond sizes to various HTML components.

I fixed this by removing the <p> tag around the text and reordering the CSS.