Afterglow: Dark Theme for Sublime | Hacker News Reader

Afterglow: Dark Theme for Sublime

yabatadesign.github.io

230 pointsimd2389 comments

I used http://colorsublime.com/ - it took me about 1 second to install Afterglow.

Colorsublime installation instructions (using Package Control):

  1. CMD ^ P

  2. Type "install" and select "Package Control: Install Package"

  3. Type "Colorsublime" and select "Colorsublime"

Installing the theme:

  1. CMD ^ P

  2. Type "theme" and select "Colorsublime: Install Theme"

  3. Type "afterglow" and select "Afterglow"

Profit.

When using Colorsublime (steps 1 + 2 of the second set), you can also arrow up and down through the themes and get a live preview of each as you do so.

Note: Colorsublime only installs the color scheme. If you want to take full advantage of a theme like this (includes custom tab styles, custom sidebar styles, etc.), you'll need to follow the directions on their website.

This is better than their instructions just marginally.

  1. CMD ^ P

  2. Type "install" and select "Package Control: Install Package"

  3. Type "Afterflow" and select "Theme - Afterglow"

  4. Press: Command + ,  (to go into settings).

  5. Paste the two lines from Github page, add any additional settings and restart sublime.

edit: Ah I just saw your update, previewing is a nice little feature for sure, especially when you're not sure how they handle colors for the languages you use most often. Sounds nice

I was just about to say, "see my latest edit"... when I saw your latest edit :)

The preview feature also lets you move between your open files while previewing a theme (without selecting it), so you can check HTML, CSS, Python, etc. all without changing your theme.

Notably this is compatible with ST3 only. No backport for Sublime Text 2 users.

Thanks. Kinda annoying this wasn't mentioned in parent, spent a couple minutes wondering why I couldn't find it in package manager.

This doesn't install the whole theme though (at least for me), just changes the colour scheme.

To that, you'll need to install the theme by following the instructions on the Afterglow github page.

You're right. Until this very moment, I just realized, I haven't ever "installed a theme", so I've never experienced the customizations available for the entire UI, just the color scheme. I'm going to try installing the theme now, and I'll update my OP to note this. Thanks.

It's awesome for simple color theme, but for big themes with icons and other stuff it just doesn't work.

Sublime people are creating promo pages for something like IDE themes? That's interesting.

Sublime is a culture of people where a larger portion of the users are design oriented when compared to most editors.

It's not just sublime, you can find the same thing for old textmate themes and even some vim themes.

> old textmate themes

I really wish the people working on Textmate right now would do SOMETHING to indicate on the homepage that Textmate is now open source, free, and actively developed on Github. Instead, they leave the Textmate 1.0 homepage up and people think it's an archaic, dead editor :(

1st Google result ( years out of date ): http://macromates.com/

2nd Google result ( actually the current project ): https://github.com/textmate/textmate

I figure it was started by the popular Solarized color theme: http://ethanschoonover.com/solarized

Neat theme. I've been enjoying Space Gray for a few months now: http://kkga.github.io/spacegray/

Any other suggestions for somewhat minimal themes out there?

Nil is pretty cool https://github.com/nilium/st2-nil-theme

I switched to Nil w/ the Big Duo color scheme about a year ago and since then no other theme/scheme looks right. To me, it's the perfect use of contrast while still pleasing to the eye.

I was also a big fan of Spacegray Eighties, but I recently switched to Oceanic Next. It's similar (but with a blue hue), and is supposed to work better with JS Harmony.

https://github.com/voronianski/oceanic-next-theme

Soda Light theme + Mac Classic scheme works for me.

A suggestion to all theme designers, if I may:

Line numbers are visual noise most of the time and can be distracting. Make them transparent, so I see them only when I'm looking for them. Same goes for indent guides, but make them slightly darker than background. Example: http://i.imgur.com/tQ46gWT.png (modified Spacegray)

They also have crated a icon for ST2/ST3, which is also nice! link - https://github.com/YabataDesign/sublime-text-icon

I just applied, this is how it looks in Dock - http://i.imgur.com/zFFP9wq.png

same, just noticed this and changed the icon. I really like it so far :)

Note: if you do replace it, you probably will need to kill your dock, and clear the icon cache; here's a good command to do so:

rm /var/folders///*/com.apple.dock.iconcache;killall Dock

