Warped: 19 Warp Terminal Color Themes for VS Code

Warped is a VS Code extension that brings 19 color themes from Warp Terminal into Visual Studio Code. In other words, if you use Warp as your terminal emulator, you can now match your editor’s look and feel — with consistent syntax highlighting, workbench colors, and terminal ANSI palettes across both tools.

The extension includes 13 dark themes and 6 light themes, ranging from deep navy (Warp) to pure black (Warp Dark), warm earth tones (Gruvbox, Red Rock), vibrant neon (Cyber Wave, Koi), and soft pastels (Pink City, Snowy). Each theme applies full workbench theming — editor, sidebar, tabs, status bar, terminal, bracket pairs, git decorations, and diagnostics — not just syntax colors.

Warped is free, open source, and ships as a lightweight VS Code extension with zero dependencies. Install it, pick a theme, and start coding.

What Are Warp Terminal Themes?

Warp is a modern terminal emulator built in Rust. It ships with 19 bundled color themes, each defined as a YAML file containing background, foreground, accent, and 16 ANSI terminal colors (normal + bright). These themes are open source under the Apache 2.0 license.

Warped takes each of those 19 YAML definitions and converts them into VS Code color theme JSON files. The conversion preserves exact hex values for backgrounds, foregrounds, accents, and all 16 ANSI colors. Additionally, it derives 76 workbench color keys and 35 syntax highlighting scope rules from each theme’s palette — so every theme gets full editor coverage, not just terminal colors.

All 19 Themes

Warped includes 13 dark themes and 6 light themes:

Dark Themes (13)

Theme	Background	Style
Warped Warp	`#061229`	Deep navy blue — the default Warp experience
Warped Warp Dark	`#000000`	Pure black with cyan accent
Warped Cyber Wave	`#002633`	Dark teal with neon gradient vibes
Warped Dark City	`#0c252d`	Urban dark with red accent
Warped Dracula	`#282a36`	Classic Dracula purple-grey
Warped Fancy Dracula	`#252630`	Refined Dracula with pastel accents
Warped Gruvbox Dark	`#282828`	Retro warm dark with orange accent
Warped Jellyfish	`#1b1718`	Near-black with deep blue accent
Warped Koi	`#211719`	Dark burgundy with vivid red
Warped Leafy	`#000000`	Pure black with green accent
Warped Red Rock	`#342425`	Warm rust tones
Warped Solarized Dark	`#002b36`	Classic Solarized dark palette
Warped Willow Dream	`#206169`	Teal green with coral accent

Light Themes (6)

Theme	Background	Style
Warped Warp Light	`#ffffff`	Clean white with cyan accent
Warped Gruvbox Light	`#fbf1c7`	Warm cream with burnt orange
Warped Marble	`#e3e3e3`	Soft grey with subtle tones
Warped Pink City	`#fbeff6`	Blush pink with magenta accent
Warped Snowy	`#ffffff`	White with slate blue accents
Warped Solarized Light	`#fdf6e3`	Classic Solarized light palette

How Warped Converts Warp Themes

Each Warp YAML file contains a small set of base values: background color, foreground color, accent color, a details flag (darker or lighter), and 16 ANSI terminal colors (8 normal + 8 bright). From these base values, Warped derives the full VS Code theme using a Python converter script.

The conversion process handles several edge cases:

Gradient backgrounds — Six Warp themes use CSS-style gradients for their backgrounds. Since VS Code does not support gradient backgrounds, Warped uses the top color of the gradient.
Gradient accents — Three themes have gradient accent colors. Warped uses the left color.
Background images — Nine themes include background images in Warp. VS Code does not support background images natively, so these are dropped. The theme still works — it simply uses the solid background color.
Custom details — One theme (Pink City) uses a custom details mapping instead of the standard “darker” or “lighter” flag. Warped infers the correct mode from the background luminance.

Color Math: The adjust() Function

Warped uses a luminance-aware adjust() function to derive UI element colors from each theme’s base background. The function takes three parameters: a hex color, a percentage, and an is_dark boolean flag.

The logic works as follows:

If the background luminance is below 0.05 (near-black) — always lighten. This applies to 12 of 13 dark themes.
If the background luminance is above 0.95 (near-white) — always darken. This applies to Warp Light and Snowy.
Otherwise, use the is_dark flag to decide direction. This matters for 5 mid-range themes (Willow Dream, Gruvbox Light, Marble, Pink City, Solarized Light).

This approach ensures that sidebar, tab, activity bar, and status bar backgrounds are always visually distinct from the editor — even on pure black or pure white themes.

Syntax Highlighting: 7 Palette Groups

Not all 19 themes have unique syntax colors. Many Warp themes share the same ANSI palette — only their workbench colors differ. Warped preserves this relationship exactly:

Palette Group	Themes	Count
Default Dark	Warp Dark, Cyber Wave, Dark City, Jellyfish, Koi, Leafy, Red Rock, Willow Dream	8
Default Light	Warp Light, Marble, Pink City, Snowy	4
Dracula	Dracula, Fancy Dracula	2
Solarized	Solarized Dark, Solarized Light	2
Gruvbox Dark	Gruvbox Dark	1
Gruvbox Light	Gruvbox Light	1
Warp	Warp	1

Each theme includes 35 TextMate scope rules covering comments, strings, keywords, functions, variables, types, tags, CSS properties, operators, and more. Syntax highlighting uses the ANSI palette from the source YAML — so a Dracula theme in VS Code will show the same code colors as the Dracula theme in Warp Terminal.

Workbench Coverage

Each Warped theme sets 76 VS Code color keys across these areas:

Editor — background, foreground, line highlight, selection, cursor, whitespace, indent guides, line numbers
Bracket pairs — 6 colors for bracket pair colorization
Diagnostics — error (red), warning (yellow), info (blue) squiggly underlines
Activity bar — background, foreground, badge
Sidebar — background, foreground, title, section headers
Tabs — active/inactive backgrounds, tab bar
Status bar — background and foreground
Terminal — background, foreground, and all 16 ANSI colors
Inputs & dropdowns — background, foreground, border
Panels & widgets — background, border
Scrollbar — normal, hover, and active slider
Buttons & badges — focus border, button colors, progress bar
Git decorations — modified (blue), deleted (red), untracked (green), conflicting (yellow)

Installation

Install Warped from the VS Code Marketplace:

Open VS Code
Press Ctrl+P (or Cmd+P on Mac) and type ext install RenzoJohnson.warped
Press Ctrl+K Ctrl+T to open the theme picker
Select any theme starting with “Warped”

Alternatively, search for “Warped” in the Extensions sidebar.

License

The Warped extension is released under the MIT License. The original Warp Terminal color palettes are used under the Apache 2.0 License.