Wes Bos

Designer, Developer & Entrepreneur making the web an awesome place.

ss 2013-01-08 at 11.38.07 AM

I love tweaking Sublime Text. There are hundreds of settings you can change and I’ve blogged about a few of them before.

Here are five visual changes you can use to make your text editor just right. You should place these items inside your User settings file which can be located at preferencesSettings - User

1. Change the caret style

Who thought a caret could be sexy? Change your caret style to phase and it will fade in and out rather than blink.

"caret_style": "phase"

Other available options include “smooth”, “phase”, “blink”, “wide” and “solid”. I’ve been fond of “wide” which doesn’t blink and is clearly visible for screenshots in my new book.

2. Highlight current Line

This is one thing I wish Sublime Text enabled by default. Highlighting the current line is a subtle visual cue when jumping back and forth between a browser and code.

This is also super handy when you are dealing with long lines of code/text and you want to quickly know if the current line is wrapped or not.

"highlight_line": true

ss 2013-01-08 at 11.21.30 AM

3. Increase the line height

This trick adds just two pixels to each line, but increases the readability of code so much better. Might not be for everyone but I really enjoy this one.

 "line_padding_bottom": 1,
  "line_padding_top": 1

4. Show Code folding arrows

Code Folding in Sublime Text is really great but I’ve noticed most people don’t use it as much as they do in editors because the arrows aren’t visible until you hover over the gutter.

Make them always visible and get folding!

"fade_fold_buttons": false

ss 2013-01-08 at 11.27.27 AM

5. Bold Folder Labels

One of the downsides to Sublime Text is that the sidebar isn’t as strong as other editors. One visual cue that helps me out is bolding folders. This helps me quickly identify what is a folder and what is a file.

"bold_folder_labels": true

ss 2013-01-08 at 11.28.45 AM

More…

I’ve got plenty more in a book I’m writing about Sublime Text. If you are interested in improving your text editor productivity, please sign up below and I’ll give you a hoot when it goes live!

Let me know when this book launches

Enter your email address below and I’ll give you a hoot when its ready plus a discount code for being so great!

This entry was posted in Sublime Text. Bookmark the permalink.

21 Responses to 5 great visual tweaks for Sublime Text

  1. Sean says:

    Great tips! Sublime Text is my go-to text editor. Your suggestions add some nice flair to an already stellar interface. Thanks!

  2. Joel C says:

    Great tips, Sublime Text was the first editor I laid down cold hard cash for and haven’t regretted it. I’m excited to start working with these tweaks.

  3. Alex Vazquez says:

    Really great write up. Small tweaks mean a lot when you’re coding for hours. Can’t wait to read the book

  4. Mike Earley says:

    Thanks for writing the article, and the book! I look forward to it. I’m hoping you’ve got a section on Regular Expression! :)

  5. Hey Wes, well done. I particularly like the highlight line option. That’s a really nice one. I can’t seem to get bold folder labels or fade folder buttons to work as you’ve indicated in the screencap. I use code folding regularly so the arrows aren’t important to me, but the folder labels would be valuable. Does it have to do with the font used? I’m currently using Adobe Source Sans Pro. Here’s my current Preferences file for reference:

    http://pastebin.com/Y9LxcE41

    • wesbos says:

      That bizarre. Are you on windows/mac/linux? did you try restart sublime? (you usually don’t need to, but give it a shot).

      To see if the setting is being applied properly, go to view -> show console and enter in view.settings().get('bold_folder_labels'). If its enabled properly it should return true.

    • Jelmer Borst says:

      Make sure that you have downloaded and installed the bold version of Adobe Source Sans Pro, otherwise it will – indeed – not work.

      • Turns out that what it was. I went with another font (Ubuntu Mono) to try it out and installed the bold version. All of a sudden I noticed class names were bold and params were italics, etc. I was amazed.

  6. Awesome tips :) Thanks for helping to start my morning off on the right foot.

  7. Larry Botha says:

    nice tips!

    I’ve never been satisfied with the default styles of the sidebar in the Monokai theme (which is my favourite), so I redid them to better fit with Monokai, and created a gist:

    https://gist.github.com/2935636

  8. Thank you very much for the tips, Wes! I didn’t even know that there is code folding available in Sublime Text. So 4 and 5 were totally new (and helpful) to me.

  9. Pingback: Weekly Tech and Science Links (#3) | Darker Nemesis

  10. FichteFoll says:

    I can just recommend everyone who is using Sublime Text to look into the default settings file and look what’s available. You could’ve easily find out about this and much more by just scanning the existing options (which have a description, too).

  11. Yousuf says:

    Great Man..! This should be made the default setting of Sublime Text. Thanks

  12. Pingback: This Week in WordPress: Jan 14, 2013 - Theme Customizer

  13. John C says:

    What font and theme are you using?

  14. Ed says:

    Thanks for tweaks!

  15. We are expecting more from you for the sublime. Thanks much.

  16. kmf says:

    Thanks!

  17. Pingback: Sublime text 2 - mój zestaw ★ BobikoPL Blog

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>