Atom Syntax Themes Today
While implementing a rough draft of my first syntax theme for Atom, I noticed there an absence of resources concerning best practices in theme development. On one hand, an Atom theme is just CSS: you can inspect the editor’s DOM to figure out what’s available in terms of selectors, and roughly how these classes interact.
Despite this transparency through Atom’s developer tools, there’s a lack of syntax theme documentation, and no good boilerplate to kickstart theme development. Unfortunately, a developer needs to reverse engineer the necessary CSS to make an effective theme.
I’d like to remove some of this barrier to experimenting with theme development.
I’m releasing Atom Themerator, a web-based generator for syntax themes. This is a tool to kick off a syntax theme such that it’s reasonably complete and stable out of the box. From that point, there’s always an opportunity for further customization.
The sweet spot for Atom Themerator is in providing a strong set of tokens to color without tripping over the number of options. Once the first stable release is available, I’ll focus on providing theme generation presets based on selecting three or four core colors and extrapolating from there to a core theme.
I hope you enjoy working on and customizing your own editing experience.