Simple Clock Card?

I’m pretty new at Lovelace and getting things looking just right. I’ve been able to create a sensor card using sensor.time. It shows up but I’m trying to style it correctly: remove the header + icon and increase the time stamp font size significantly (it’s supposed to be the top card so you can see it from across the room on a dashboard). Additionally, looking to format the time from 24hour to 12 hour. Any suggestions or points would be much appreciated!

Have you seen this:

I gave it a shot. Odd that the time isn’t correct. Checking my states, my datetimeiso is correct but the card is showing 4 hours earlier. I’m using en-US locale.

I never tried to use it but I just installed it and it’s working correctly for me. Also using ‘en_US’.

Odd. I even removed everything and installed it fresh. Still 4 hours difference for some odd reason. Locale. I’m using “en-US”. When I use “en_US” I get a blank screen on refresh.

Obviously I’m pretty stupid, but doesn’t the US have more than 1 timezone ???

True. But looking at the js it should be ok. The sensor has my time correct. It’s the js and card that are showing it incorrectly for some odd reason.

My hassio config has my timezone set as “America/Toronto”.

const locale = config.locale;
const _locale = locale ? locale : undefined;


var _time = _date_time.toLocaleTimeString(_locale, {
hour: ‘numeric’,
minute: ‘numeric’

Figured it out (I think).

added a timezone option:

var _time = _date_time.toLocaleTimeString(_locale, {
hour: ‘numeric’,
minute: ‘numeric’,
timeZone: ‘UTC’

I’m getting my correct time now. Odd one.

Have you posted about this on the thread I linked to above for the card? If not then it might help the developer to know to look into it.

I have. Thanks.

Even further odd, viewing on my mac the UTC trick works. Viewing on my pi the UTC trick didn’t. Both, though, have the same time showing on the OS. Wild.