Back to the talks Previous by track: Colour your Emacs with ease Next by track: Watering my (digital) plant with Emacs timers Track: General

My journey of finding and creating the “perfect” Emacs theme

MetroWind (he/him) - IRC: MetroWind, Fediverse (pleroma): mw@pleroma.xeno.darksair.org - Matrix: @mw:darksair.org

Format: 12-min talk ; Q&A: BigBlueButton conference room
Status: TO_CAPTION_QA

Talk

00:02.140 Introduction
00:48.820 Deviant
01:15.640 FlucUI
02:51.910 Lab
05:25.090 NotInk: grayscale
06:13.930 Random theme
06:50.020 Monte Carlo
07:19.780 How to pick a random color palette
08:12.070 XYZ
Duration: 11:28 minutes

Q&A

00:33.865 Q: When you choose colors based on the same lightness, does it not hurt readability since the eye sees lightness most?
01:52.280 Q: For monte-carlo, are all the "random" colors picked using a colorwheel/hue rotation?
02:43.720 Q: One area I see emacs able to do themes that is "underused?" is changing the font
08:53.461 Q: Have you ever kept any of the random themes that were thrown up?
Listen to just the audio:
Duration: 09:51 minutes

Description

In this talk I will share my experience of finding and creating the “perfect” Emacs theme. I will go through the five themes I have created and discuss the motivations and ideas behind them, which will also introduce various color spaces. And I will look into the future to see if there is hope to find the "perfect" theme.

About the speaker:

I'm a long time Emacs user (since Emacs 21). I don't write a lot of elisp but I'm spend vast majority of my screen time with Emacs, and I'm picky about how it looks. This talk shows how may hoops I'm willing to jump through to make it look "right".

Discussion

Questions and answers

  • Q: When you choose colors based on the same lightness, does it not hurt readability since the eye sees lightness most?
    • A: 
  • Q: One area I see emacs able to do themes that is "underused?" is changing the font. font size, font typee, monospace or perpotional, bold. based on the varios faceets of emacs. Is it a magit issie a code comment a  code string or varible name etc...
    • A:
  • Q:
    • A:
  • Q: For monte-carlo, are all the "random" colors picked using a colorwheel/hue rotation? 
    • A:
  • Q: Have you ever kept any of the random themes that were thrown up?
    • A: No. When Emacs picks monte carlo by chance, I wouldn't know about it. That's why I didn't keep any of the themes it generated.
  • Q:
    • A:

Notes

Transcript

