108

People occasionally post screenshots with modelines that have solid colors and triangles: enter image description here

How do I replicate this effect?

Improve this question
3

4 Answers 4

Reset to default
91

This can be achieved with two packages:

  1. smart-mode-line.
  2. powerline.

Overall, smart-mode-line is more powerful than powerline (pardon the pun), in the sense that it offers more features to control the mode-line's behaviour and more customizability in the appearance. The Readme has a great list of features, but in short it offers width-control, string replacement in the file path, hiding of the minor modes, among other things.

  • If all you want is to achieve the screenshot, powerline is the best choice.
  • If you want a suite of other features combined with that, give smart-mode-line a try.

Since powerline has been very well explained on another answer, I'll focus on how you can achieve that appearance with smart-mode-line.

First Install

You can install smart-mode-line from Melpa, Melpa-Stable, or download it manually. Assuming you decide to use the package manager, just do

M-x package-install RET smart-mode-line

Once you turn it on with M-x sml/setup, your mode-line should look similar to one of these two.
Dark Theme Screenshot Light Theme Screenshot

Powerline Theme

smart-mode-line has several themes built-in, the one that achieves the requested appearance is provided separately in the themes/ directory. Note that this theme is still in beta, so customizing it might not work perfectly just yet.

Install the theme from Melpa 

M-x package-install RET smart-mode-line-powerline-theme

If you want to install it manually, it's here, but you'll also need to install powerline.

Finally you can turn on the theme with M-x sml/apply-theme RET powerline. And your mode-line should then look like this.
Powerline Theme Screenshot
As you can see, the order of elements is not quite the same, but the overall appearance is there.

To use this theme every-time, add the following to your init file. You can also customize any of the powerline configuration variables, and they should have the same effect here.

;; These two lines are just examples
(setq powerline-arrow-shape 'curve)
(setq powerline-default-separator-dir '(right . left))
;; These two lines you really need.
(setq sml/theme 'powerline)
(sml/setup)
Improve this answer
3
  • 1
    I also was writing about smart-mode-line, but you surely explained better. Thank you.
    – Boccaperta-IT
    Commented Sep 26, 2014 at 9:37
  • 4
    You can also elaborate on the regexp features where a path can be represented by a shorter set of characters... :ED: instead of ~/.emacs.d/ and rich-minority to hide the minor mode lighters.
    – Kaushal Modi
    Commented Sep 26, 2014 at 10:05
  • 1
    @kaushalmodi elaborated a bit.
    – Malabarba
    Commented Sep 26, 2014 at 11:48
48

This can be achieved with a package called "powerline". There are several variants available, including at least one you can install through package.el.

Personally, I use this one. Here's a screenshot from the package's README:

A powerline example.

You can configure the color by setting the face of the mode-line:

(set-face-attribute 'mode-line nil
                    :foreground "Black"
                    :background "DarkOrange"
                    :box nil)

You can also configure different shapes, rather than just triangles:

(setq powerline-arrow-shape 'curve)

Emacs powerline with curves instead of arrows.

Improve this answer
5
  • 3
    FWIW - If you have an issue with getting the separators' colors to be totally seemless like I did, I found this powerline fork where you can (setq powerline-default-separator 'utf-8) which allows you to use any of the powerline patched fonts here.
    – waymondo
    Commented Sep 28, 2014 at 18:06
  • @thepalmcivet: good to know, but I'm not entirely clear what you mean by getting the colors seamless. Do you have a screenshot of the problem or something? Thanks!
    – Tikhon Jelvis
    Commented Sep 28, 2014 at 20:25
  • 2
    No problem, here's what I get with (setq powerline-default-separator 'arrow). I am installing Carbon Emacs with Homebrew with the --srgb flag and (setq ns-use-srgb-colorspace t) in my .emacs.d.
    – waymondo
    Commented Sep 29, 2014 at 22:08
  • Tikhon, that's one lovely mode line you have there. Could you post the full mode-line-format section which you've partially screenshotted? Thanks :-)
    – Ivan Vučica
    Commented Jul 23, 2015 at 16:52
  • 2
    @IvanVučica: Thanks! It's on GitHub, in two parts: a modified powerline.el which contains a bunch of shapes to choose from (curve is nice, but I use diagonal now) and my .emacs itself, which has some misc settings I got somewhere. If you're so inclined, you can make your own copy of powerline.el and add your own separator shapes through ASCII art to get the exact effect you need :).
    – Tikhon Jelvis
    Commented Jul 23, 2015 at 22:33
13

As other people have mentioned, powerline is the package that formats the modeline that way. Most emacs themes however, don't define colours for powerline (which is not great). One theme that does is the colourful (and comprehensive) moe-theme. It even has a mode that changes colour in the evening to be easier on the eyes. It looks like this:

moe-theme in glorious magenta mode, theming the powerline modeline

My arrows in the powerline look strange because I'm using an unpatched version of Luxi Mono font.

Improve this answer
2

My arrows in the powerline look strange because I'm using an unpatched version of Luxi Mono font.

William Roe, judging from your screenshot you are on macOS. As stated in this issue comment, you will need to add

(setq powerline-image-apple-rgb t)

to your init file(s). This should correct the colouring issue with the separators ("arrows"). Worked for me at least.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.