there's a couple of missing stars in that command between the slashes. That said, this didn't replace the icon for me. I needed to touch the app folder as well for the update to work

    touch /Applications/Sublime\ Text.app
    rm /var/folders/*/*/*/com.apple.dock.iconcache;killall Dock

Yeah, thanks on the stars - I forgot to actually enter them as commands and for some reason it removed the stars when the comment was parsed.

This looks great.

Here's the best Sublime replacement icon I've found: http://dewith.com/2014/muir-yosemite-icons-volume-ii/

Reminds me a lot of IDEA's Darkula - the only theme I can stomach these days.

This is gorgeous. I wish there was one for Emacs :(

The scheme I use looks similar:

  (custom-set-variables
   '(custom-enabled-themes (quote (tango-dark))))
  
  (custom-set-faces
   '(default ((t (:family "Consolas" :foundry "outline" :slant normal :weight normal :height 90 :width normal))))
   '(rainbow-delimiters-depth-1-face ((t (:foreground "#A0FA67"))))
   '(rainbow-delimiters-depth-2-face ((t (:foreground "white"))))
   '(rainbow-delimiters-depth-3-face ((t (:foreground "yellow"))))
   '(rainbow-delimiters-depth-4-face ((t (:foreground "dodger blue"))))
   '(rainbow-delimiters-depth-5-face ((t (:foreground "hot pink"))))
   '(rainbow-delimiters-depth-6-face ((t (:foreground "cyan"))))
   '(rainbow-delimiters-depth-7-face ((t (:foreground "lawn green"))))
   '(rainbow-delimiters-depth-8-face ((t (:foreground "firebrick1"))))
   '(rainbow-delimiters-depth-9-face ((t (:foreground "SeaGreen1")))))
  
  (require 'rainbow-delimiters)
  (global-rainbow-delimiters-mode)

If you like that low contrast style you might like the zenburn emacs theme. It is a bit too low contrast for me so I use hc-zenburn (high contrast zenburn)

I use sanityinc-tomorrow-night which is pretty similar: https://github.com/purcell/color-theme-sanityinc-tomorrow

You can easily port it:

Step 1: write down the colors for default foreground face, background face, keyword face, string face, comment face, functionname face, type face, variable face and constant face.

Step 2: Go to http://emacs-theme-creator.appspot.com/, paste the colors and click done.

Step 3: have fun with your new emacs theme.

Great theme, I do enjoy it. A few suggestion:

- make the bad bar thinner: it takes up a good chunk of usable screen real estate for just showing file names (especially important on laptops)

- The scroll bars could be a bit "lighter". They blend into the dark a bit too well.

This can be customized, thankfully. I love this theme now! https://github.com/YabataDesign/afterglow-theme#tab-height-s...

Did you mean the tab bar? It's specifically mentioned that you can change this with a setting.

Try:

    "tabs_small": true

for small tabs. I just turned it on and now it takes up about as much space as space grey did.

I've been using the port of Atom's Seti[0] in Sublime and can't see myself changing to one unless it has icon support like it now.

[0]https://github.com/ctf0/Seti_ST3

Vim version please?

I second that. I'd like to give it a try in vim and see if I still like it after a day of use.

Me too. I'm currently using 'jellybeans' as my default and I love it but I'd give a try to this one.

Hmm, I wonder if there's a site/utility where you input a theme and it converts it to everything else.

They have an iterm2 theme https://github.com/YabataDesign/afterglow-itermcolors , gets you partway there (on a mac).

gruvbox theme for Vim is very similar.

https://github.com/morhetz/gruvbox

Unfortunately, I don't believe that an afterglow theme for vim exists yet, but if you want to try some different themes out, I'd recommend https://github.com/flazz/vim-colorschemes. My favorites are solarized, flatland, and codeschool. Solarized is likely the most advanced/complete vim colorscheme by looking at the solarized.vim.

After installing it, only the colors on the code editor change. How do I get the tabs and file list panel to look like in those screenshots? It looks like a standard OSX control in mine.

{ "theme": "Afterglow-<variant>.sublime-theme", "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme" }

stick that in your user pref file

Did you restart Sublime?

It did require both what mathieuh said, and restarting. Thanks!

Have you tried reloading the editor? Worked for me on Windows.

This looks a lot like the Railscasts theme, which has been around forever on Sublime, Textmate, and pretty much everything else.

https://www.google.com/search?q=railscasts+theme&client=safa...

Sorry for being a bit of topic but why is everybody so enthusiastic? I just installed the editor in Windows and it costs 70$! Is it that good? I remember installing it in Arch Linux for free without warnings... What is the deal? The website is not very clear on the exact license plus I found some alternatives that look the same on first glance (i.e. Lime Text).

70$ is not much money if you use it 8 hours a day. Also, you can use it without paying — it'll show a popup window now and again telling you to buy it; just a minor annoyance.

Pretty on the screenshots, but I had troubles getting it to work, too (on Windows).

Lots of scheme loading failures at first, then once I tried another recommended way to install it, I got plenty of visual quirks.

I'm sure there is a way, but if I can't get a text editor theme to work in a couple of minutes, I move on :)

Shameless plug:

I created an ST3 plugin called SynCycle[1]. It switches themes at sunrise and sunset.

e.g. a light theme during daytime and dark theme during nighttime.

For who's interested: you can install it with Package Control.

[1]: https://github.com/smhg/sublime-suncycle

Oh so a bit like f.lux but for Sublime :) nice

I use dark themes whenever I can, but I could be convinced to use a similar package that let me switch themes on command. You could even call the bright command Go Outside and the dark one Go Inside.

That should have been SunCycle, not SynCycle...

I just installed it with Package Control, and added the two config lines to my User Prefs and it immediately updated everything without me even quitting and re-opening Sublime. I've been using the same ol' boring Soda dark theme for years now, so this is pretty refreshing. Thanks :)

Before this I was using Soda Dark 3 -- also a theme which changes tabs, etc.

After installing Afterglow, my tabs and sidebar are badly distorted and garbled after restarting SublimeText3 with the configuration lines added.

Am I missing something, or do I need to clear something?

Tried clearing the Cache, etc. Still extremely distorted. Have had to revert back to Soda Dark until I can see why this is happening.

This is a known issue -- be advised:

https://github.com/YabataDesign/afterglow-theme/issues/23

Solved this by NOT using Colorsublime, but using the Afterglow theme directly available from the Package Manager. I believe the one in Colorsublime is not 1.2.8 or newer.

Slightly OT: Does anyone know what font they're using in their screenshots?

Inconsolata-g. http://leonardo-m.livejournal.com/77079.html

Really, really great. Thanks for sharing!

Also thanks for extensive documentation.

Neat! I personally use the default theme with lighter syntax http://prntscr.com/6f4jp5

I install it, but the tabs goes like this. (http://i.imgur.com/JsH1Umf.png)

Try restarting the app.

I did but no change.

Looks nice and reminds me of Seti (https://github.com/ctf0/Seti_ST3)

Anyone know what it would take to convert to atom.io?

I have been using it for a while now. Nothing wrong with it, I like it very much and have yet to find a better alternative.

Does this have colored gitgutter icons?

gitgutter works in the editor window, not so much in the sidebar.

Colours are decided by the scheme though I believe.

it's really beautiful and for ONCE it actually works when I install it!

I just tried the Markdown theme as well and I had to remove this line for it to work: "wrap_width": 80

beautiful as well! Good job!

You should note that changing Sublime's icon is not doable (at least easily) in Windows.

Any scientific reason behind using a dark theme?

Does there need to be? People think it looks nice. I personally find text hard to read on a dark background, some people don't.

Not scientific, but I find I have less eye strain with dark themes.

I don't have eyestrain problems on most devices, but the Retina MacBook I have at work wears my eyes out in just a few hours. I can stare at my Chromebook Pixel indefinitely without issue in the same environment.

I find using a dark theme when coding in the dark is better because the bright white background won't blast your face.

light themes are better if you have a glossy display and there's some sunlight since you won't see so many reflections

I've heard dark themes can actually damage your eyesight because the contrast isn't high enough. I like white themes because it's just like paper. Black text is easy to see.

Well, there are high contrast dark and light themes.

Is there an easy way to port this to IntelliJ?

I would love to have this theme in my IntelliJ too.

Differents colors?

Yes, click on the link to their Github page.

Late to the party, I've been using this for months.

Should have posted it months ago then?

It's not an #indieband discovery thread.

I forked the Cobalt2 theme and altered the colors and icons to work with the Monokai Extended color palette. You can download the ST3 theme here at https://github.com/wdhilliard-genebygene/monokai-blue

Reply on news.ycombinator.com