KDE Plasma - Changing the Digital Clock Colour

I wanted to customize the digital clock widget. The digital clock settings offers various appearance options, but changing the colour is not one of them. However this is easy enough to do with a manual edit of the DigitalClock.qml file adding the ‘color:’ QML type to the relevant fields.

The first step is to create a copy of the system-wide plasmoid config to the user location

cp -r /usr/share/plasma/plasmoids/org.kde.plasma.digitalclock/ ~/.local/share/plasma/plasmoids

Navigate to ~/.local/share/plasma/plasmoids/org.kide.plsma.digitalclock/contents/ui/DigitalClock.qml, using a text editor to locate the ‘timeLabel’, ‘timezoneLabel’, and ‘dateLabel’ components, and add the color: attribute like this…

            Components.Label  {
                id: timeLabel

                color: "#00FF7A"
                font {
                    family: fontHelper.font.family
                    weight: fontHelper.font.weight
                    italic: fontHelper.font.italic
                    pixelSize: 1024
                    pointSize: -1 // Because we're setting the pixel size instead
                                  // TODO: remove once this label is ported to PC3
                }
                minimumPixelSize: 1

                text: Qt.formatTime(main.getCurrentTime(), Plasmoid.configuration.showSeconds === 2 ? main.timeFormatWithSeconds : main.timeFormat)

                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
            }

Once that is done, save the file and it will take effect the next time the desktop is started.

5 Likes

Is the only edit to the DigitalClock.qml file

color: “#00FF7A

I added that line and my clock is still black.

Hi

Worked for me.

Thank you :grinning:

1 Like

Did you restart the dekstop, or log out and back in? Also, add it to the three locations as described.

Ah! Missed the three locations part. Thanks!

1 Like

Got it working now but the “#00FF7A” green was a little to lite for me, so I used the link Deano provided for QML color values to change the color to “#ff4500” orangered and it was much more legible.

Yes, you can customize the colour as you like. :wink:

Awesome tip! I’m using the Panel Transparency widget on the taskbar and definitely needed this. Thanks!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.