MagicMirror² v2.13.0 is available! For more information about this release, check out this topic.

custom CSS clock module

  • Hey guys…

    Would like to do some custom CSS for the clock module, but just for the time.

    Currently HH and MM are the same size and SS is smaller! I would like to have the MM bigger than the HH!

  • Project Sponsor Module Developer

    @PointPubMedia the hour and the minute are in the same div which makes it not possible to do it just in css, but
    there is a config option which adds a wrapper around the minutes, which is perfect for this task.

    the selector would be probably something like this:

    .clock div.time.bright.large.light span.bold {
      //set the font size here

    therefore you also have to add clockBold: true to the config

    if you dont like the bold effect you can overwrite it as well where you change the font size

Log in to reply