[00:00:02.140] Introduction
Hi my name is MetroWind. In this talk I will take you through my journey into Emacs themes. I am a long-time Emacs user. I started using Emacs since version 21. The goal of this talk is to inspire more people into making themes. Maybe you are already making themes. In that case I hope you could find some tips and tricks you know in this one I will basically go through all the themes that I created. But I think the most important thing here is to understand why some of the some of the colors are picked, and the motivations behind them.
[00:00:48.820] Deviant
So the first theme I created is called Deviant. It looks like this. The inspiration for this one is a website called DeviantArt. Basically I just use their color palette, you know, from their design. It was a like a community for indie artists. I was really into that, you know, back in the day so that’s that.
[00:01:15.640] FlucUI
Otherwise, nothing special. The next theme I created was called FlucUI It’s in MELPA. And let me just show you. So yeah that's how it looks like. So... but where where did the colors come from, right? To understand that, I'll need to take you back in time, you know, to where iOS 7 was released by Apple. That was a big deal, because that popularized the idea of flat UI color designs; sorry, flat UI designs. And after that, everybody followed suit, and changed their design, you know of all of their websites and applications to use some sort of flat UI design concepts. And about the same time, there came a website called flatuicolors.com. It hosted one color palette, and that was really good! So I picked that as the basis of my theme. And initially I named it FlatUI, But that name was taken in MELPA So i just rename it to something random, FlucUI.
[00:02:51.910] Lab
The next one is called lab. To understand why I needed to create the theme, it's because I thought some of the colors in FlucUI was standing out too much, like the green here. This one. I thought this was too bright. Just a little bit. So I thought I needed way to pick some colors that are about the same lightness essentially. So how would I do that? The answer is to go into a color space called LAB. Now normally you'd do color work in RGB, which is red, green, and blue. It doesn't tell you a lot about lightness. If you do a pure blue, it actually looks a lot darker than a pure red or pure green. So that that doesn't work. But in LAB, thing are different, because one of the channel is L which is lightness. The other two channels are a and b, which are just for colors. This is great because I could just fix L meaning I fixed the lightness, and then I can vary a and b however I want. The color will stay roughly in the same lightness, which is exactly what I wanted. So for that I created a Mac app, where I could just fix lightness like I said, and then I could click on this colorful thing, to pick a color. The app will pick another five according to some pattern. And then I could just like hard-code these colors in Emacs. Let me show you. apply theme... lab... Yeah not very different from FlucUI colors, which was intentional. The idea here again is all the colors will be in about the same lightness, which I guess it was. So yeah... So this one was a success. I use it for a really long time. And then I got bored...
[00:05:25.090] NotInk: grayscale
So I needed something interesting. The idea at the time was then to create a theme that doesn't have any colors essentially. A grayscale theme. So I called it NotInk. It is also in Melpa It looks like this. Yeah like I said, everything is grey. There's no color. But to my surprise, this is actually very useable. I didn't have any problem in readability; I didn't have any problem distinguishing, you know, different elements in the code. So a big surprise. And also a big success actually. And then I got bored.
[00:06:13.930] Random theme
I just decided to install a whole bunch of themes from MELPA, and every time I start Emacs I just pick a random theme. There are some caveats to that, which I don't want to get into. But let me just show you. apply-random-theme, so it picked one for me. And then it picked another... another... So yeah. It's an interesting setup. I'm still using this setup today. Actually a good one Walls of text...
[00:06:50.020] Monte Carlo
Now the final theme I want to look into, which is the latest, is called Monte Carlo. ...which you know, idea here is to bring the idea of picking a random theme to the next level. So this is just one theme that generates a random color palette for me everytime. Not in MELPA, because I'm not ... I'm not completely satisfied with it.
[00:07:19.780] How to pick a random color palette
But anyway... How do I... How do I pick a random color palette right? The answer is again to look at a different color space. This time it's called HLC, which is hue, lightness, and chroma. So hue is just colors, red, green, blue, or yellow, whatever. Lightness is lightness. Chroma is saturation, essentially. This is great because I could fix both lightness and saturation, and only vary in hue to pick my colors. Now the problem is once I have the color palette in HLC, how would I convert it to sRGB, because Emacs only knows about colors in sRGB.
[00:08:12.070] XYZ
The answer here is to go through another color space called XYZ. This is an extremely important color space, because basically all other color spaces are defined on top of XYZ. So you would have like transformations from XYZ to all other color spaces. Now if you invert this these transformations, you could go from, for example, HLC back into XYZ and then go to another color space of your choosing, right. So this is how to convert colors between color spaces. In this case, I have to convert colors from HLC to LAB, and from LAB to XYZ, and from XYZ to sRGB. So this time the conversions are all done in Emacs Lisp, and I have the code in here in this URL. You could take a look, or you could actually just use maybe some package to convert colors. Anyway let me show you how this works. So in this case I could apply theme, Monte Carlo. So this is now a random theme. Actually, well, a theme with random colors, because I could apply the same theme, and it will look different. Every time. I could also look at the colors it picked. as a list of colors. I could also look at this like fancy chart of colors. This is too small. So let me show you this. So basically the same thing. This is actually a cross-section in HLC space, and the colors it picked are these like white circles. So that's that. But like I said, I'm not fully satisfied, because most of time the colors are pretty boring from it. I could think of some ways to improve this. For example I could choose different patterns for the color samples. but I don't know of any good patterns. So I need to try things out. And then another way is probably to use different color spaces like the HSL, or HSV. Again I need to try this out. So yeah there are room for improvements. If you... If you have and idea, you know, let me know, and we can try it out. So that's the end of my talk. Hopefully you have some new ideas. Thanks for listening in, and yeah. Go create more themes because we can't have enough. Thanks!

Q&A transcript (unedited)

