Help matching font scaling on touchscreen with Chrome dev tools

I am running an ASUS ZenTouch connected to an oDroid with Fully Kiosk. I have noticed that there is a lot of change in font size on certain tiles. Is there a way to achieve a better WYSIWYG experience on the desktop to make it easier to see what it will look like on the touchscreen?

The first shot is on the touchscreen, the second is in Chrome running the developer tools and specifying the resolution of the ZenTouch.


Hi @simon - can you tell me more about your configuration? The type of scaling being used for your dashboard and the Theme settings you have applied (including custom CSS) could impact how fonts scale.

Also keep in mind that when emulating another screen in Chrome, you may need to take the pixel density / pixel ratio into consideration.

Got it. Had to play around with some of the other settings and got it much closer. Thanks.

1 Like

Can you share what you did? I could use some tweaks on that front too. I’m trying to figure out how to get the font size of a custom tile to scale with the scalable dashboard. That is, as the dashboard overall scales, the text size should scale too.

This is a bit of a different concern than the original post which is using normal SharpTools tiles. The content in Custom Tiles can scale based on their container (eg. the tile) using relative font sizes, but it’s up to the developer to implement.

Edit: I saw your question over in the Hubitat HTML Attribute Display thread, so I replied there. :slight_smile: