cozy gray
Get the theme

A softer shade
of focus.

A quiet color theme for your editor and terminal. Thoughtful grays, clear colors, and room to think.

Get Cozy Gray Two appearances. One familiar feeling.
When the day winds down.
cozy-gray / a-space-to-think
workspace.tspalette.json
// A little less noise. A little more focus.import { createTheme } from './cozy-gray';type Workspace = {  name: string;  appearance: 'light' | 'dark';  distractions: number;};export function makeRoom(workspace: Workspace) {  const theme = createTheme({    ...workspace,    palette: 'warm-gray',    contrast: 'balanced',  });  return theme;}const home = makeRoom({  name: 'A space to think',  appearance: 'dark',  distractions: 0,});
main 0 problemsUTF-8 TypeScript Cozy Gray Dark
Same calm. Every line.
Illustrative code and terminal examples.Built around warm gray.
For the tools you come home to
VS CodeGhosttyZedNeovimJetBrainsAnd more

Gray, with a
little warmth.

Somewhere between a well-worn notebook and a quiet room. Cozy Gray takes the edge off your workspace with gentle neutrals and just enough color to find your way.

Get to know the palette
Three smooth gray stones and a sage leaf on a softly lit stone surface
Graphite. Stone. Quiet by nature.

A little color.
A lot of calm.

Warm neutrals do the heavy lifting.
Earthy accents give your code its rhythm.

Pick a shade to copy its hex value.

Made for
the long run.

Your code can be expressive.
Your theme can be quiet.

// A softer place to start.
const workspace = {
  background: 'warm graphite',
  pureBlack: false,
};

Soft on the surface.

Graphite instead of pure black. Stone instead of bright white. A quieter starting point, in either appearance.

function findYourFocus() {
  return {
    strings: 'a little amber',
    noise: 0,
  };
}

Color with a purpose.

Amber, coral, and rose make syntax brighter and easier to distinguish against quiet gray surfaces.

~/projects/cozy-gray main
$ npm run make-room

[ok] Turn down the visual noise
[ok] Keep the important things clear
[ok] Make yourself at home

Ready when you are.

One palette. Your whole flow.

Carry the same familiar tones from your code to your command line, with a matching light and dark palette.

At home in
your setup.

Find your tools. Bring your own habits.
We’ll bring a quieter palette.

Installation guide

Native files are available for the tools with an arrow. Planned ports include a downloadable palette reference. App validation is still in progress.

Settle in.

A small change to your setup.
A different feeling every time you open it.

VS CodeNative theme file

  1. Download the JSON theme file below.

  2. Create a theme extension folder with a package.json declaring this file under contributes.themes. Copy that folder to ~/.vscode/extensions (or your editor’s extensions folder).

  3. Reload your editor, open “Preferences: Color Theme”, and choose Cozy Gray Dark.

cozy-gray-dark.json
View theme file 
{
  "name": "Cozy Gray Dark",
  "type": "dark",
  "colors": {
    "editor.background": "#292827",
    "editor.foreground": "#e7e2db",
    "editorLineNumber.foreground": "#aaa39b",
    "editorLineNumber.activeForeground": "#e7e2db",
    "editorCursor.foreground": "#e6c078",
    "editor.selectionBackground": "#514941",
    "editor.lineHighlightBackground": "#33312f",
    "sideBar.background": "#33312f",
    "sideBar.foreground": "#e7e2db",
    "activityBar.background": "#33312f",
    "activityBar.foreground": "#e7e2db",
    "statusBar.background": "#33312f",
    "statusBar.foreground": "#e7e2db",
    "titleBar.activeBackground": "#33312f",
    "titleBar.activeForeground": "#e7e2db",
    "tab.activeBackground": "#292827",
    "tab.activeForeground": "#e7e2db",
    "tab.inactiveBackground": "#33312f",
    "tab.inactiveForeground": "#aaa39b",
    "terminal.background": "#292827",
    "terminal.foreground": "#e7e2db"
  },
  "tokenColors": [
    {
      "scope": [
        "comment"
      ],
      "settings": {
        "foreground": "#aaa39b"
      }
    },
    {
      "scope": [
        "keyword",
        "storage"
      ],
      "settings": {
        "foreground": "#f0ab91"
      }
    },
    {
      "scope": [
        "string"
      ],
      "settings": {
        "foreground": "#e6c078"
      }
    },
    {
      "scope": [
        "entity.name.function"
      ],
      "settings": {
        "foreground": "#f2d4a5"
      }
    },
    {
      "scope": [
        "entity.name.type",
        "support.type"
      ],
      "settings": {
        "foreground": "#dab0c5"
      }
    },
    {
      "scope": [
        "constant.numeric"
      ],
      "settings": {
        "foreground": "#f0ab91"
      }
    },
    {
      "scope": [
        "invalid"
      ],
      "settings": {
        "foreground": "#f09b9b"
      }
    }
  ]
}

A few good
questions.

Before you make yourself at home.

Is there a light version?

Yes. Cozy Gray Light uses soft stone surfaces and deeper earthy syntax colors. Both versions share the same color roles, so switching feels familiar. Try the light/dark control in the preview.

Is the theme free?

The theme files on this page are free to download. Choose your tool, pick an appearance, and save the file. No account or email address is needed.

Does it reduce blue light?

The palette avoids blue-dominant backgrounds and vivid blue syntax. A theme cannot control your display’s light emissions. For that, use your device’s night-shift or color-temperature settings.

Does it work with every tool listed?

Native files are authored for the tools marked with an arrow. Ports marked Planned currently provide the palette as a reference file. Native files still need validation inside their respective applications.

Can I make it my own?

Yes. The downloads are plain-text configuration files. Open one in your editor to adjust a background, syntax color, or accent to suit your workspace. Keep a copy of your previous settings before applying changes.

Make yourself
at home.

Your tools. A softer point of view.

Get Cozy Gray