Visual Studio Code theme extension

Two dark themes for people who live in their editor.

CodeVibe Themes ships Epic and Arctic Frost — hand-mapped syntax colours, a fully themed workbench, and terminal colours that stay on-brand. Every preview on this site is rendered from the extension's own theme files, so what you see is what you install.

Install from Marketplace Try it in a real editor

version v0.1.0license MITvscode >=1.0.02 themes

palette.tsx·TypeScript Reacthighlighted by Shiki with the active theme

import { useState } from 'react';
import type { Swatch } from './types';

// The palette is the heart of a theme — keep it honest.
export function Palette({ swatches }: { swatches: Swatch[] }) {
  const [active, setActive] = useState(0);
  const current = swatches[active];

  if (!current) {
    return <p className="empty">No swatches configured.</p>;
  }

  return (
    <section className="palette" data-accent={current.hex}>
      <h2>
        {current.name} <code>{current.hex}</code>
      </h2>
      <div className="row">
        {swatches.map((s, i) => (
          <button
            key={s.hex}
            aria-pressed={i === active}
            style={{ background: s.hex }}
            onClick={() => setActive(i)}
          />
        ))}
      </div>
    </section>
  );
}

import { useState } from 'react';
import type { Swatch } from './types';

// The palette is the heart of a theme — keep it honest.
export function Palette({ swatches }: { swatches: Swatch[] }) {
  const [active, setActive] = useState(0);
  const current = swatches[active];

  if (!current) {
    return <p className="empty">No swatches configured.</p>;
  }

  return (
    <section className="palette" data-accent={current.hex}>
      <h2>
        {current.name} <code>{current.hex}</code>
      </h2>
      <div className="row">
        {swatches.map((s, i) => (
          <button
            key={s.hex}
            aria-pressed={i === active}
            style={{ background: s.hex }}
            onClick={() => setActive(i)}
          />
        ))}
      </div>
    </section>
  );
}

Or install from the terminal: code --install-extension noyonalways.codevibe-themes

Two variants

Pick a temperature, keep the craft.

Both themes get the same contrast work. They only disagree about warmth.

Epic Theme

Purple-magenta accent over a deep indigo editor.

accent: #5454bc
editor: #292d3e
status bar: #292d3e

Arctic Frost

Glacial blues over near-black navy.

accent: #4a9eff
editor: #0d0f1a
status bar: #0d0f1a

Compare both themes token by token →

What ships

The details you notice after a week.

Syntax coverage: 241 TextMate scopes mapped by hand across JavaScript, TypeScript, TSX, Python, Rust, Go, CSS, HTML, JSON, Markdown and more.
Semantic highlighting: Variables, constants and library symbols take their own colour from the language service, so structure reads before you do.
The whole workbench: 251 colour keys themed — activity bar, sidebar, tabs, breadcrumb, panel, status bar, menus, inputs and widgets.
Terminal and diffs: A full 16-colour ANSI palette per variant, plus every git decoration colour: added, modified, deleted, ignored, untracked, conflicting.
Built for long sessions: Deep, low-glare backgrounds with deliberately high-contrast foregrounds. Switch variants any time with Ctrl+K Ctrl+T.

Read the full feature list →

install.sh — terminal

Or install it from the shell.

Same extension, one command. If you would rather click than type, the Marketplace listing is two keystrokes away with Ctrl+Shift+X.

TerminalProblemsOutputDebug Consolebash

noyonalways@codevibe ~/projects$code --install-extension noyonalways.codevibe-themes

Installing extensions...

Extension 'noyonalways.codevibe-themes' v0.1.0 was successfully installed.

noyonalways@codevibe ~/projects$▍

01Open the Extensions view with Ctrl+Shift+X.
02Search CodeVibe Themes by noyonalways and select Install.
03Run Preferences: Color Theme and pick CodeVibe - Epic or Arctic Frost.

Open the Marketplace listing