DEV Community

Cover image for Squirrelsong: light & dark themes for web developers
Artem Sapegin
Artem Sapegin

Posted on

Squirrelsong: light & dark themes for web developers

I’m excited to share the new version of my color scheme — Squirrelsong. It’s a low-contrast light and dark code scheme and UI theme for web developers.

I don’t like distractions, and most themes are too bright for me, especially the current trend in UI design (the new “minimalistic” JetBrains UI, for example). That’s why created the first version of Squirrelsong seven years ago, and was using it since then mostly unchanged. It was pretty but quite random.

In the past two months, I’ve rebuilt it almost from scratch, made it more consistent across different apps and programming languages, and added code themes for many more apps, as well as UI themes.

Here’s the light version:

Squirrelsong Light theme for Visual Studio Code

And here’s the dark:

Squirrelsong Dark theme for Visual Studio Code

Get the theme for your editor, terminal, or app

Why Squirrelsong?

1. Low contrast with great readability

Most themes, especially dark ones, have very high contrast which makes them tiring for the eyes. Squirrelsong themes are low contrast but still provide enough color and style variety to distinguish various elements of the code and avoid long chains of code printed in the same style.

Low contrast with great readability

2. Made for web developers

Carefully crafted syntax highlighting for JavaScript, TypeScript, HTML, CSS, Sass, styled-components, Markdown, JSON, XML, React, and Astro. Also, works well with PHP, Python, Ruby, Rust, Java, Swift, etc.

Made for web developers

3. Monochrome Markdown styles

Inspired by iA Writer, Markdown is styled in shades of gray to avoid distractions while writing your next blog post, documentation, or book.

Monochrome Markdown styles

4. Consistent highlighting of different programming languages

Colors and styles are consistent among different programming languages: for example, this in TypeScript is styled the same way as $this in PHP and self in Python or Rust. HTML looks the same as JSX in React or markup in Astro components.

Consistent highlighting of different programming languages

5. Non-distracting UI

Custom UI for Visual Studio Code, JetBrains IDEs, and other apps without oversaturated bright colors to keep you focused on your code.

Non-distracting UI

Get the theme for your editor, terminal, or app

Top comments (0)