github / github/app

Add a faithful Nord (dark) theme matching the official Nord palette

Open
#1,509 0 comments 1 reaction 0 assignees View on GitHub
Requests and ideas
Dominant language
No language data
Stars
2.1k
Forks
153
PR merge metrics
No merged PRs in 30d

Description

### Feature summary

Add a faithful **Nord (dark)** theme that matches the official Nord dark color scheme.

### What problem are you trying to solve?

The theme picker already includes a theme called **"Nord Midnight"**, but it doesn't actually match the official Nord color scheme — it's noticeably darker/bluer than real Nord and doesn't use the canonical Nord palette values. Users who love Nord (e.g. the popular VS Code Nord theme, which is the **dark** scheme) currently have no accurate option in the GitHub Copilot app, and there's no local theme file, config, or plugin hook to add one ourselves (themes are compiled into the app binary). So a built-in, true-to-palette Nord **dark** theme is the only path.

This request is specifically for the Nord **dark** scheme (the standard Nord theme with a **Polar Night** background) — not a light variant.

Reference: the official Nord theme and its exact palette are documented at **https://www.nordtheme.com/**.

### Proposed solution

Ship a new built-in **dark** theme named **"Nord"** that uses the official Nord palette exactly as published on https://www.nordtheme.com/docs/colors-and-palettes. In the dark scheme, the **Polar Night** group provides the background/surfaces and the **Snow Storm** group provides the text. The palette is four groups of named colors:

| Group | Token | Hex |
| --- | --- | --- |
| Polar Night | `nord0` | `#2E3440` |
| Polar Night | `nord1` | `#3B4252` |
| Polar Night | `nord2` | `#434C5E` |
| Polar Night | `nord3` | `#4C566A` |
| Snow Storm | `nord4` | `#D8DEE9` |
| Snow Storm | `nord5` | `#E5E9F0` |
| Snow Storm | `nord6` | `#ECEFF4` |
| Frost | `nord7` | `#8FBCBB` |
| Frost | `nord8` | `#88C0D0` |
| Frost | `nord9` | `#81A1C1` |
| Frost | `nord10` | `#5E81AC` |
| Aurora | `nord11` (red) | `#BF616A` |
| Aurora | `nord12` (orange) | `#D08770` |
| Aurora | `nord13` (yellow) | `#EBCB8B` |
| Aurora | `nord14` (green) | `#A3BE8C` |
| Aurora | `nord15` (purple) | `#B48EAD` |

**Suggested UI role mapping for the dark scheme** (the typical convention used by Nord ports such as nord-visual-studio-code — Polar Night as background, Snow Storm as text):

| Role | Nord token | Hex |
| --- | --- | --- |
| App background | `nord0` | `#2E3440` |
| Elevated surface / sidebar | `nord1` | `#3B4252` |
| Selection background | `nord2` | `#434C5E` |
| Borders / muted UI | `nord3` | `#4C566A` |
| Secondary text | `nord4` | `#D8DEE9` |
| Primary text | `nord6` | `#ECEFF4` |
| Accent / focus / links | `nord8` | `#88C0D0` |
| Primary button | `nord10` | `#5E81AC` |
| Diff added / success | `nord14` | `#A3BE8C` |
| Diff removed / error | `nord11` | `#BF616A` |
| Modified / warning | `nord13` | `#EBCB8B` |
| Renamed / info | `nord9` | `#81A1C1` |
| Conflicted | `nord12` | `#D08770` |

### Example theme contents

For convenience, here's the same dark-scheme mapping expressed as CSS custom properties, in case it helps as a starting point for the theme definition:

```css
/* Nord (dark) — official palette from https://www.nordtheme.com/ */
:root {
/* Polar Night */
--nord0: #2E3440;
--nord1: #3B4252;
--nord2: #434C5E;
--nord3: #4C566A;
/* Snow Storm */
--nord4: #D8DEE9;
--nord5: #E5E9F0;
--nord6: #ECEFF4;
/* Frost */
--nord7: #8FBCBB;
--nord8: #88C0D0;
--nord9: #81A1C1;
--nord10: #5E81AC;
/* Aurora */
--nord11: #BF616A;
--nord12: #D08770;
--nord13: #EBCB8B;
--nord14: #A3BE8C;
--nord15: #B48EAD;
}

/* Applied to UI roles — dark scheme: Polar Night background, Snow Storm text */
.theme-nord {
--background-color: var(--nord0);
--surface-color: var(--nord1);
--selection-color: var(--nord2);
--border-color: var(--nord3);

--text-color: var(--nord6);
--text-secondary-color: var(--nord4);

--accent-color: var(--nord8);
--focus-color: var(--nord8);
--link-color: var(--nord8);

--button-background: var(--nord10);
--button-hover-background: #6a8fc0; /* nord10 lightened */
--button-text-color: var(--nord6);

/* Status / diff colors */
--color-new: var(--nord14); /* added */
--color-deleted: var(--nord11); /* removed */
--color-modified: var(--nord13); /* changed */
--color-renamed: var(--nord9);
--color-conflicted: var(--nord12);
}
```

### Workflow impact

Nord is one of the most widely used color schemes in developer tooling (official ports exist for VS Code, JetBrains IDEs, Vim, terminals, etc.), and the **dark** scheme is by far the most popular variant. A lot of developers keep a consistent Nord dark look across all their tools. An accurate Nord dark option lets those users match the GitHub Copilot app to the rest of their environment, reducing visual context-switching during long sessions. It also resolves the confusion that the existing "Nord Midnight" theme creates by implying Nord support that doesn't actually match the palette.

### Additional context

- Official Nord theme website: https://www.nordtheme.com/
- Official palette reference: https://www.nordtheme.com/docs/colors-and-palettes
- Reference port for the dark-scheme role mapping: https://github.com/nordtheme/visual-studio-code
- Note: this is distinct from the existing **"Nord Midnight"** theme — the request is for a Nord **dark** theme that matches the *official* Nord palette values above.

Contributor guide

Open the contributing guide

Research direction

The payload names no implementation files or tests. First locate the built-in theme definition used by the theme picker, then compare its role mapping with the requested official Nord palette; done means a selectable dark “Nord” theme uses the specified colors and does not alter “Nord Midnight”.

Written by the indexing model from the issue text.

Assessment

Domain
design, desktop
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.