Dimming JavaScript curly braces and brackets in Emacs

When coding in Lisp or Scheme, some Emacs users prefer to have the parenthesis/brackets dimmed. The reason for this is that it makes it easier to see the things that matter like variable names.

I’ve been coding more JavaScript lately and wondered if this would work for JS and indeed it does. While it doesn’t turn JS into CoffeeScript and you still have to type in in the brackets and curly braces and semi-colons, it does let you adjust the colour of them and let’s you dim them so that you can see the important parts.

Download parenface.el and then paste in the following snippet and you’re good to go. Don’t forget to customize the paren-face colour by doing this: M-x customize-group faces

Here’s a before and after shot (I’m using snow3 as the paren-face colour, the default provided by parenface.el is DimGray):

before and after enabling parenface for js-mode

before and after enabling parenface for js-mode

I’m not sure how useful it is to hide the ‘var’ and ‘function’ keywords. The cool thing is that all you have to do is alter the regex to suit your preferences.

If you like these kinds of snippets, check out Emacs-SOS, a StackOverflow search for emacs.