Designing my own Linux login manager

Early on in my Linux journey, I was really into customizing my setup and theming everything. This is commonly referred to as ricing and there are whole dedicated communities around it.

Having chosen SDDM as my display manager of choice, I started looking for login themes… and didn’t find anything that appealed to me. Thus sddm-theme-corners was born. Take a look at some example setups:

I’ve made it publicly available on my GitHub. Since then, it’s gotten quite a few stars and forks, and I’m glad that people are actively contributing back.

Designing a login theme

The themes I saw on the KDE Store used design elements that I didn’t really like. In particular, I wanted something that

• focused mainly on the background wallpaper.
• felt clean and organized.
• used clear icons and typography.
• could be customized as much as possible.

This led me to main decision of placing all the elements on the corners of your screen. Interactive UI is anchored to the sides to get out of the way of your background.

Common controls like power and session management are grouped together. Some themes place the session controls below the user field, which made no sense to me because it’s not that frequently used. The date and time should easily be legible and are therefore displayed very largely by default.

Some themes included icons for popular DEs like GNOME, KDE, Deepin, etc. I felt that it would be impossible to cover all cases, and chose a text-based list instead. Icons for sessions don’t offer enough detail anyway; what if I wanted GNOME on both Xorg and Wayland?

The user picture (if you choose to enable it) also acts as a user switcher. All it really does is prefill in the user field. The last user logged in is saved, however, and filled in for you next time.

The login button is grayed out until both input fields are filled out.

Tying everything together are subtle animations that occur when popups come in and out of view. I especially like what happens when you enter an incorrect login:

Don’t like the default colors or how round everything is? I’ve exposed multiple config options that allow you to theme pretty much everything. You can also change the font and datetime format; however, the layout itself cannot be modified. After all, stuff in sddm-theme-corners should stay in the corners!

Learning Qt Quick and QML

Building the login theme was the most difficult part of the process. I had no prior experience with QML; this was my first time learning about the existence of Qt!

To get started, I looked through the default themes that SDDM provides, as well as user-made themes. By looking through their code, I learned that Main.qml is the main entry file for SDDM. I discovered the existence of theme.conf and how to support customization options in my own code. I saw real, working examples of QML syntax, including utilizing a QML object’s id attribute and adding custom properties.

I definitely committed some coding sins while trying to figure out how to hook everything together. I’m particularly proud of this abomination:

Component.onCompleted: {
  if (userPicture.enabled) {
    userPicture.source = userWrapper.items.get(userList.currentIndex).model.icon;
  }
}

I revisited this line for the write-up, and… I’m not too sure what it does. I think it updates the picture displayed when you switch users.

Try it out!

I’ve been using it everyday with no complaints. I might be biased, though.

While SDDM is best known for being KDE’s display manager, it actually works for any desktop environment. So sddm-theme-corners does as well! If you’re on Linux and like what you see, do test it out and lemme know what you think. I’ve provided installation instructions for the AUR as well as manual installation.

Happy ricing! 🍚