Free editor, terminal and keyboard skins

Color Themes and Skins for Developers

Editor, IDE and terminal color themes, dark mode color schemes and keymaps, with a free checker that measures how readable a theme is.

Check a Theme Read the Guides
The Basics

What a Developer Skin Is

A skin changes how your tools look or feel, not what they do. Developers use three kinds. An editor or IDE theme sets the background, the text color and the syntax colors. A terminal color scheme sets the 16 ANSI colors that command-line programs use, plus background and cursor. A keyboard shortcut skin, also called a keymap, changes what the keys do.

The same palette often ships for all of these. Catppuccin, Dracula, Nord, Gruvbox and Solarized each have ports for VS Code, Neovim, JetBrains IDEs and popular terminals such as iTerm2, Alacritty, kitty, WezTerm and Windows Terminal.

Theme Gallery

Popular Editor and Terminal Themes

Each preview uses the theme's real background and syntax colors.

const palette = { rosewater: "#f5e0dc", flamingo: "#f2cdcd",

Catppuccin Mocha

The darkest of four Catppuccin flavors. Pastel accents on #1e1e2e.

Dark
def fibonacci(n: int) -> list: """Generate Fibonacci sequence.""" a, b = 0, 1

One Dark Pro

The VS Code port of the One Dark theme from the Atom editor. Muted accents on a #282c34 base.

Dark
import { useState } from 'react'; export const Counter = () => {

One Light

The light counterpart of One Dark, for bright rooms.

Light
SELECT u.username, COUNT(t.id) AS themes

Tokyo Night

A cool blue-violet palette on a #1a1b26 base, with Storm and Light variants.

Dark
import json from pathlib import Path

Solarized Dark

Designed by Ethan Schoonover. The same 8 accents work on light and dark bases.

Dark
import React from 'react'; const App = () => (

Dracula

High-contrast pastels on #282a36, with ports for a very long list of editors and terminals.

Dark
Free Tool

Theme Contrast Checker

Pick a preset or enter two colors to see the WCAG 2 contrast ratio between a theme's background and its text.

const theme = "readable"; // sample text in your colors

Method: relative luminance and contrast ratio as defined in WCAG 2.2 (W3C). Each sRGB channel is linearized, luminance = 0.2126 R + 0.7152 G + 0.0722 B, and ratio = (lighter + 0.05) / (darker + 0.05). Thresholds: 4.5:1 for normal text and 3:1 for large text (AA), 7:1 and 4.5:1 (AAA). Presets use each theme's published default background and foreground.

Bar chart of default text contrast in popular dark themes: Dracula 13.4:1, GitHub Dark 12.3:1, Catppuccin Mocha 11.3:1, Nord 9.3:1, One Dark 6.6:1, Solarized Dark 4.8:1, against the WCAG AA minimum of 4.5:1
Every theme shown passes WCAG AA for normal text, but Solarized Dark only just clears it.
Eye Comfort

How to Pick a Dark Mode Color Scheme

More contrast is not always better. White on pure black measures 21:1, the maximum. Some people, especially people with astigmatism, see bright text on pure black glow at the edges. Most popular dark themes use a dark gray base and off-white text instead, which lands them between about 6:1 and 14:1.

  • Start at 4.5:1. Below that, default text fails WCAG AA.
  • Match the room. A dark theme suits a dim room. In bright light, a light theme such as Solarized Light causes less glare.
  • Use one palette everywhere. Matching editor and terminal themes stop the flash of brightness when you switch windows.
  • Take breaks. The American Optometric Association recommends the 20-20-20 rule: every 20 minutes, look at something 20 feet away for 20 seconds. No theme replaces it.
Keyboard Skins

Keyboard Shortcut Skins and Keymaps

A keymap lets your fingers keep the habits they already have. VS Code has keymap extensions for Sublime Text, Atom and JetBrains IDEs, and JetBrains IDEs include a VS Code keymap. Vim emulation exists almost everywhere: the Vim extension for VS Code, IdeaVim for JetBrains and Evil mode for Emacs.

In any keymap, learn where to look up a binding. In VS Code, Ctrl+Shift+P (Cmd+Shift+P on macOS) opens the Command Palette, which shows the key binding next to each command. In JetBrains IDEs, press Shift twice to open Search Everywhere.

Guides

In-Depth Guides

Best VS Code dark themes for 2026

Catppuccin, One Dark Pro, Tokyo Night, Dracula and GitHub Dark compared for long coding sessions.

Best color schemes for dark mode coding

Palette picks for all-day comfort, with contrast and color temperature for each scheme.

How to reduce eye strain while programming

Monitor setup, lighting, font size, themes and break schedules that help your eyes.

Neovim vs VS Code in 2026

Speed, extensions, LSP support, theming and learning curve compared side by side.
FAQ

Frequently Asked Questions

What contrast ratio should a code theme have?

WCAG 2 asks for at least 4.5:1 between normal text and its background (level AA) and 7:1 for level AAA. Large text needs 3:1. The default text of most popular dark themes measures between about 6:1 and 14:1.

Is a dark theme better for your eyes?

Not by itself. Digital eye strain comes mostly from long close focus, less blinking, glare and a screen much brighter or darker than the room. A dark theme helps in a dim room; a light theme is often easier in a bright one.