Add a faithful Nord (dark) theme matching the official Nord palette
- 主要语言
- 没有语言数据
- 星标
- 2.1k
- 派生
- 153
- PR 合并指标
- 30 天内没有已合并 PR
描述
### 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.
贡献指南
调研方向
payload 未指出任何实现文件或测试。首先定位主题选择器使用的内置主题定义,然后将其角色映射与所请求的官方 Nord 配色进行比较;完成标准是,可选择的深色 “Nord” 主题使用指定颜色,且不会更改 “Nord Midnight”。
由索引模型根据 Issue 内容生成。
评估
- 领域
- design, desktop
- Issue 类型
- 功能
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 活跃度
- 冷清
- 描述清晰度
- 基本清楚
- 新手友好度
- 55/100