So just to be clear, right now we are currently streaming. So if you want to answer with your voice, you can as well. Oh, I'm sorry. Okay. Yeah. So I've got a question. I think there was a little bit of a misunderstanding with whether we were doing a Q&A on BBB or if we were doing it on Etherpad. So it's really up to you. Right now we've set up everything. So if you want to start answering questions with your voice, we might as well. So OK, so I can just do it live.
[00:00:33.865] Q: When you choose colors based on the same lightness, does it not hurt readability since the eye sees lightness most?
So one question is, so I assume this is a question on the lab space, where all the colors are the same lightness. Does it hurt readability? So far, I find it to be OK. For the lab theme, I picked the colors manually. So like I could just fix a angle essentially so that no colors are similar, so I have good readability. But for a random theme in Monte Carlo, it's hard because like it's just random. But yeah, that's a really good point. And also that's one of the motivations I did the nothing, you know, the great scale theme to explore just using lightness. Yeah. So looking at other questions. Okay, great. Do you want to take the next question. So, okay.
[00:01:52.280] Q: For monte-carlo, are all the "random" colors picked using a colorwheel/hue rotation?
Okay, let's go to the third first. Let's finish. Yes, for Monte Carlo are all the random colors that using a color wheel here. Yes. Well, so basically, what this theme does is it. It picks a saturation and lightness for me first. These are also random, but they are picked with some kind of range. And that's a parameter that I can play with, you know, the range of lightness and separation. Once those are fixed, the colors are picked by angles in the color wheel, or heel rotation, as you would put it. So yes, that's roughly the process.
[00:02:43.720] Q: One area I see emacs able to do themes that is "underused?" is changing the font
OK, great. I think the second question is still in the process. Oh, well, maybe you could start fielding it. I think you've got already something to work on. I see one area I see Emacs able to do. under use is changing the font, font size, font type, model space based on various faces. Yeah, so to paraphrase the question, one thing that Emacs is definitely not doing a whole lot of right now is changing the font that is being used, be it the font size, the font family. Sometimes you see themes, especially old mode themes, fontify differently the headers of the documents versus the content, and usually you do have a little bit of a contrast that is being introduced. But is it something that you find value in, this type of contrast based on font? And to me, it's my personal preference to just use one font. I don't even change the font size a lot in org mode. It's just personal preference. I've seen scenes where once I applied, I opened the org doc and suddenly all the titles are like Serif or some fancy fonts. That works. And to me, again, it's a personal preference that I don't really like that, but I know a lot of people like that. So it's up to you, I guess. Yeah, I mean, this, as we've seen in your talk and as well as the previous one we had this morning, you know, themes are very personal and at the end, whatever you need to, you know, some people are going to need more contrast than others, some people are going to need a little more variety in the fonts that they use. Ultimately, it's up to you really what you want to use. The end point, the angle that one should be aiming for is to feel comfortable in what they're editing. And whether this comfort translates into a very barebone color theme like the one we saw this morning with very slight colors but still which has a lot of personality or perhaps something closer to yours which tends to use equal luminance or lightness for the different entries. Well, everyone needs to tune in and find whatever works best for them, I think. Yep. And also, I want to note, I actually have a personal rule. It's also in all my themes. It's that comments have to be italic. I just like the look of italic comments. So, I actually... So, if you... In one of the section in the video, I mentioned I have hooks. Maybe I didn't mention, but I have hooks when using the picking the random theme setup. One of the purpose of that hook is I can add italic to all the themes on the comment face. Which I don't think it works actually right now, but that's the intention. Yeah, but I think it answers the question we started on originally. Because changing the font, I mean, using the italic variant of the font, it's literally a different font. And so, being able to have this type of contrast is actually important for you. So, it's nice that you managed to find this particular bit of knowledge through experimentation. And also I want to add that if you pick a monospace font like I do, usually there's not a lot of... Creativity? No, that's not the word. It's a lot of personality in the regular font part. But people do put a lot of different things in the italic. So yeah, if you can find a way to utilize the italic face, you could see some interesting results. Yeah, definitely. Again, I think it's important to consider all the things you can play with in terms of contrast. Because at the end of the day, you know, some people are going to be more receptive to a change of font than change of color. You know, just considering the amount of people who are colorblind and who are using software like this. You know, sometimes your vision optimizes for particular kind of changes and some people are going to be more sensitive to a slanted eye than they would be to an eye that is red or an eye that is blue. So, But it's not for everyone. So I'm looking at the time and we have about eight minutes until we go into the next talk. To be frank, I don't think I've got any more questions on my end. I'm not sure if we've got any people on BBB who has joined us and would like to ask a question. Let me check on IRC quickly if we've got any questions coming our way. I don't see any. Do you see any on your end? Not really. Well, then I suggest we just leave it at that and enjoy a little break before the next chat. So, thank you so much Metrowind for coming to EmacsConf and talking about colors because, as you saw, many people are interested about them, so much that another person decided to have a chat about theme. We didn't plan for this, but it's nice to see. And, well, perhaps you could collaborate in the future and both find the mutual confidence that you need to push your stuff to Melpa. Because I did hear that you weren't feeling too confident about your random color theme package. But, you know, you've done the first step, which is talking about it and sharing it with all of us. And perhaps the next step is to actually clean up the code to your satisfaction and publish it eventually. Oh, I can see another question. Should we go to that? Sure.
[00:08:53.461] Q: Have you ever kept any of the random themes that were thrown up?
Have you ever kept any of the random themes that were thrown up? So I assume this is for the Monte Carlo setup. The answer is no. The reason is, like I mentioned, I'm using the randomly picking a theme setup right now. And Monte Carlo is one of them. Now, when Emacs picks Monte Carlo by chance, I wouldn't know about it. So I wouldn't know this is my random theme. That's the reason I never kept any, like, good color schemes generated. So, no. Right, okay. Well, considering we don't have any further questions, what I suggest now is that we'll leave it at that. So, again, Metrowind, thank you so much. Thank you. And hopefully we'll hear more of your themes in the future. Cool. Thanks. All right. Bye bye. Bye bye.

Questions or comments? Please e-mail emacsconf-org-private@gnu.org

Back to the talks Previous by track: Colour your Emacs with ease Next by track: Watering my (digital) plant with Emacs timers Track: General