+ Shared neutrals that define the layout, surfaces, borders, and most of the
+ typography.
+
+
+
+
+ #f0f4f8 coldark07
+
+
+
+ #e3eaf2 coldark00 / coldark05
+
+
+
+ #d0dae7 coldark01 / coldark04
+
+
+
+ #8da1b9 coldark02 / coldark03
+
+
+
+ #3c526d coldark03 / coldark02
+
+
+
+ #213043 coldark04 / coldark01
+
+
+
+ #111b27 coldark05 / coldark00
+
+
+
+ #0b121b coldark06 / coldark07
+
+
+
+
+
Coldark Cold accents
+
+
+
+ #006d6d coldark08
+
+
+
+ #755f00 coldark09
+
+
+
+ #005a8e coldark10
+
+
+
+ #116b00 coldark11
+
+
+
+ #af00af coldark12
+
+
+
+ #7c00aa coldark13
+
+
+
+ #a04900 coldark14
+
+
+
+ #c22f2e coldark15
+
+
+
+
+
Coldark Dark accents
+
+
+
+ #66cccc coldark08
+
+
+
+ #e6d37a coldark09
+
+
+
+ #6cb8e6 coldark10
+
+
+
+ #91d076 coldark11
+
+
+
+ #f4adf4 coldark12
+
+
+
+ #c699e3 coldark13
+
+
+
+ #e9ae7e coldark14
+
+
+
+ #cd6660 coldark15
+
+
+
+
+
+## Coldark Cold
+
+| Token | Hex | Role |
+| ----------- | --------- | -------------------------------------------------------------------------------------- |
+| `coldark00` | `#e3eaf2` | Default background. Also used as foreground for buttons and badges. |
+| `coldark01` | `#d0dae7` | Darker background for editor gutter, inputs, line highlight, and neutral status areas. |
+| `coldark02` | `#8da1b9` | Selection background, secondary buttons, and some borders. |
+| `coldark03` | `#3c526d` | Comments, placeholders, and subdued text. |
+| `coldark04` | `#213043` | Light foreground for widgets, inputs, and embedded UI. |
+| `coldark05` | `#111b27` | Default foreground and core punctuation color. |
+| `coldark06` | `#0b121b` | Dark foreground and activity bar background. |
+| `coldark07` | `#f0f4f8` | Light background for active tabs, widgets, and embedded panels. |
+| `coldark08` | `#006d6d` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
+| `coldark09` | `#755f00` | Yellow for modified states, hints, booleans, and attribute names. |
+| `coldark10` | `#005a8e` | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark11` | `#116b00` | Green for additions, strings, CSS colors, and link text. |
+| `coldark12` | `#af00af` | Magenta for untracked states, regex, escapes, and CSS values. |
+| `coldark13` | `#7c00aa` | Purple for functions and CSS classes or IDs. |
+| `coldark14` | `#a04900` | Orange for warnings, keywords, storage, and pseudo-elements. |
+| `coldark15` | `#c22f2e` | Red for errors, deletions, invalid states, and deprecated items. |
+
+## Coldark Dark
+
+| Token | Hex | Role |
+| ----------- | --------- | ---------------------------------------------------------------------- |
+| `coldark00` | `#111b27` | Default background. Also used as foreground for buttons and badges. |
+| `coldark01` | `#213043` | Light background for widgets, highlights, and embedded panels. |
+| `coldark02` | `#3c526d` | Selection background, secondary buttons, and soft highlights. |
+| `coldark03` | `#8da1b9` | Comments, placeholders, and subdued text. |
+| `coldark04` | `#d0dae7` | Dark foreground for activity bar, inputs, and embedded UI. |
+| `coldark05` | `#e3eaf2` | Default foreground and core punctuation color. |
+| `coldark06` | `#f0f4f8` | Light foreground for menus and hover states. |
+| `coldark07` | `#0b121b` | Deep background for activity bars, gutters, borders, and status areas. |
+| `coldark08` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
+| `coldark09` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
+| `coldark10` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark11` | `#91d076` | Green for additions, strings, CSS colors, and link text. |
+| `coldark12` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
+| `coldark13` | `#c699e3` | Purple for functions and CSS classes or IDs. |
+| `coldark14` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
+| `coldark15` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
+
+## Source of truth
+
+This page is based on the color definitions from:
+
+- `packages/coldark-vscode/themes/coldark-light-color-theme.json`
+- `packages/coldark-vscode/themes/coldark-dark-color-theme.json`
+- the root `README.md`
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
new file mode 100644
index 0000000..1549f40
--- /dev/null
+++ b/website/src/content/docs/index.mdx
@@ -0,0 +1,80 @@
+---
+title: Coldark
+description: Discover the Coldark theme, its accessible blue-grey palettes, and every available variant.
+template: splash
+hero:
+ tagline: A blue-grey theme with light and dark versions, designed for comfortable reading across and declined for editors, terminals, browsers, and developer tools.
+ image:
+ file: ../../assets/coldark-banner.svg
+ actions:
+ - text: Discover Coldark
+ link: /why-coldark/
+ icon: right-arrow
+ - text: Explore the colors
+ link: /colors/
+ icon: right-arrow
+ - text: Browse variants
+ link: /variants/coldark-vscode/
+ icon: right-arrow
+ - text: View on GitHub
+ link: https://github.com/ArmandPhilippot/coldark
+ icon: external
+---
+
+import { Card, CardGrid } from "@astrojs/starlight/components";
+
+## Why Coldark?
+
+
+
+ Coldark is built around a shared blue-grey foundation with dedicated accent
+ palettes for cold and dark environments.
+
+
+ The project aims for comfortable contrast and a consistent visual language
+ across every package.
+
+
+ Coldark ships as a lighter “Cold” version and a darker “Dark” version, each
+ reusing the same semantic structure.
+
+
+ The palette already powers VS Code, bat, Firefox, Prism, GTKSourceView,
+ dircolors, and XFCE4 Terminal variants.
+
+
+
+## Available variants
+
+
+
+ The reference implementation of the Coldark palette for Visual Studio Code.
+
+
+ A web-friendly syntax highlighting theme for Prism.js.
+
+
+ A browser theme that follows the system preference and supports manual
+ switching.
+
+
+ Terminal syntax highlighting for bat with cold and dark variants.
+
+
+ File-type coloring for shells and tools that use `LS_COLORS`.
+
+
+ Editor themes for GTK-based applications like Mousepad and Gedit.
+
+
+ Terminal presets tailored for the XFCE4 terminal.
+
+
diff --git a/website/src/content/docs/variants/coldark-bat.md b/website/src/content/docs/variants/coldark-bat.md
new file mode 100644
index 0000000..137ef0d
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-bat.md
@@ -0,0 +1,72 @@
+---
+title: bat
+description: Coldark syntax highlighting themes for bat.
+---
+
+Coldark for bat brings the project to the terminal with two syntax themes that match the Cold and Dark variants.
+
+## Highlights
+
+- Designed for [bat](https://github.com/sharkdp/bat).
+- Ships `Coldark-Cold` and `Coldark-Dark`.
+- Great fit for terminals that already use other Coldark variants.
+
+## Colors
+
+The bat variant reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](/colors/) page.
+
+### Coldark Cold
+
+| Hex | Typical role |
+| --- | --- |
+| `#e3eaf2` | Background contrast and bright text support |
+| `#d0dae7` | Secondary background surfaces |
+| `#111b27` | Main foreground |
+| `#3c526d` | Comments and subdued text |
+| `#005a8e` | Classes, variables, headings, and prominent syntax |
+| `#006d6d` | Parameters, tags, and embedded punctuation |
+| `#116b00` | Strings and additions |
+| `#755f00` | Numbers, booleans, hints, and modified states |
+| `#af00af` | Regex, escapes, and value-like tokens |
+| `#7c00aa` | Functions and selectors |
+| `#a04900` | Keywords and warnings |
+| `#c22f2e` | Errors and invalid tokens |
+
+### Coldark Dark
+
+| Hex | Typical role |
+| --- | --- |
+| `#111b27` | Main background |
+| `#213043` | Secondary background |
+| `#e3eaf2` | Main foreground |
+| `#8da1b9` | Comments and subdued text |
+| `#0b121b` | Deep background accents |
+| `#6cb8e6` | Classes, variables, headings, and prominent syntax |
+| `#66cccc` | Parameters, tags, and embedded punctuation |
+| `#91d076` | Strings and additions |
+| `#e6d37a` | Numbers, booleans, hints, and modified states |
+| `#f4adf4` | Regex, escapes, and value-like tokens |
+| `#c699e3` | Functions and selectors |
+| `#e9ae7e` | Keywords and warnings |
+| `#cd6660` | Errors and invalid tokens |
+
+## Installation
+
+1. Create the bat themes directory with `mkdir -p "$(bat --config-dir)/themes"`.
+2. Copy the package contents into that folder.
+3. Rebuild the bat cache with `bat cache --build`.
+4. Verify the themes are available with `bat --list-themes`.
+
+## Activation
+
+Use one of the themes on demand:
+
+```sh
+bat --theme="Coldark-Cold"
+```
+
+Or make it the default in your shell config:
+
+```sh
+export BAT_THEME="Coldark-Dark"
+```
diff --git a/website/src/content/docs/variants/coldark-dircolors.md b/website/src/content/docs/variants/coldark-dircolors.md
new file mode 100644
index 0000000..8e594be
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-dircolors.md
@@ -0,0 +1,45 @@
+---
+title: Dircolors
+description: Coldark file-type coloring for shells and tools using LS_COLORS.
+---
+
+Coldark dircolors applies the palette to file listings and works especially well alongside the XFCE4 Terminal variant.
+
+## Highlights
+
+- Designed for tools that read the `LS_COLORS` environment variable.
+- Covers directories, symlinks, executables, archives, images, media files, and more.
+- Reuses semantic Coldark colors like blue for directories, green for writable paths and documents, and red for errors or broken targets.
+
+## Colors
+
+Dircolors maps a smaller set of semantic Coldark colors to file kinds and shell states.
+
+| Token | Meaning in this package |
+| --- | --- |
+| `coldark00` | Foreground for sticky other writable directories and ignored files such as `.log` or `.bak` |
+| `coldark05` | Foreground for missing files, setuid or setgid files, files with capability, and sticky not other writable directories |
+| `coldark08` | Foreground for symbolic links, multi-link regular files, pipes, and audio files |
+| `coldark09` | Foreground for sockets, block devices, character devices, and video files |
+| `coldark10` | Foreground for directories and background for sticky not other writable directories |
+| `coldark11` | Foreground for other writable directories, archives, and many documents, plus background for sticky other writable directories |
+| `coldark12` | Foreground for doors and images |
+| `coldark15` | Foreground for orphaned symbolic links and executables, plus background for missing files |
+
+## Installation
+
+Download the `dir_colors` file from this package and place it at `~/.dir_colors`.
+
+## Activation
+
+Load it from your shell startup file:
+
+```sh
+eval "$(dircolors ~/.dir_colors)"
+```
+
+If you use Oh My Zsh, you can also sync completion colors:
+
+```sh
+zstyle ':completion:*:default' list-colors "$LS_COLORS"
+```
diff --git a/website/src/content/docs/variants/coldark-firefox.md b/website/src/content/docs/variants/coldark-firefox.md
new file mode 100644
index 0000000..3763077
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-firefox.md
@@ -0,0 +1,53 @@
+---
+title: Firefox
+description: Coldark for Firefox, with automatic dark preference detection and manual switching.
+---
+
+Coldark for Firefox adapts the palette to browser chrome and focuses on the parts of Firefox that are themeable today.
+
+## Highlights
+
+- Detects the user's preferred dark mode and applies the matching version automatically.
+- Lets users switch between variants from a toolbar icon.
+- Supports a keyboard shortcut to toggle the theme.
+
+## Palette scope
+
+Firefox only exposes a smaller theming surface than editors like VS Code, so this variant uses a reduced subset of the full Coldark palette. It focuses on frames, toolbars, selected tabs, fields, icons, and highlight states.
+
+## Colors
+
+### Coldark Cold
+
+| Token | Hex | Role |
+| --- | --- | --- |
+| `coldark00` | `#e3eaf2` | Default background for frame, new tab page, and fields |
+| `coldark01` | `#d0dae7` | Dark background for selected tab, toolbar, and sidebar |
+| `coldark02` | `#8da1b9` | Darker background for inactive frame, highlight, and borders |
+| `coldark04` | `#213043` | Lighter foreground for icons, new tab page, popup, highlight, fields, and inactive tab |
+| `coldark05` | `#111b27` | Default foreground for selected tab and toolbar |
+| `coldark07` | `#f0f4f8` | Lighter background for popup, focused fields, and button states |
+| `coldark10` | `#005a8e` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
+
+### Coldark Dark
+
+| Token | Hex | Role |
+| --- | --- | --- |
+| `coldark00` | `#111b27` | Default background for frame, new tab page, and fields |
+| `coldark01` | `#213043` | Light background for selected tab, toolbar, and sidebar |
+| `coldark02` | `#3c526d` | Lighter background for popup, focused fields, and button states |
+| `coldark04` | `#d0dae7` | Dark foreground for icons, new tab page, popup, highlight, fields, and inactive tab |
+| `coldark05` | `#e3eaf2` | Default foreground for selected tab and toolbar |
+| `coldark07` | `#0b121b` | Dark background for inactive frame, highlight, and borders |
+| `coldark10` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
+
+## Installation
+
+1. Download the latest `.xpi` from the `web-ext-artifacts` directory in this package.
+2. Open `about:addons` in Firefox.
+3. Use the add-ons gear menu and choose **Install Add-on From File...**
+4. Select the downloaded Coldark package.
+
+## Notes
+
+Some browser surfaces, such as a few hover states or parts of the new tab page, are not fully customizable in Firefox themes.
diff --git a/website/src/content/docs/variants/coldark-gtksourceview.md b/website/src/content/docs/variants/coldark-gtksourceview.md
new file mode 100644
index 0000000..8a42226
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-gtksourceview.md
@@ -0,0 +1,42 @@
+---
+title: GTKSourceView
+description: Coldark themes for GTKSourceView-based editors such as Mousepad and Gedit.
+---
+
+This variant adapts Coldark to GTKSourceView and targets editors such as Mousepad and Gedit.
+
+## Highlights
+
+- Ships both `coldark-cold.xml` and `coldark-dark.xml`.
+- Designed to stay visually close to the VS Code theme.
+- Works with GTKSourceView-based editors and should be compatible with multiple GTKSourceView versions.
+
+## Colors
+
+GTKSourceView keeps close to the shared Coldark palette and uses more of the neutral surface colors than terminal-oriented variants do.
+
+### Coldark Cold
+
+This theme uses the common shades `#f0f4f8`, `#e3eaf2`, `#d0dae7`, `#8da1b9`, `#3c526d`, `#213043`, `#111b27`, and `#0b121b`, plus the cold accents `#005a8e`, `#006d6d`, `#116b00`, `#755f00`, `#af00af`, `#7c00aa`, `#a04900`, and `#c22f2e`.
+
+### Coldark Dark
+
+This theme uses the common shades `#f0f4f8`, `#e3eaf2`, `#d0dae7`, `#8da1b9`, `#3c526d`, `#213043`, `#111b27`, and `#0b121b`, plus the dark accents `#6cb8e6`, `#66cccc`, `#91d076`, `#e6d37a`, `#f4adf4`, `#c699e3`, `#e9ae7e`, and `#cd6660`.
+
+## Installation
+
+For Mousepad:
+
+1. Create `~/.local/share/gtksourceview-4/styles/` if needed.
+2. Copy the Coldark XML styles into that directory.
+3. Reopen Mousepad and select the theme from the color scheme menu.
+
+For Gedit:
+
+1. Create `~/.local/share/gedit/styles/` if needed.
+2. Copy the Coldark XML styles into that directory.
+3. Reopen Gedit and select the scheme in **Preferences**.
+
+## Notes
+
+GTKSourceView exposes fewer token categories than VS Code, so some mappings are simplified.
diff --git a/website/src/content/docs/variants/coldark-prism.md b/website/src/content/docs/variants/coldark-prism.md
new file mode 100644
index 0000000..302e4cd
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-prism.md
@@ -0,0 +1,62 @@
+---
+title: Prism
+description: Coldark syntax highlighting for Prism.js.
+---
+
+Coldark Prism brings the same blue-grey language to Prism.js with a cold and a dark stylesheet.
+
+## Highlights
+
+- Built for [Prism.js](https://prismjs.com/).
+- Offers both `prism-coldark-cold.css` and `prism-coldark-dark.css`.
+- Stays visually close to the VS Code variant while adapting to Prism's token set.
+
+## Colors
+
+Prism uses a syntax-focused subset of the Coldark palettes. It keeps the main foreground, comment, and accent colors, while skipping many interface-specific colors that only exist in editors.
+
+### Coldark Cold
+
+| Hex | Typical role |
+| --- | --- |
+| `#e3eaf2` | Background contrast and bright text support |
+| `#d0dae7` | Secondary surfaces |
+| `#111b27` | Main code foreground |
+| `#8da1b9` | Secondary emphasis and soft highlights |
+| `#3c526d` | Comments |
+| `#005a8e` | Names, classes, and strong accents |
+| `#006d6d` | Tags and embedded punctuation |
+| `#116b00` | Strings |
+| `#755f00` | Numbers and booleans |
+| `#af00af` | Regex, escapes, and special values |
+| `#7c00aa` | Functions and selectors |
+| `#a04900` | Keywords |
+| `#c22f2e` | Errors and invalid tokens |
+
+### Coldark Dark
+
+| Hex | Typical role |
+| --- | --- |
+| `#111b27` | Background |
+| `#0b121b` | Deeper surface contrast |
+| `#e3eaf2` | Main code foreground |
+| `#8da1b9` | Comments and subdued text |
+| `#3c526d` | Secondary surfaces and soft highlights |
+| `#6cb8e6` | Names, classes, and strong accents |
+| `#66cccc` | Tags and embedded punctuation |
+| `#91d076` | Strings |
+| `#e6d37a` | Numbers and booleans |
+| `#f4adf4` | Regex, escapes, and special values |
+| `#c699e3` | Functions and selectors |
+| `#e9ae7e` | Keywords |
+| `#cd6660` | Errors and invalid tokens |
+
+## Installation
+
+1. Download Prism from the [official website](https://prismjs.com/) with the languages and plugins you need.
+2. Copy `prism-coldark-cold.css` and/or `prism-coldark-dark.css` from this package into your project.
+3. Include the Prism JavaScript file and the selected Coldark stylesheet in your page.
+
+## Notes
+
+The Prism token model is less comprehensive than VS Code's, so some mappings are necessarily approximate.
diff --git a/website/src/content/docs/variants/coldark-vscode.md b/website/src/content/docs/variants/coldark-vscode.md
new file mode 100644
index 0000000..9bd3108
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-vscode.md
@@ -0,0 +1,99 @@
+---
+title: VS Code
+description: The reference Coldark implementation for Visual Studio Code.
+---
+
+Coldark for VS Code is the reference implementation of the theme. It defines the shared semantic palette used across the rest of the project and ships both **Coldark Cold** and **Coldark Dark**.
+
+## Highlights
+
+- Designed for Visual Studio Code, Code - OSS, and VSCodium.
+- Uses the full Coldark palette with dedicated light and dark theme files.
+- Aims for comfortable contrast while keeping a cohesive blue-grey look.
+
+## Available themes
+
+- `Coldark - Cold`
+- `Coldark - Dark`
+
+## Colors
+
+This package is the reference implementation for Coldark. The main [Colors](/colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code variant.
+
+### Coldark Cold
+
+| Token | Hex | Role |
+| --- | --- | --- |
+| `coldark00` | `#e3eaf2` | Default background. Also used as foreground for button and badges |
+| `coldark01` | `#d0dae7` | Dark background for editor gutter, inputs, line highlight, status bar without folder, and no-tabs layout. Also used as activity bar foreground |
+| `coldark02` | `#8da1b9` | Selection background, code blocks, secondary buttons, and borders |
+| `coldark03` | `#3c526d` | Comments, invisible text, ignored items, and placeholders |
+| `coldark04` | `#213043` | Light foreground for inputs, status bar without folder, embedded modals, and widgets |
+| `coldark05` | `#111b27` | Default foreground, shadow, and most punctuation |
+| `coldark06` | `#0b121b` | Dark foreground and activity bar background |
+| `coldark07` | `#f0f4f8` | Light background for active tabs, embedded modals, and widgets |
+| `coldark08` | `#006d6d` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark09` | `#755f00` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
+| `coldark10` | `#005a8e` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark11` | `#116b00` | Green for additions, strings, CSS colors, CSS font names, and link text |
+| `coldark12` | `#af00af` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+| `coldark13` | `#7c00aa` | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark14` | `#a04900` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark15` | `#c22f2e` | Red for errors, deletions, invalid states, and deprecated items |
+
+### Coldark Dark
+
+| Token | Hex | Role |
+| --- | --- | --- |
+| `coldark00` | `#111b27` | Default background. Also used as foreground for button and badges |
+| `coldark01` | `#213043` | Light background for embedded modals, widgets, line highlight, and active tabs |
+| `coldark02` | `#3c526d` | Selection background, code blocks, secondary buttons, and some highlighting |
+| `coldark03` | `#8da1b9` | Comments, invisible text, ignored items, and placeholders |
+| `coldark04` | `#d0dae7` | Dark foreground for activity bar, inputs, status bar without folder, embedded modals, and widgets |
+| `coldark05` | `#e3eaf2` | Default foreground and most punctuation |
+| `coldark06` | `#f0f4f8` | Light foreground for menus and tab hover states |
+| `coldark07` | `#0b121b` | Dark background for activity bar, inputs, status bar without folder, editor gutter, no-tabs layout, and borders |
+| `coldark08` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark09` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
+| `coldark10` | `#6cb8e6` | Primary interactive accent in both variants. Reused for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark11` | `#91d076` | Green for additions, strings, CSS colors, CSS font names, and link text |
+| `coldark12` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+| `coldark13` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark14` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark15` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
+
+## Implementation notes
+
+The current VS Code theme files confirm a few useful maintenance patterns:
+
+- `coldark02` and `coldark03` intentionally swap emphasis between the two variants: in the cold theme, `coldark02` is the stronger selection surface and `coldark03` is the subdued comment color; in the dark theme, that relationship stays the same semantically, but the values move upward in brightness.
+- `coldark07` is one of the most structurally important differences between the variants. In Coldark Cold it is a lighter surface color for active tabs and widgets, while in Coldark Dark it becomes the deepest structural background used for borders, gutters, and other heavy UI chrome.
+- `coldark06` is not symmetrical either. In Coldark Cold it behaves like a darker foreground and activity-bar background, while in Coldark Dark it is a lighter foreground mainly used for menus and hover states.
+
+## Syntax highlighting patterns
+
+Looking at `tokenColors` specifically, the theme strongly favors the same accent trio in both variants:
+
+- blue is the main structural syntax accent for classes, variables, properties, and headings
+- cyan is heavily used for parameters, tags, support constants, and embedded punctuation
+- magenta covers regex, escape sequences, special values, and other high-visibility token categories
+
+That pattern is helpful when adding new scopes: if a new token feels like a name or navigational target, it usually belongs near blue; if it behaves like embedded syntax or tag structure, cyan is often the better fit; if it represents a special value or escape-like construct, magenta is usually consistent with the existing grammar.
+
+## Maintenance checklist
+
+When updating the VS Code theme, these are good things to verify:
+
+- keep semantic pairs aligned between `coldark-light-color-theme.json` and `coldark-dark-color-theme.json`
+- check both `colors` and `tokenColors`, because a color can be consistent in the UI layer but drift in syntax scopes
+- review opacity-based surfaces separately, since they are the most likely places for contrast regressions
+- test at least one file with markup, one stylesheet, and one programming language before considering a palette change complete
+
+## Installation
+
+Install the extension from either marketplace:
+
+- [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=ArmandPhilippot.coldark-vscode)
+- [Open VSX Registry](https://open-vsx.org/extension/armandphilippot/coldark-vscode)
+
+Then search for `Coldark` in the extensions view and select the variant you want in the theme picker.
diff --git a/website/src/content/docs/variants/coldark-xfce4-terminal.md b/website/src/content/docs/variants/coldark-xfce4-terminal.md
new file mode 100644
index 0000000..85e2294
--- /dev/null
+++ b/website/src/content/docs/variants/coldark-xfce4-terminal.md
@@ -0,0 +1,36 @@
+---
+title: XFCE4 Terminal
+description: Coldark terminal presets for XFCE4 Terminal.
+---
+
+Coldark for XFCE4 Terminal brings the palette to terminal surfaces with dedicated presets for both main variants.
+
+## Highlights
+
+- Designed for [XFCE4 Terminal](https://gitlab.xfce.org/apps/xfce4-terminal).
+- Ships `coldark-cold.theme` and `coldark-dark.theme`.
+- Uses a reduced terminal-friendly subset of the full Coldark color system.
+
+## Colors
+
+The XFCE4 Terminal variant uses a compact subset of the Coldark palettes. Compared with VS Code, it keeps fewer semantic accents and focuses on the colors that matter most in a terminal palette.
+
+### Coldark Cold
+
+This preset uses `#e3eaf2`, `#111b27`, `#0b121b`, `#d0dae7`, `#8da1b9`, and `#3c526d` for terminal surfaces and neutral text, then adds `#005a8e`, `#006d6d`, `#116b00`, `#755f00`, `#af00af`, and `#c22f2e` for the terminal accent slots.
+
+### Coldark Dark
+
+This preset uses `#111b27`, `#e3eaf2`, `#f0f4f8`, `#8da1b9`, and `#3c526d` for terminal surfaces and neutral text, then adds `#6cb8e6`, `#66cccc`, `#91d076`, `#e6d37a`, `#f4adf4`, and `#cd6660` for the terminal accent slots.
+
+## Installation
+
+1. Create `~/.local/share/xfce4/terminal/colorschemes/` if needed.
+2. Copy `coldark-cold.theme` and/or `coldark-dark.theme` into that directory.
+
+## Activation
+
+1. Open XFCE4 Terminal.
+2. Go to **Edit** > **Preferences**.
+3. Open the **Colors** tab.
+4. Load either **Coldark - Cold** or **Coldark - Dark** from the presets menu.
diff --git a/website/src/content/docs/why-coldark.mdx b/website/src/content/docs/why-coldark.mdx
new file mode 100644
index 0000000..686e04b
--- /dev/null
+++ b/website/src/content/docs/why-coldark.mdx
@@ -0,0 +1,8 @@
+---
+title: Why Coldark?
+description: Discover the philosophy behind Coldark.
+sidebar:
+ order: 2
+---
+
+TODO.
diff --git a/website/src/styles/coldark.css b/website/src/styles/coldark.css
new file mode 100644
index 0000000..d3fa110
--- /dev/null
+++ b/website/src/styles/coldark.css
@@ -0,0 +1,188 @@
+@layer starlight, theme, utilities;
+
+@layer theme {
+ :root,
+ ::backdrop {
+ --sl-color-white: #f0f4f8;
+ --sl-color-gray-1: #e3eaf2;
+ --sl-color-gray-2: #d0dae7;
+ --sl-color-gray-3: #8da1b9;
+ --sl-color-gray-4: #3c526d;
+ --sl-color-gray-5: #213043;
+ --sl-color-gray-6: #111b27;
+ --sl-color-black: #0b121b;
+
+ --sl-color-accent-low: #213043;
+ --sl-color-accent: #6cb8e6;
+ --sl-color-accent-high: #d0dae7;
+
+ --sl-color-blue-low: #213043;
+ --sl-color-blue: #6cb8e6;
+ --sl-color-blue-high: #d0dae7;
+ --sl-color-green-low: #213043;
+ --sl-color-green: #91d076;
+ --sl-color-green-high: #d0dae7;
+ --sl-color-orange-low: #213043;
+ --sl-color-orange: #e9ae7e;
+ --sl-color-orange-high: #f0f4f8;
+ --sl-color-purple-low: #213043;
+ --sl-color-purple: #c699e3;
+ --sl-color-purple-high: #f0f4f8;
+ --sl-color-red-low: #213043;
+ --sl-color-red: #cd6660;
+ --sl-color-red-high: #f0f4f8;
+
+ --sl-color-text: #d0dae7;
+ --sl-color-text-accent: #e3eaf2;
+ --sl-color-text-invert: #111b27;
+ --sl-color-bg: #111b27;
+ --sl-color-bg-nav: #0b121b;
+ --sl-color-bg-sidebar: #0b121b;
+ --sl-color-bg-inline-code: rgb(33 48 67 / 70%);
+ --sl-color-bg-accent: #6cb8e6;
+ --sl-color-hairline-light: rgb(141 161 185 / 30%);
+ --sl-color-hairline: rgb(11 18 27 / 90%);
+ --sl-color-hairline-shade: #0b121b;
+ --sl-color-backdrop-overlay: rgb(11 18 27 / 70%);
+ --sl-shadow-md: 0 18px 40px rgb(0 0 0 / 28%);
+ --sl-shadow-lg: 0 24px 64px rgb(0 0 0 / 40%);
+ }
+
+ :root[data-theme="light"],
+ [data-theme="light"] ::backdrop {
+ --sl-color-white: #111b27;
+ --sl-color-gray-1: #213043;
+ --sl-color-gray-2: #3c526d;
+ --sl-color-gray-3: #8da1b9;
+ --sl-color-gray-4: #d0dae7;
+ --sl-color-gray-5: #e3eaf2;
+ --sl-color-gray-6: #f0f4f8;
+ --sl-color-gray-7: #f8fbfe;
+ --sl-color-black: #ffffff;
+
+ --sl-color-accent-high: #005a8e;
+ --sl-color-accent: #005a8e;
+ --sl-color-accent-low: #d0dae7;
+
+ --sl-color-blue-high: #005a8e;
+ --sl-color-blue: #005a8e;
+ --sl-color-blue-low: #d0dae7;
+ --sl-color-green-high: #116b00;
+ --sl-color-green: #116b00;
+ --sl-color-green-low: #dbe8d8;
+ --sl-color-orange-high: #a04900;
+ --sl-color-orange: #a04900;
+ --sl-color-orange-low: #f3e2d3;
+ --sl-color-purple-high: #7c00aa;
+ --sl-color-purple: #7c00aa;
+ --sl-color-purple-low: #eddcf5;
+ --sl-color-red-high: #c22f2e;
+ --sl-color-red: #c22f2e;
+ --sl-color-red-low: #f6dddd;
+
+ --sl-color-text: #213043;
+ --sl-color-text-accent: #005a8e;
+ --sl-color-text-invert: #e3eaf2;
+ --sl-color-bg: #e3eaf2;
+ --sl-color-bg-nav: #f0f4f8;
+ --sl-color-bg-sidebar: #e3eaf2;
+ --sl-color-bg-inline-code: rgb(208 218 231 / 80%);
+ --sl-color-bg-accent: #005a8e;
+ --sl-color-hairline-light: rgb(141 161 185 / 50%);
+ --sl-color-hairline: rgb(141 161 185 / 70%);
+ --sl-color-hairline-shade: rgb(141 161 185 / 40%);
+ --sl-color-backdrop-overlay: rgb(60 82 109 / 42%);
+ --sl-shadow-md: 0 18px 40px rgb(17 27 39 / 10%);
+ --sl-shadow-lg: 0 24px 64px rgb(17 27 39 / 14%);
+ }
+
+ .hero-banner {
+ margin: 2rem 0 0;
+ padding: 1rem 0 0;
+ }
+
+ .hero-banner img {
+ width: min(100%, 44rem);
+ display: block;
+ margin: 0 auto;
+ filter: drop-shadow(0 16px 32px rgb(0 0 0 / 18%));
+ }
+
+ .palette-grid {
+ display: grid;
+ gap: 1rem;
+ grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
+ margin: 1.5rem 0 2rem;
+ }
+
+ .palette-card {
+ padding: 1rem 1rem 0.75rem;
+ border: 1px solid var(--sl-color-hairline-light);
+ border-radius: 1rem;
+ background:
+ linear-gradient(180deg, rgb(108 184 230 / 8%), transparent 45%),
+ var(--sl-color-bg-nav);
+ box-shadow: var(--sl-shadow-md);
+ }
+
+ .palette-card h3 {
+ margin-top: 0;
+ }
+
+ .swatch-list {
+ list-style: none;
+ padding: 0;
+ margin: 0.75rem 0 0;
+ }
+
+ .swatch-list li {
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ padding: 0.4rem 0;
+ font-size: 0.95rem;
+ }
+
+ .swatch {
+ --swatch: #6cb8e6;
+ width: 1.1rem;
+ height: 1.1rem;
+ border-radius: 999px;
+ background: var(--swatch);
+ box-shadow: inset 0 0 0 1px rgb(0 0 0 / 18%);
+ flex: none;
+ }
+
+ .sl-markdown-content a:not(.card) {
+ text-decoration-thickness: 0.08em;
+ }
+
+ .card {
+ background:
+ radial-gradient(
+ circle at top right,
+ rgb(108 184 230 / 10%),
+ transparent 35%
+ ),
+ linear-gradient(180deg, rgb(240 244 248 / 2%), transparent),
+ var(--sl-color-bg-nav);
+ border-radius: 1rem;
+ }
+
+ [data-theme="light"] .card,
+ [data-theme="light"] .palette-card {
+ background:
+ radial-gradient(
+ circle at top right,
+ rgb(0 90 142 / 10%),
+ transparent 35%
+ ),
+ linear-gradient(180deg, rgb(255 255 255 / 65%), transparent),
+ var(--sl-color-bg-nav);
+ }
+
+ .site-title {
+ letter-spacing: 0.02em;
+ font-weight: 700;
+ }
+}
diff --git a/website/tsconfig.json b/website/tsconfig.json
new file mode 100644
index 0000000..8bf91d3
--- /dev/null
+++ b/website/tsconfig.json
@@ -0,0 +1,5 @@
+{
+ "extends": "astro/tsconfigs/strict",
+ "include": [".astro/types.d.ts", "**/*"],
+ "exclude": ["dist"]
+}
From 327730f8b8076c0e8645aa2cf564d788982b6c7a Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Thu, 26 Mar 2026 00:30:59 +0100
Subject: [PATCH 02/23] feat: add a workflow to deploy to GitHub Pages
---
.github/workflows/deploy-pages.yml | 75 +++++++++++++++++++
package.json | 1 +
website/astro.config.mjs | 2 +
website/src/content/docs/index.mdx | 20 ++---
.../src/content/docs/variants/coldark-bat.md | 2 +-
.../content/docs/variants/coldark-vscode.md | 2 +-
6 files changed, 90 insertions(+), 12 deletions(-)
create mode 100644 .github/workflows/deploy-pages.yml
diff --git a/.github/workflows/deploy-pages.yml b/.github/workflows/deploy-pages.yml
new file mode 100644
index 0000000..0c5b32e
--- /dev/null
+++ b/.github/workflows/deploy-pages.yml
@@ -0,0 +1,75 @@
+name: Deploy Website
+
+permissions:
+ contents: read
+ pages: write
+ id-token: write
+
+on:
+ push:
+ branches:
+ - main
+ paths:
+ - ".github/workflows/deploy-pages.yml"
+ - "package.json"
+ - "pnpm-lock.yaml"
+ - "pnpm-workspace.yaml"
+ - "website/**"
+ workflow_dispatch:
+
+defaults:
+ run:
+ shell: bash
+
+env:
+ CI: true
+ FORCE_COLOR: true
+
+concurrency:
+ group: deploy-pages
+ cancel-in-progress: true
+
+jobs:
+ build:
+ name: Build Website
+ runs-on: ubuntu-latest
+ timeout-minutes: 15
+ steps:
+ - name: Checkout Repo
+ uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+ - name: Setup pnpm
+ uses: pnpm/action-setup@41ff72655975bd51cab0327fa583b6e92b6d3061 # v4.2.0
+
+ - name: Install Node.js
+ uses: actions/setup-node@53b83947a5a98c8d113130e565377fae1a50d02f # v6.3.0
+ with:
+ cache: pnpm
+ node-version: 24.14.0
+
+ - name: Configure GitHub Pages
+ uses: actions/configure-pages@983d7736d9b0ae728b81ab479565c72886d7745b # v5.0.0
+
+ - name: Install dependencies
+ run: pnpm i --frozen-lockfile
+
+ - name: Build website
+ run: pnpm run website:build
+
+ - name: Upload Pages artifact
+ uses: actions/upload-pages-artifact@56afc609e74202658d3ffba0e8f6dda462b719fa # v4.0.0
+ with:
+ path: website/dist
+
+ deploy:
+ name: Deploy Website
+ needs: build
+ runs-on: ubuntu-latest
+ timeout-minutes: 10
+ environment:
+ name: github-pages
+ url: ${{ steps.deployment.outputs.page_url }}
+ steps:
+ - name: Deploy to GitHub Pages
+ id: deployment
+ uses: actions/deploy-pages@5d6d0c8fb1398208bfc3292a3f2d2f14b574f213 # v4.0.5
diff --git a/package.json b/package.json
index d30f3e5..2341dc0 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
"lint:formatting": "prettier . --check",
"lint:spelling": "cspell \"**\" --no-progress",
"prepare": "husky",
+ "website:build": "pnpm --filter coldark-website build",
"website:dev": "pnpm --filter coldark-website dev"
},
"devDependencies": {
diff --git a/website/astro.config.mjs b/website/astro.config.mjs
index a69362e..69b2713 100644
--- a/website/astro.config.mjs
+++ b/website/astro.config.mjs
@@ -4,6 +4,8 @@ import starlight from "@astrojs/starlight";
// https://astro.build/config
export default defineConfig({
+ site: "https://armandphilippot.github.io",
+ base: "/coldark",
integrations: [
starlight({
title: "Coldark",
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 1549f40..20ab4df 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -8,13 +8,13 @@ hero:
file: ../../assets/coldark-banner.svg
actions:
- text: Discover Coldark
- link: /why-coldark/
+ link: /coldark/why-coldark/
icon: right-arrow
- text: Explore the colors
- link: /colors/
+ link: /coldark/colors/
icon: right-arrow
- text: Browse variants
- link: /variants/coldark-vscode/
+ link: /coldark/variants/coldark-vscode/
icon: right-arrow
- text: View on GitHub
link: https://github.com/ArmandPhilippot/coldark
@@ -47,32 +47,32 @@ import { Card, CardGrid } from "@astrojs/starlight/components";
## Available variants
-
+
The reference implementation of the Coldark palette for Visual Studio Code.
-
+
A web-friendly syntax highlighting theme for Prism.js.
-
+
A browser theme that follows the system preference and supports manual
switching.
-
+
Terminal syntax highlighting for bat with cold and dark variants.
-
+
File-type coloring for shells and tools that use `LS_COLORS`.
Editor themes for GTK-based applications like Mousepad and Gedit.
Terminal presets tailored for the XFCE4 terminal.
diff --git a/website/src/content/docs/variants/coldark-bat.md b/website/src/content/docs/variants/coldark-bat.md
index 137ef0d..101dd84 100644
--- a/website/src/content/docs/variants/coldark-bat.md
+++ b/website/src/content/docs/variants/coldark-bat.md
@@ -13,7 +13,7 @@ Coldark for bat brings the project to the terminal with two syntax themes that m
## Colors
-The bat variant reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](/colors/) page.
+The bat variant reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](../../colors/) page.
### Coldark Cold
diff --git a/website/src/content/docs/variants/coldark-vscode.md b/website/src/content/docs/variants/coldark-vscode.md
index 9bd3108..b1e162d 100644
--- a/website/src/content/docs/variants/coldark-vscode.md
+++ b/website/src/content/docs/variants/coldark-vscode.md
@@ -18,7 +18,7 @@ Coldark for VS Code is the reference implementation of the theme. It defines the
## Colors
-This package is the reference implementation for Coldark. The main [Colors](/colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code variant.
+This package is the reference implementation for Coldark. The main [Colors](../../colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code variant.
### Coldark Cold
From 6f5208b533c244fe0f963b41b4e626383dc29cab Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Thu, 26 Mar 2026 00:36:43 +0100
Subject: [PATCH 03/23] feat: disable pagination on the homepage
---
website/src/content/docs/index.mdx | 2 ++
1 file changed, 2 insertions(+)
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 20ab4df..892625b 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -2,6 +2,8 @@
title: Coldark
description: Discover the Coldark theme, its accessible blue-grey palettes, and every available variant.
template: splash
+prev: false
+next: false
hero:
tagline: A blue-grey theme with light and dark versions, designed for comfortable reading across and declined for editors, terminals, browsers, and developer tools.
image:
From 5e5c6241df4a77c9827ba9135c84d7928ca03e9a Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Thu, 26 Mar 2026 22:53:01 +0100
Subject: [PATCH 04/23] fix: consolidate colors denomination from `coldark00`
to `coldark07`
---
README.md | 72 +++++++----------
.../coldark-assets/common-shades-palette.svg | 71 ++++++++--------
packages/coldark-dircolors/README.md | 20 ++---
packages/coldark-firefox/README.md | 38 ++++-----
.../coldark-gtksourceview/coldark-cold.xml | 54 ++++++-------
.../coldark-gtksourceview/coldark-dark.xml | 44 +++++-----
packages/coldark-vscode/README.md | 70 +++++++---------
website/src/content/docs/colors.mdx | 80 ++++++++-----------
.../docs/variants/coldark-dircolors.md | 7 +-
.../content/docs/variants/coldark-firefox.md | 34 +++-----
.../content/docs/variants/coldark-vscode.md | 66 ++++++---------
11 files changed, 240 insertions(+), 316 deletions(-)
diff --git a/README.md b/README.md
index 70526f8..7e524c0 100644
--- a/README.md
+++ b/README.md
@@ -26,49 +26,35 @@ Coldark consists of three color palettes. The first is common to both versions.
## Colors in detail
-I tried to keep the same descriptions for both versions. However, for complex themes like VS Code, it doesn't work. So I separated the descriptions into 2 sections.
-
-### Light Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :------: | :-----: | ----------- | :----------: |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Darker background** - Editor Gutter, Inputs, Line Highlight, Status bar (no folder). Also used as foreground for Activity bar. | `coldark01` |
-| `#8da1b9` | ![#8da1b9][#8da1b9] | **Selection background** - Code block, Secondary buttons, Some highlighting. Also used for Borders. | `coldark02` |
-| `#3c526d` | ![#3c526d][#3c526d] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
-| `#213043` | ![#213043][#213043] | **Lighter foreground** – Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
-| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Also used as Shadow and for most of Punctuation. | `coldark05` |
-| `#0b121b` | ![#0b121b][#0b121b] | **Darker foreground** – Also used as background for Activity bar. | `coldark06` |
-| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter background** – Tab active, Embedded modals, Widgets. | `coldark07` |
-| `#006d6d` | ![#006d6d][#006d6d] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
-| `#755f00` | ![#755f00][#755f00] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
-| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
-| `#116b00` | ![#116b00][#116b00] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
-| `#af00af` | ![#af00af][#af00af] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
-| `#7c00aa` | ![#7c00aa][#7c00aa] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
-| `#a04900` | ![#a04900][#a04900] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
-| `#c22f2e` | ![#c22f2e][#c22f2e] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
-
-### Dark Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :------: | :-----: | ----------- | :----------: |
-| `#111b27` | ![#111b27][#111b27] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
-| `#213043` | ![#213043][#213043] | **Light background** - Editor Gutter, Embedded modals, Widgets, Line Highlight, Tab active. | `coldark01` |
-| `#3c526d` | ![#3c526d][#3c526d] | **Selection background** - Code block, Secondary buttons, Some highlighting. | `coldark02` |
-| `#8da1b9` | ![#8da1b9][#8da1b9] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Activity bar, Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Also used for most of Punctuation. | `coldark05` |
-| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter foreground** – Menu, Tab hover. | `coldark06` |
-| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Activity bar, Inputs, Status bar (no folder). Also used for Borders. | `coldark07` |
-| `#66cccc` | ![#66cccc][#66cccc] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
-| `#e6d37a` | ![#e6d37a][#e6d37a] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
-| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
-| `#91d076` | ![#91d076][#91d076] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
-| `#f4adf4` | ![#f4adf4][#f4adf4] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
-| `#c699e3` | ![#c699e3][#c699e3] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
-| `#e9ae7e` | ![#e9ae7e][#e9ae7e] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
-| `#cd6660` | ![#cd6660][#cd6660] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
+`coldark00` to `coldark07` are the shared neutral ramp, ordered from the lightest shade to the darkest.
+
+`coldark08` to `coldark15` are fixed accent slots by hue. Their role stays the same between variants, while their hex value changes to fit the light or dark context.
+
+### Common shades
+
+| Denomination | Hex Code | Preview | General use |
+| :----------: | :------: | :-----: | ----------- |
+| `coldark00` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Lightest background and elevated surfaces |
+| `coldark01` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Soft backgrounds and bright UI surfaces |
+| `coldark02` | `#d0dae7` | ![#d0dae7][#d0dae7] | Light foregrounds and secondary surfaces |
+| `coldark03` | `#8da1b9` | ![#8da1b9][#8da1b9] | Selections, borders, muted emphasis |
+| `coldark04` | `#3c526d` | ![#3c526d][#3c526d] | Comments, placeholders, subdued text |
+| `coldark05` | `#213043` | ![#213043][#213043] | Strong surfaces and supporting foregrounds |
+| `coldark06` | `#111b27` | ![#111b27][#111b27] | Default dark foreground or background, depending on variant |
+| `coldark07` | `#0b121b` | ![#0b121b][#0b121b] | Deepest structural background |
+
+### Accent colors
+
+| Denomination | Coldark Cold | Coldark Dark | Preview | General use |
+| :----------: | :----------: | :----------: | :-----: | ----------- |
+| `coldark08` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for parameters, tags, CSS variables, and embedded punctuation |
+| `coldark09` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, booleans, and attribute names |
+| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for interactive accents, classes, variables, and headings |
+| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, and positive states |
+| `coldark12` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for regex, escapes, values, and high-visibility secondary accents |
+| `coldark13` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for functions and selector-like identifiers |
+| `coldark14` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, keywords, and storage-like tokens |
+| `coldark15` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
## Variations
diff --git a/packages/coldark-assets/common-shades-palette.svg b/packages/coldark-assets/common-shades-palette.svg
index 01015a7..b21c16f 100644
--- a/packages/coldark-assets/common-shades-palette.svg
+++ b/packages/coldark-assets/common-shades-palette.svg
@@ -3,72 +3,73 @@
height="630"
viewBox="0 0 1200 630"
xmlns="http://www.w3.org/2000/svg">
-
-
+ d="M 0,530 H 1200 V 630 H 0 Z" />
+ style="fill:#e3eaf2"
+ d="m 325.89599,129.02082 q -14.04166,0 -21.91666,-7.45833 -7.875,-7.45833 -7.875,-20.66666 0,-14.333328 7.5,-21.749991 7.54166,-7.458331 22.24999,-7.458331 9.70833,0 20.12499,2.791666 l 0.25,13.416661 h -3.75 l -1.16666,-8.08333 q -5.5,-3.749999 -12.79166,-3.749999 -9.66667,0 -14.125,6.041665 -4.45833,5.999997 -4.45833,18.666659 0,11.70833 4.66667,17.83333 4.66666,6.12499 13.58332,6.12499 4.70834,0 8.20833,-1.25 3.54167,-1.25 5.54167,-2.95833 l 1.33333,-9.16666 h 3.79167 l -0.25,14.16666 q -3.75,1.45833 -9.75,2.5 -6,1 -11.16666,1 z m 67.0833,-20.62499 q 0,10.54166 -4.54166,15.58332 -4.5,5.04167 -13.79166,5.04167 -9,0 -13.41666,-5.08333 -4.41667,-5.125 -4.41667,-15.54166 0,-10.374999 4.45833,-15.374997 4.5,-5.041665 13.70833,-5.041665 9.29166,0 13.62499,5.208331 4.375,5.166665 4.375,15.208331 z m -12.20833,0 q 0,-9.166667 -1.375,-12.666665 -1.33333,-3.541665 -4.66666,-3.541665 -3.20833,0 -4.45833,3.374998 -1.25,3.374999 -1.25,12.833332 0,9.62499 1.25,13.04166 1.29166,3.41666 4.45833,3.41666 3.29167,0 4.66666,-3.58333 1.375,-3.625 1.375,-12.87499 z m 33.54166,-15.95833 2.83333,-1.458333 q 5.83333,-2.999999 10.45833,-2.999999 7,0 9.33333,5.083331 8.54166,-5.083331 14.41666,-5.083331 10.58333,0 10.58333,11.541662 v 24.91666 l 3.91667,1 v 2.74999 h -19.45833 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.375,-5.458332 -1.33333,-1.958332 -4.08333,-1.958332 -3.08333,0 -6.66667,1.749999 0.41667,1.749999 0.41667,4.041665 v 24.91666 l 3.91667,1 v 2.74999 h -19.45833 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.375,-5.458332 -1.33333,-1.958332 -4.08333,-1.958332 -2.75,0 -6.29167,1.624999 v 29.083325 l 3.58334,1 v 2.74999 h -19.45833 v -2.74999 l 3.83333,-1 V 92.770833 l -3.83333,-1 v -2.749999 h 15.20833 z m 71.0833,0 2.83333,-1.458333 q 5.83333,-2.999999 10.45833,-2.999999 7,0 9.33333,5.083331 8.54166,-5.083331 14.41666,-5.083331 10.58333,0 10.58333,11.541662 v 24.91666 l 3.91666,1 v 2.74999 h -19.45832 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.375,-5.458332 -1.33334,-1.958332 -4.08333,-1.958332 -3.08334,0 -6.66667,1.749999 0.41667,1.749999 0.41667,4.041665 v 24.91666 l 3.91666,1 v 2.74999 h -19.45832 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.375,-5.458332 -1.33334,-1.958332 -4.08333,-1.958332 -2.75,0 -6.29167,1.624999 v 29.083325 l 3.58333,1 v 2.74999 h -19.45832 v -2.74999 l 3.83333,-1 V 92.770833 l -3.83333,-1 v -2.749999 h 15.20833 z m 92.41664,15.95833 q 0,10.54166 -4.54167,15.58332 -4.5,5.04167 -13.79166,5.04167 -9,0 -13.41666,-5.08333 -4.41667,-5.125 -4.41667,-15.54166 0,-10.374999 4.45834,-15.374997 4.49999,-5.041665 13.70832,-5.041665 9.29167,0 13.625,5.208331 4.375,5.166665 4.375,15.208331 z m -12.20833,0 q 0,-9.166667 -1.375,-12.666665 -1.33333,-3.541665 -4.66667,-3.541665 -3.20833,0 -4.45833,3.374998 -1.25,3.374999 -1.25,12.833332 0,9.62499 1.25,13.04166 1.29167,3.41666 4.45833,3.41666 3.29167,0 4.66667,-3.58333 1.375,-3.625 1.375,-12.87499 z m 33.54164,-15.95833 2.83333,-1.458333 q 5.83334,-2.999999 10.5,-2.999999 10.83333,0 10.83333,11.541662 v 24.91666 l 3.91666,1 v 2.74999 h -19.45832 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.5,-5.458332 -1.45833,-1.958332 -4.20833,-1.958332 -3.16667,0 -6.33333,1.416666 v 29.291658 l 3.58333,1 v 2.74999 h -19.45833 v -2.74999 l 3.83333,-1 V 92.770833 l -3.83333,-1 v -2.749999 h 15.20833 z m 55.24997,18.62499 h 3.66666 l 1.875,8.95833 q 1.75,2.04167 5.29167,3.41667 3.54166,1.375 7.33333,1.375 11.95832,0 11.95832,-9.83333 0,-3.08334 -2.29166,-5.20833 -2.25,-2.125 -7.125,-3.79167 -7.16666,-2.375 -10.33333,-3.83333 -3.125,-1.5 -5.29166,-3.5 -2.16667,-1.999999 -3.45833,-4.833331 -1.29167,-2.874999 -1.29167,-7.041664 0,-7.374997 5,-11.208328 5.04166,-3.874999 14.70833,-3.874999 6.99999,0 15.49999,1.791666 v 13.291661 h -3.70833 l -1.875,-7.666663 q -4.25,-3.083332 -9.91666,-3.083332 -5.125,0 -7.875,1.916666 -2.75,1.874999 -2.75,5.791664 0,2.791665 2.29167,4.791665 2.29166,1.958332 7.16666,3.499998 9.54166,3.124999 13.08333,5.458331 3.58333,2.291666 5.45833,5.708336 1.875,3.41666 1.875,8.04166 0,17.79166 -20.95833,17.79166 -4.79166,0 -9.79166,-0.83334 -4.95833,-0.79166 -8.54166,-2.12499 z m 61.0833,-25.124988 q 0,2.749999 -0.25,6.499998 l 2.875,-1.458333 q 5.91667,-2.999999 10.625,-2.999999 10.83333,0 10.83333,11.541662 v 24.91666 l 3.91666,1 v 2.74999 h -19.45832 v -2.74999 l 3.5,-1 v -23.29166 q 0,-3.499999 -1.5,-5.458332 -1.45834,-1.958332 -4.20833,-1.958332 -3.16667,0 -6.33334,1.416666 v 29.291658 l 3.58334,1 v 2.74999 h -19.45833 v -2.74999 l 3.83333,-1 V 72.729175 l -4,-1 v -2.749999 h 16.04166 z m 52.04165,2.208333 q 14.70833,0 14.70833,10.833329 v 25.458326 l 3.91666,1 v 2.74999 h -14.41666 l -0.91667,-2.99999 q -3.24999,2.20833 -5.87499,2.99999 -2.625,0.83334 -5.29167,0.83334 -12.12499,0 -12.12499,-11.66666 0,-4.41667 1.79166,-7.04167 1.79167,-2.66666 5.16667,-3.91666 3.375,-1.29167 10.62499,-1.45834 l 5.08333,-0.125 v -5.708326 q 0,-7.083331 -5.79166,-7.083331 -3.5,0 -7.83333,2.166666 l -1.58333,4.874998 h -2.75 v -9.458329 q 6.29166,-0.958333 9.25,-1.208333 2.95833,-0.25 6.04166,-0.25 z m 2.66666,20.374995 -3.49999,0.125 q -4.04167,0.16666 -5.625,2.125 -1.54167,1.95833 -1.54167,6.33333 0,3.54166 1.25,5.20833 1.25,1.66666 3.25,1.66666 2.83333,0 6.16666,-1.45833 z m 47.79166,17.45832 q -2.33333,1.5 -3.58333,2 -1.25,0.45833 -2.83333,0.75 -1.58334,0.29167 -3.5,0.29167 -8.66667,0 -12.91666,-4.95833 -4.25,-5 -4.25,-15.33333 0,-10.166663 4.54166,-15.458327 4.58333,-5.291665 13.25,-5.291665 4.54166,0 9.16666,1.125 -0.25,-1.375 -0.25,-6.458331 v -9.916662 l -4,-1 v -2.749999 h 16.04166 v 55.458314 l 4.29167,1 v 2.74999 h -15.08333 z m -14.87499,-17.58332 q 0,7.79166 1.95833,11.91666 1.95833,4.08333 5.625,4.08333 3.33333,0 6.91666,-1.79167 V 93.104166 q -3.25,-0.875 -6.58333,-0.875 -3.75,0 -5.83333,4.124999 -2.08333,4.083335 -2.08333,12.041665 z m 52.375,-20.333329 q 7.95833,0 11.5,4.249999 3.58333,4.249998 3.58333,13.20833 v 3.41666 h -20.54166 v 0.66667 q 0,6.20833 1,8.83333 1,2.625 3.25,4 2.25,1.375 6.16666,1.375 3.66667,0 9.25,-1.20834 v 3.20834 q -2.29166,1.375 -5.95833,2.29166 -3.625,0.875 -7.08333,0.875 -9.625,0 -14.24999,-5 -4.58334,-5.04166 -4.58334,-15.58332 0,-10.249999 4.375,-15.291664 4.41667,-5.041665 13.29166,-5.041665 z m -0.45833,4.208332 q -2.5,0 -3.75,2.708332 -1.20833,2.708332 -1.20833,9.583325 h 9.08333 q 0,-5.583326 -0.375,-7.833325 -0.375,-2.291666 -1.29167,-3.374999 -0.875,-1.083333 -2.45833,-1.083333 z m 48.87493,23.499987 q 0,6.54167 -4.04166,9.91667 -4,3.33333 -11.66666,3.33333 -3.16667,0 -7,-0.70834 -3.79166,-0.66666 -5.75,-1.41666 v -10.66666 h 2.75 l 1.58333,5.49999 q 1.45834,1.45834 3.83334,2.45834 2.375,0.95833 4.83333,0.95833 3.625,0 5.375,-1.54167 1.79166,-1.58333 1.79166,-4 0,-2.29166 -1.70833,-3.66666 -1.70833,-1.375 -7.45833,-3.16667 -6.04167,-1.87499 -8.58333,-5.12499 -2.5,-3.25 -2.5,-8 0,-5.333331 3.95833,-8.499996 3.95833,-3.166666 10.20833,-3.166666 4.29167,0 11.54166,1.208333 v 10.041662 h -2.75 l -1.33333,-4.583331 q -1.20833,-1.208333 -3.41666,-1.958332 -2.16667,-0.791667 -4.125,-0.791667 -3,0 -4.45833,1.25 -1.41667,1.208333 -1.41667,3.333332 0,2.208332 1.79167,3.624995 1.79166,1.41667 7.37499,3.08334 6.08333,1.87499 8.625,4.95833 2.54166,3.04166 2.54166,7.62499 z"
+ aria-label="Common Shades" />
+ style="fill:#f0f4f8"
+ d="M 0,226 H 150 V 526 H 0 Z" />
+ style="fill:#e3eaf2"
+ d="M 150,226 H 300 V 526 H 150 Z" />
+ d="M 300,226 H 450 V 526 H 300 Z" />
+ style="fill:#8da1b9"
+ d="M 450,226 H 600 V 526 H 450 Z" />
+ style="fill:#3c526d"
+ d="M 600,226 H 750 V 526 H 600 Z" />
+ style="fill:#213043"
+ d="M 750,226 H 900 V 526 H 750 Z" />
+
+
+ aria-label="#f0f4f8" />
+ aria-label="#e3eaf2" />
+ aria-label="#d0dae7" />
+ aria-label="#3c526d" />
+ aria-label="#213043" />
+ aria-label="#111b27" />
+ aria-label="#0b121b" />
diff --git a/packages/coldark-dircolors/README.md b/packages/coldark-dircolors/README.md
index f4f8b9c..a94175e 100644
--- a/packages/coldark-dircolors/README.md
+++ b/packages/coldark-dircolors/README.md
@@ -20,23 +20,23 @@ This variant is designed for dircolors in conjunction with the [Coldark variant
## Use of colors
-- **`coldark00`: Black**
+- **Terminal black slot**
Used as foreground for sticky other writable directories.
-- **`coldark00`: Dark gray**
+- **Terminal bright black slot**
Used as foreground for ignored files (e.g., `.log`, `.bak`).
-- **`coldark05`: White**
- Used as foreground for missing files, files with setuid or setgid permissions, files with capability, sticky not other writable directories.
-- **`coldark08`: Cyan**
+- **Terminal white slot**
+ Used as foreground for missing files, files with setuid or setgid permissions, files with capability, and sticky not other writable directories.
+- **`coldark08`: Cyan accent**
Used as foreground for symbolic links, regular files with more than one link, pipes and audio files.
-- **`coldark09`: Yellow**
+- **`coldark09`: Yellow accent**
Used as foreground for socket files, block devices drivers and character device drivers and video files.
-- **`coldark10`: Blue**
+- **`coldark10`: Blue accent**
Used as foreground for directories and as background for sticky not other writable directories.
-- **`coldark11`: Green**
+- **`coldark11`: Green accent**
Used as foreground for other writable directories, archives and various documents. Also used as background for sticky other writable directories.
-- **`coldark12`: Magenta**
+- **`coldark12`: Magenta accent**
Used as foreground for doors and images.
-- **`coldark15`: Red**
+- **`coldark15`: Red accent**
Used as foreground for orphaned symbolic links and executable. Also used as background for missing files.
## Screenshots
diff --git a/packages/coldark-firefox/README.md b/packages/coldark-firefox/README.md
index 386532e..a30bbf2 100644
--- a/packages/coldark-firefox/README.md
+++ b/packages/coldark-firefox/README.md
@@ -28,29 +28,21 @@ If the shortcut doesn't work, check that it's not being used by another extensio
## Colors
-### Light Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :-------: | :-----------------: | --------------------------------------------------------------------------------------------------------- | :----------: |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** - Frame, new tab page, fields | `coldark00` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark background** - Selected tab, toolbar, sidebar | `coldark01` |
-| `#8da1b9` | ![#8da1b9][#8da1b9] | **Darker background** - Inactive frame, highlight, borders | `coldark02` |
-| `#213043` | ![#213043][#213043] | **Lighter foreground** – Icons, new tab page, popup, highlight, fields, inactive tab. | `coldark04` |
-| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Selected tab, toolbar | `coldark05` |
-| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter background** – Popup, focused fields, buttons states | `coldark07` |
-| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Special icons (e.g. bookmark), focus border, selected tab border, tab loading, field highlight | `coldark10` |
-
-### Dark Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :-------: | :-----------------: | --------------------------------------------------------------------------------------------------------- | :----------: |
-| `#111b27` | ![#111b27][#111b27] | **Default background** – Frame, new tab page, fields | `coldark00` |
-| `#213043` | ![#213043][#213043] | **Light background** - Selected tab, toolbar, sidebar | `coldark01` |
-| `#3c526d` | ![#3c526d][#3c526d] | **Lighter background** - Popup, focused fields, buttons states | `coldark02` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Icons, new tab page, popup, highlight, fields, inactive tab. | `coldark04` |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Selected tab, toolbar | `coldark05` |
-| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Inactive frame, highlight, borders | `coldark07` |
-| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Special icons (e.g. bookmark), focus border, selected tab border, tab loading, field highlight | `coldark10` |
+Firefox uses a small subset of the shared Coldark palette. The neutral denominations stay fixed across variants, while the blue accent keeps the same denomination and changes value with the variant.
+
+| Denomination | Coldark Cold | Coldark Dark | Preview | Usage in Firefox |
+| :----------: | :----------: | :----------: | :-----: | ---------------- |
+| `coldark00` | `#f0f4f8` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Popup, focused fields, and elevated button states in Coldark Cold |
+| `coldark01` | `#e3eaf2` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Default foreground for selected tab and toolbar in Coldark Dark |
+| `coldark02` | `#d0dae7` | `#d0dae7` | ![#d0dae7][#d0dae7] | Icons, popup text, field text, and inactive tab foreground in Coldark Dark |
+| `coldark03` | `#8da1b9` | `#8da1b9` | ![#8da1b9][#8da1b9] | Unused by the current Firefox theme |
+| `coldark04` | `#3c526d` | `#3c526d` | ![#3c526d][#3c526d] | Popup and focused field background in Coldark Dark |
+| `coldark05` | `#213043` | `#213043` | ![#213043][#213043] | Selected tab, toolbar, and sidebar background in Coldark Dark |
+| `coldark06` | `#111b27` | `#111b27` | ![#111b27][#111b27] | Default foreground in Coldark Cold and default background in Coldark Dark |
+| `coldark07` | `#0b121b` | `#0b121b` | ![#0b121b][#0b121b] | Inactive frame, highlight, and border background in Coldark Dark |
+| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Special icons, focus border, selected tab border, tab loading, and field highlight |
+
+For Coldark Cold specifically, the browser chrome also uses `coldark01` (`#e3eaf2`) as the main frame and field background, `coldark02` (`#d0dae7`) for selected tab and toolbar surfaces, `coldark03` (`#8da1b9`) for inactive frame and border emphasis, `coldark05` (`#213043`) for icon and popup foreground, and `coldark06` (`#111b27`) for the main foreground text.
## Screenshots
diff --git a/packages/coldark-gtksourceview/coldark-cold.xml b/packages/coldark-gtksourceview/coldark-cold.xml
index d028245..a3110e7 100644
--- a/packages/coldark-gtksourceview/coldark-cold.xml
+++ b/packages/coldark-gtksourceview/coldark-cold.xml
@@ -12,14 +12,14 @@
<_description>Light version of Coldark - A theme in shades of blue-grey adapted for GTK.
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
@@ -30,22 +30,22 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
@@ -93,7 +93,7 @@
-
+
@@ -103,7 +103,7 @@
-
+
@@ -134,9 +134,9 @@
-
-
-
+
+
+
diff --git a/packages/coldark-gtksourceview/coldark-dark.xml b/packages/coldark-gtksourceview/coldark-dark.xml
index a5d0c79..3c0c70d 100644
--- a/packages/coldark-gtksourceview/coldark-dark.xml
+++ b/packages/coldark-gtksourceview/coldark-dark.xml
@@ -12,13 +12,13 @@
<_description>Dark version of Coldark - A theme in shades of blue-grey adapted for GTK.
-
-
-
+
+
+
-
-
-
+
+
+
@@ -30,18 +30,18 @@
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
-
+
+
+
+
+
@@ -93,7 +93,7 @@
-
+
@@ -103,7 +103,7 @@
-
+
@@ -134,9 +134,9 @@
-
-
-
+
+
+
diff --git a/packages/coldark-vscode/README.md b/packages/coldark-vscode/README.md
index 6464101..632174b 100644
--- a/packages/coldark-vscode/README.md
+++ b/packages/coldark-vscode/README.md
@@ -38,47 +38,35 @@ This variant is designed for [Visual Studio Code](https://code.visualstudio.com/
## Colors
-### Light Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :------: | :-----: | ----------- | :----------: |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark background** - Editor Gutter, Inputs, Line Highlight, Status bar (no folder), No tabs. Also used as foreground for Activity bar. | `coldark01` |
-| `#8da1b9` | ![#8da1b9][#8da1b9] | **Selection background** - Code block, Secondary buttons, Some highlighting. Also used for Borders. | `coldark02` |
-| `#3c526d` | ![#3c526d][#3c526d] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
-| `#213043` | ![#213043][#213043] | **Light foreground** – Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
-| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Also used as Shadow and for most of Punctuation. | `coldark05` |
-| `#0b121b` | ![#0b121b][#0b121b] | **Dark foreground** – Also used as background for Activity bar. | `coldark06` |
-| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Light background** – Tab active, Embedded modals, Widgets. | `coldark07` |
-| `#006d6d` | ![#006d6d][#006d6d] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
-| `#755f00` | ![#755f00][#755f00] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
-| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
-| `#116b00` | ![#116b00][#116b00] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
-| `#af00af` | ![#af00af][#af00af] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
-| `#7c00aa` | ![#7c00aa][#7c00aa] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
-| `#a04900` | ![#a04900][#a04900] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
-| `#c22f2e` | ![#c22f2e][#c22f2e] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
-
-### Dark Theme
-
-| Hex Code | Preview | Description | Denomination |
-| :------: | :-----: | ----------- | :----------: |
-| `#111b27` | ![#111b27][#111b27] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
-| `#213043` | ![#213043][#213043] | **Light background** - Embedded modals, Widgets, Line Highlight, Tab active. | `coldark01` |
-| `#3c526d` | ![#3c526d][#3c526d] | **Selection background** - Code block, Secondary buttons, Some highlighting. | `coldark02` |
-| `#8da1b9` | ![#8da1b9][#8da1b9] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
-| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Activity bar, Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
-| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Also used for most of Punctuation. | `coldark05` |
-| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Light foreground** – Menu, Tab hover. | `coldark06` |
-| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Activity bar, Inputs, Status bar (no folder), Editor Gutter, No tabs. Also used for Borders. | `coldark07` |
-| `#66cccc` | ![#66cccc][#66cccc] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
-| `#e6d37a` | ![#e6d37a][#e6d37a] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
-| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
-| `#91d076` | ![#91d076][#91d076] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
-| `#f4adf4` | ![#f4adf4][#f4adf4] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
-| `#c699e3` | ![#c699e3][#c699e3] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
-| `#e9ae7e` | ![#e9ae7e][#e9ae7e] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
-| `#cd6660` | ![#cd6660][#cd6660] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
+`coldark00` to `coldark07` are the fixed shared neutral ramp, ordered from the lightest common shade to the darkest.
+
+`coldark08` to `coldark15` are fixed accent slots by hue, with one value for Coldark Cold and another for Coldark Dark.
+
+### Common shades
+
+| Denomination | Hex Code | Preview | Usage in VS Code |
+| :----------: | :------: | :-----: | ---------------- |
+| `coldark00` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Lightest surfaces such as active tabs, widgets, and elevated panels |
+| `coldark01` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Bright backgrounds in Coldark Cold and the default foreground in Coldark Dark |
+| `coldark02` | `#d0dae7` | ![#d0dae7][#d0dae7] | Soft foregrounds and secondary surfaces |
+| `coldark03` | `#8da1b9` | ![#8da1b9][#8da1b9] | Selection backgrounds, borders, and muted emphasis |
+| `coldark04` | `#3c526d` | ![#3c526d][#3c526d] | Comments, placeholders, and subdued text |
+| `coldark05` | `#213043` | ![#213043][#213043] | Strong surfaces like widgets and line highlights |
+| `coldark06` | `#111b27` | ![#111b27][#111b27] | Main dark foreground in Coldark Cold and main background in Coldark Dark |
+| `coldark07` | `#0b121b` | ![#0b121b][#0b121b] | Deep structural background for activity bars, gutters, and borders |
+
+### Accent colors
+
+| Denomination | Coldark Cold | Coldark Dark | Preview | Usage in VS Code |
+| :----------: | :----------: | :----------: | :-----: | ---------------- |
+| `coldark08` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark09` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
+| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, classes, variables, and headings |
+| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, CSS colors, CSS font names, and link text |
+| `coldark12` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+| `coldark13` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark14` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark15` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
## How to install
diff --git a/website/src/content/docs/colors.mdx b/website/src/content/docs/colors.mdx
index 05bf2c9..ea27461 100644
--- a/website/src/content/docs/colors.mdx
+++ b/website/src/content/docs/colors.mdx
@@ -17,41 +17,41 @@ Coldark uses three palettes:
Common shades
- Shared neutrals that define the layout, surfaces, borders, and most of the
- typography.
+ Shared neutrals, ordered from the lightest shade to the darkest. Their
+ denominations stay fixed in both variants.
@@ -131,47 +131,31 @@ Coldark uses three palettes:
-## Coldark Cold
-
-| Token | Hex | Role |
-| ----------- | --------- | -------------------------------------------------------------------------------------- |
-| `coldark00` | `#e3eaf2` | Default background. Also used as foreground for buttons and badges. |
-| `coldark01` | `#d0dae7` | Darker background for editor gutter, inputs, line highlight, and neutral status areas. |
-| `coldark02` | `#8da1b9` | Selection background, secondary buttons, and some borders. |
-| `coldark03` | `#3c526d` | Comments, placeholders, and subdued text. |
-| `coldark04` | `#213043` | Light foreground for widgets, inputs, and embedded UI. |
-| `coldark05` | `#111b27` | Default foreground and core punctuation color. |
-| `coldark06` | `#0b121b` | Dark foreground and activity bar background. |
-| `coldark07` | `#f0f4f8` | Light background for active tabs, widgets, and embedded panels. |
-| `coldark08` | `#006d6d` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
-| `coldark09` | `#755f00` | Yellow for modified states, hints, booleans, and attribute names. |
-| `coldark10` | `#005a8e` | Blue for buttons, badges, info, classes, variables, and headings. |
-| `coldark11` | `#116b00` | Green for additions, strings, CSS colors, and link text. |
-| `coldark12` | `#af00af` | Magenta for untracked states, regex, escapes, and CSS values. |
-| `coldark13` | `#7c00aa` | Purple for functions and CSS classes or IDs. |
-| `coldark14` | `#a04900` | Orange for warnings, keywords, storage, and pseudo-elements. |
-| `coldark15` | `#c22f2e` | Red for errors, deletions, invalid states, and deprecated items. |
-
-## Coldark Dark
+## Common shades
| Token | Hex | Role |
| ----------- | --------- | ---------------------------------------------------------------------- |
-| `coldark00` | `#111b27` | Default background. Also used as foreground for buttons and badges. |
-| `coldark01` | `#213043` | Light background for widgets, highlights, and embedded panels. |
-| `coldark02` | `#3c526d` | Selection background, secondary buttons, and soft highlights. |
-| `coldark03` | `#8da1b9` | Comments, placeholders, and subdued text. |
-| `coldark04` | `#d0dae7` | Dark foreground for activity bar, inputs, and embedded UI. |
-| `coldark05` | `#e3eaf2` | Default foreground and core punctuation color. |
-| `coldark06` | `#f0f4f8` | Light foreground for menus and hover states. |
-| `coldark07` | `#0b121b` | Deep background for activity bars, gutters, borders, and status areas. |
-| `coldark08` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
-| `coldark09` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
-| `coldark10` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
-| `coldark11` | `#91d076` | Green for additions, strings, CSS colors, and link text. |
-| `coldark12` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
-| `coldark13` | `#c699e3` | Purple for functions and CSS classes or IDs. |
-| `coldark14` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
-| `coldark15` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
+| `coldark00` | `#f0f4f8` | Lightest background for elevated panels, widgets, and active surfaces. |
+| `coldark01` | `#e3eaf2` | Soft bright surface and bright foreground support. |
+| `coldark02` | `#d0dae7` | Secondary surface and light foreground support. |
+| `coldark03` | `#8da1b9` | Selections, borders, and muted emphasis. |
+| `coldark04` | `#3c526d` | Comments, placeholders, and subdued text. |
+| `coldark05` | `#213043` | Strong surface for widgets, highlights, and embedded panels. |
+| `coldark06` | `#111b27` | Main dark foreground or background, depending on the variant. |
+| `coldark07` | `#0b121b` | Deepest structural background for heavy UI chrome. |
+
+## Accent slots
+
+| Token | Coldark Cold | Coldark Dark | Role |
+| ----------- | ------------ | ------------ | ------------------------------------------------------------------- |
+| `coldark08` | `#006d6d` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
+| `coldark09` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
+| `coldark10` | `#005a8e` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, and link text. |
+| `coldark12` | `#af00af` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
+| `coldark13` | `#7c00aa` | `#c699e3` | Purple for functions and CSS classes or IDs. |
+| `coldark14` | `#a04900` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
+| `coldark15` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
## Source of truth
diff --git a/website/src/content/docs/variants/coldark-dircolors.md b/website/src/content/docs/variants/coldark-dircolors.md
index 8e594be..77cd5c2 100644
--- a/website/src/content/docs/variants/coldark-dircolors.md
+++ b/website/src/content/docs/variants/coldark-dircolors.md
@@ -15,10 +15,11 @@ Coldark dircolors applies the palette to file listings and works especially well
Dircolors maps a smaller set of semantic Coldark colors to file kinds and shell states.
-| Token | Meaning in this package |
+| Color slot | Meaning in this package |
| --- | --- |
-| `coldark00` | Foreground for sticky other writable directories and ignored files such as `.log` or `.bak` |
-| `coldark05` | Foreground for missing files, setuid or setgid files, files with capability, and sticky not other writable directories |
+| Terminal black | Foreground for sticky other writable directories |
+| Terminal bright black | Foreground for ignored files such as `.log` or `.bak` |
+| Terminal white | Foreground for missing files, setuid or setgid files, files with capability, and sticky not other writable directories |
| `coldark08` | Foreground for symbolic links, multi-link regular files, pipes, and audio files |
| `coldark09` | Foreground for sockets, block devices, character devices, and video files |
| `coldark10` | Foreground for directories and background for sticky not other writable directories |
diff --git a/website/src/content/docs/variants/coldark-firefox.md b/website/src/content/docs/variants/coldark-firefox.md
index 3763077..7f77b74 100644
--- a/website/src/content/docs/variants/coldark-firefox.md
+++ b/website/src/content/docs/variants/coldark-firefox.md
@@ -17,29 +17,17 @@ Firefox only exposes a smaller theming surface than editors like VS Code, so thi
## Colors
-### Coldark Cold
-
-| Token | Hex | Role |
-| --- | --- | --- |
-| `coldark00` | `#e3eaf2` | Default background for frame, new tab page, and fields |
-| `coldark01` | `#d0dae7` | Dark background for selected tab, toolbar, and sidebar |
-| `coldark02` | `#8da1b9` | Darker background for inactive frame, highlight, and borders |
-| `coldark04` | `#213043` | Lighter foreground for icons, new tab page, popup, highlight, fields, and inactive tab |
-| `coldark05` | `#111b27` | Default foreground for selected tab and toolbar |
-| `coldark07` | `#f0f4f8` | Lighter background for popup, focused fields, and button states |
-| `coldark10` | `#005a8e` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
-
-### Coldark Dark
-
-| Token | Hex | Role |
-| --- | --- | --- |
-| `coldark00` | `#111b27` | Default background for frame, new tab page, and fields |
-| `coldark01` | `#213043` | Light background for selected tab, toolbar, and sidebar |
-| `coldark02` | `#3c526d` | Lighter background for popup, focused fields, and button states |
-| `coldark04` | `#d0dae7` | Dark foreground for icons, new tab page, popup, highlight, fields, and inactive tab |
-| `coldark05` | `#e3eaf2` | Default foreground for selected tab and toolbar |
-| `coldark07` | `#0b121b` | Dark background for inactive frame, highlight, and borders |
-| `coldark10` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
+| Token | Coldark Cold | Coldark Dark | Role |
+| --- | --- | --- | --- |
+| `coldark00` | `#f0f4f8` | `#f0f4f8` | Popup, focused field, and elevated button background in the light variant |
+| `coldark01` | `#e3eaf2` | `#e3eaf2` | Bright frame/background support in Coldark Cold and default selected-tab foreground in Coldark Dark |
+| `coldark02` | `#d0dae7` | `#d0dae7` | Supporting foreground in Coldark Dark |
+| `coldark03` | `#8da1b9` | `#8da1b9` | Unused by the current Firefox package |
+| `coldark04` | `#3c526d` | `#3c526d` | Popup, focused field, and button-state background in Coldark Dark |
+| `coldark05` | `#213043` | `#213043` | Selected tab, toolbar, and sidebar background in Coldark Dark |
+| `coldark06` | `#111b27` | `#111b27` | Main foreground in Coldark Cold and main frame background in Coldark Dark |
+| `coldark07` | `#0b121b` | `#0b121b` | Inactive frame, highlight, and border background in Coldark Dark |
+| `coldark10` | `#005a8e` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
## Installation
diff --git a/website/src/content/docs/variants/coldark-vscode.md b/website/src/content/docs/variants/coldark-vscode.md
index b1e162d..77e6fe2 100644
--- a/website/src/content/docs/variants/coldark-vscode.md
+++ b/website/src/content/docs/variants/coldark-vscode.md
@@ -20,55 +20,39 @@ Coldark for VS Code is the reference implementation of the theme. It defines the
This package is the reference implementation for Coldark. The main [Colors](../../colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code variant.
-### Coldark Cold
+### Common shades
| Token | Hex | Role |
| --- | --- | --- |
-| `coldark00` | `#e3eaf2` | Default background. Also used as foreground for button and badges |
-| `coldark01` | `#d0dae7` | Dark background for editor gutter, inputs, line highlight, status bar without folder, and no-tabs layout. Also used as activity bar foreground |
-| `coldark02` | `#8da1b9` | Selection background, code blocks, secondary buttons, and borders |
-| `coldark03` | `#3c526d` | Comments, invisible text, ignored items, and placeholders |
-| `coldark04` | `#213043` | Light foreground for inputs, status bar without folder, embedded modals, and widgets |
-| `coldark05` | `#111b27` | Default foreground, shadow, and most punctuation |
-| `coldark06` | `#0b121b` | Dark foreground and activity bar background |
-| `coldark07` | `#f0f4f8` | Light background for active tabs, embedded modals, and widgets |
-| `coldark08` | `#006d6d` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark09` | `#755f00` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark10` | `#005a8e` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
-| `coldark11` | `#116b00` | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#af00af` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
-| `coldark13` | `#7c00aa` | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark14` | `#a04900` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark15` | `#c22f2e` | Red for errors, deletions, invalid states, and deprecated items |
-
-### Coldark Dark
-
-| Token | Hex | Role |
-| --- | --- | --- |
-| `coldark00` | `#111b27` | Default background. Also used as foreground for button and badges |
-| `coldark01` | `#213043` | Light background for embedded modals, widgets, line highlight, and active tabs |
-| `coldark02` | `#3c526d` | Selection background, code blocks, secondary buttons, and some highlighting |
-| `coldark03` | `#8da1b9` | Comments, invisible text, ignored items, and placeholders |
-| `coldark04` | `#d0dae7` | Dark foreground for activity bar, inputs, status bar without folder, embedded modals, and widgets |
-| `coldark05` | `#e3eaf2` | Default foreground and most punctuation |
-| `coldark06` | `#f0f4f8` | Light foreground for menus and tab hover states |
-| `coldark07` | `#0b121b` | Dark background for activity bar, inputs, status bar without folder, editor gutter, no-tabs layout, and borders |
-| `coldark08` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark09` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark10` | `#6cb8e6` | Primary interactive accent in both variants. Reused for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
-| `coldark11` | `#91d076` | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
-| `coldark13` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark14` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark15` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark00` | `#f0f4f8` | Lightest surface for active tabs, widgets, and elevated panels |
+| `coldark01` | `#e3eaf2` | Bright surface in Coldark Cold and default foreground in Coldark Dark |
+| `coldark02` | `#d0dae7` | Secondary surface and supporting foreground |
+| `coldark03` | `#8da1b9` | Selection background, borders, comments, and muted emphasis |
+| `coldark04` | `#3c526d` | Subdued text and softer highlights |
+| `coldark05` | `#213043` | Strong surface for widgets, line highlight, and embedded panels |
+| `coldark06` | `#111b27` | Main dark foreground in Coldark Cold and main editor background in Coldark Dark |
+| `coldark07` | `#0b121b` | Deep background for activity bar, gutters, borders, and heavy chrome |
+
+### Accent slots
+
+| Token | Coldark Cold | Coldark Dark | Role |
+| --- | --- | --- | --- |
+| `coldark08` | `#006d6d` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark09` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
+| `coldark10` | `#005a8e` | `#6cb8e6` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, CSS font names, and link text |
+| `coldark12` | `#af00af` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+| `coldark13` | `#7c00aa` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark14` | `#a04900` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark15` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
## Implementation notes
The current VS Code theme files confirm a few useful maintenance patterns:
-- `coldark02` and `coldark03` intentionally swap emphasis between the two variants: in the cold theme, `coldark02` is the stronger selection surface and `coldark03` is the subdued comment color; in the dark theme, that relationship stays the same semantically, but the values move upward in brightness.
-- `coldark07` is one of the most structurally important differences between the variants. In Coldark Cold it is a lighter surface color for active tabs and widgets, while in Coldark Dark it becomes the deepest structural background used for borders, gutters, and other heavy UI chrome.
-- `coldark06` is not symmetrical either. In Coldark Cold it behaves like a darker foreground and activity-bar background, while in Coldark Dark it is a lighter foreground mainly used for menus and hover states.
+- `coldark00` to `coldark07` form a shared neutral ramp from lightest to darkest, even though each variant assigns those shades to different UI roles.
+- `coldark06` and `coldark07` carry much of the structural contrast in the dark variant, while `coldark00` and `coldark01` do the same for elevated surfaces in the light variant.
+- `coldark08` to `coldark15` stay stable by hue across both variants, which makes ports easier because contributors can reason about accent intent separately from light/dark adaptation.
## Syntax highlighting patterns
From 965d8b434461ae6dcd101b2f294f357a140b6dec Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Thu, 26 Mar 2026 23:31:23 +0100
Subject: [PATCH 05/23] fix: reorganize website colors to derivate them from
Coldark colors
---
website/src/styles/coldark.css | 279 ++++++++++++++++++++++-----------
1 file changed, 184 insertions(+), 95 deletions(-)
diff --git a/website/src/styles/coldark.css b/website/src/styles/coldark.css
index d3fa110..0105a66 100644
--- a/website/src/styles/coldark.css
+++ b/website/src/styles/coldark.css
@@ -3,97 +3,171 @@
@layer theme {
:root,
::backdrop {
- --sl-color-white: #f0f4f8;
- --sl-color-gray-1: #e3eaf2;
- --sl-color-gray-2: #d0dae7;
- --sl-color-gray-3: #8da1b9;
- --sl-color-gray-4: #3c526d;
- --sl-color-gray-5: #213043;
- --sl-color-gray-6: #111b27;
- --sl-color-black: #0b121b;
-
- --sl-color-accent-low: #213043;
- --sl-color-accent: #6cb8e6;
- --sl-color-accent-high: #d0dae7;
-
- --sl-color-blue-low: #213043;
- --sl-color-blue: #6cb8e6;
- --sl-color-blue-high: #d0dae7;
- --sl-color-green-low: #213043;
- --sl-color-green: #91d076;
- --sl-color-green-high: #d0dae7;
- --sl-color-orange-low: #213043;
- --sl-color-orange: #e9ae7e;
- --sl-color-orange-high: #f0f4f8;
- --sl-color-purple-low: #213043;
- --sl-color-purple: #c699e3;
- --sl-color-purple-high: #f0f4f8;
- --sl-color-red-low: #213043;
- --sl-color-red: #cd6660;
- --sl-color-red-high: #f0f4f8;
-
- --sl-color-text: #d0dae7;
- --sl-color-text-accent: #e3eaf2;
- --sl-color-text-invert: #111b27;
- --sl-color-bg: #111b27;
- --sl-color-bg-nav: #0b121b;
- --sl-color-bg-sidebar: #0b121b;
- --sl-color-bg-inline-code: rgb(33 48 67 / 70%);
- --sl-color-bg-accent: #6cb8e6;
- --sl-color-hairline-light: rgb(141 161 185 / 30%);
- --sl-color-hairline: rgb(11 18 27 / 90%);
- --sl-color-hairline-shade: #0b121b;
- --sl-color-backdrop-overlay: rgb(11 18 27 / 70%);
- --sl-shadow-md: 0 18px 40px rgb(0 0 0 / 28%);
- --sl-shadow-lg: 0 24px 64px rgb(0 0 0 / 40%);
+ --coldark00: #f0f4f8;
+ --coldark01: #e3eaf2;
+ --coldark02: #d0dae7;
+ --coldark03: #8da1b9;
+ --coldark04: #3c526d;
+ --coldark05: #213043;
+ --coldark06: #111b27;
+ --coldark07: #0b121b;
+ --coldark08: #66cccc;
+ --coldark09: #e6d37a;
+ --coldark10: #6cb8e6;
+ --coldark11: #91d076;
+ --coldark12: #f4adf4;
+ --coldark13: #c699e3;
+ --coldark14: #e9ae7e;
+ --coldark15: #cd6660;
+
+ --sl-color-white: var(--coldark00);
+ --sl-color-gray-1: var(--coldark01);
+ --sl-color-gray-2: var(--coldark02);
+ --sl-color-gray-3: var(--coldark03);
+ --sl-color-gray-4: var(--coldark04);
+ --sl-color-gray-5: var(--coldark05);
+ --sl-color-gray-6: var(--coldark06);
+ --sl-color-black: var(--coldark07);
+
+ --sl-color-accent-low: var(--coldark05);
+ --sl-color-accent: var(--coldark10);
+ --sl-color-accent-high: var(--coldark02);
+
+ --sl-color-blue-low: var(--coldark05);
+ --sl-color-blue: var(--coldark10);
+ --sl-color-blue-high: var(--coldark02);
+ --sl-color-green-low: var(--coldark05);
+ --sl-color-green: var(--coldark11);
+ --sl-color-green-high: var(--coldark02);
+ --sl-color-orange-low: var(--coldark05);
+ --sl-color-orange: var(--coldark14);
+ --sl-color-orange-high: var(--coldark00);
+ --sl-color-purple-low: var(--coldark05);
+ --sl-color-purple: var(--coldark13);
+ --sl-color-purple-high: var(--coldark00);
+ --sl-color-red-low: var(--coldark05);
+ --sl-color-red: var(--coldark15);
+ --sl-color-red-high: var(--coldark00);
+
+ --sl-color-text: var(--coldark02);
+ --sl-color-text-accent: var(--coldark01);
+ --sl-color-text-invert: var(--coldark06);
+ --sl-color-bg: var(--coldark06);
+ --sl-color-bg-nav: var(--coldark07);
+ --sl-color-bg-sidebar: var(--coldark07);
+ --sl-color-bg-inline-code: color-mix(
+ in srgb,
+ var(--coldark05) 70%,
+ transparent
+ );
+ --sl-color-bg-accent: var(--coldark10);
+ --sl-color-hairline-light: color-mix(
+ in srgb,
+ var(--coldark03) 30%,
+ transparent
+ );
+ --sl-color-hairline: color-mix(in srgb, var(--coldark07) 90%, transparent);
+ --sl-color-hairline-shade: var(--coldark07);
+ --sl-color-backdrop-overlay: color-mix(
+ in srgb,
+ var(--coldark07) 70%,
+ transparent
+ );
+ --sl-shadow-md: 0 18px 40px
+ color-mix(in srgb, var(--coldark07) 28%, transparent);
+ --sl-shadow-lg: 0 24px 64px
+ color-mix(in srgb, var(--coldark07) 40%, transparent);
}
:root[data-theme="light"],
[data-theme="light"] ::backdrop {
- --sl-color-white: #111b27;
- --sl-color-gray-1: #213043;
- --sl-color-gray-2: #3c526d;
- --sl-color-gray-3: #8da1b9;
- --sl-color-gray-4: #d0dae7;
- --sl-color-gray-5: #e3eaf2;
- --sl-color-gray-6: #f0f4f8;
- --sl-color-gray-7: #f8fbfe;
- --sl-color-black: #ffffff;
-
- --sl-color-accent-high: #005a8e;
- --sl-color-accent: #005a8e;
- --sl-color-accent-low: #d0dae7;
-
- --sl-color-blue-high: #005a8e;
- --sl-color-blue: #005a8e;
- --sl-color-blue-low: #d0dae7;
- --sl-color-green-high: #116b00;
- --sl-color-green: #116b00;
- --sl-color-green-low: #dbe8d8;
- --sl-color-orange-high: #a04900;
- --sl-color-orange: #a04900;
- --sl-color-orange-low: #f3e2d3;
- --sl-color-purple-high: #7c00aa;
- --sl-color-purple: #7c00aa;
- --sl-color-purple-low: #eddcf5;
- --sl-color-red-high: #c22f2e;
- --sl-color-red: #c22f2e;
- --sl-color-red-low: #f6dddd;
-
- --sl-color-text: #213043;
- --sl-color-text-accent: #005a8e;
- --sl-color-text-invert: #e3eaf2;
- --sl-color-bg: #e3eaf2;
- --sl-color-bg-nav: #f0f4f8;
- --sl-color-bg-sidebar: #e3eaf2;
- --sl-color-bg-inline-code: rgb(208 218 231 / 80%);
- --sl-color-bg-accent: #005a8e;
- --sl-color-hairline-light: rgb(141 161 185 / 50%);
- --sl-color-hairline: rgb(141 161 185 / 70%);
- --sl-color-hairline-shade: rgb(141 161 185 / 40%);
- --sl-color-backdrop-overlay: rgb(60 82 109 / 42%);
- --sl-shadow-md: 0 18px 40px rgb(17 27 39 / 10%);
- --sl-shadow-lg: 0 24px 64px rgb(17 27 39 / 14%);
+ --coldark08: #006d6d;
+ --coldark09: #755f00;
+ --coldark10: #005a8e;
+ --coldark11: #116b00;
+ --coldark12: #af00af;
+ --coldark13: #7c00aa;
+ --coldark14: #a04900;
+ --coldark15: #c22f2e;
+
+ --sl-color-white: var(--coldark06);
+ --sl-color-gray-1: var(--coldark05);
+ --sl-color-gray-2: var(--coldark04);
+ --sl-color-gray-3: var(--coldark03);
+ --sl-color-gray-4: var(--coldark02);
+ --sl-color-gray-5: var(--coldark01);
+ --sl-color-gray-6: var(--coldark00);
+ --sl-color-gray-7: var(--coldark00);
+ --sl-color-black: var(--coldark00);
+
+ --sl-color-accent-high: var(--coldark10);
+ --sl-color-accent: var(--coldark10);
+ --sl-color-accent-low: var(--coldark02);
+
+ --sl-color-blue-high: var(--coldark10);
+ --sl-color-blue: var(--coldark10);
+ --sl-color-blue-low: var(--coldark02);
+ --sl-color-green-high: var(--coldark11);
+ --sl-color-green: var(--coldark11);
+ --sl-color-green-low: color-mix(
+ in srgb,
+ var(--coldark11) 18%,
+ var(--coldark00)
+ );
+ --sl-color-orange-high: var(--coldark14);
+ --sl-color-orange: var(--coldark14);
+ --sl-color-orange-low: color-mix(
+ in srgb,
+ var(--coldark14) 18%,
+ var(--coldark00)
+ );
+ --sl-color-purple-high: var(--coldark13);
+ --sl-color-purple: var(--coldark13);
+ --sl-color-purple-low: color-mix(
+ in srgb,
+ var(--coldark13) 18%,
+ var(--coldark00)
+ );
+ --sl-color-red-high: var(--coldark15);
+ --sl-color-red: var(--coldark15);
+ --sl-color-red-low: color-mix(
+ in srgb,
+ var(--coldark15) 18%,
+ var(--coldark00)
+ );
+
+ --sl-color-text: var(--coldark05);
+ --sl-color-text-accent: var(--coldark10);
+ --sl-color-text-invert: var(--coldark01);
+ --sl-color-bg: var(--coldark01);
+ --sl-color-bg-nav: var(--coldark00);
+ --sl-color-bg-sidebar: var(--coldark01);
+ --sl-color-bg-inline-code: color-mix(
+ in srgb,
+ var(--coldark02) 80%,
+ transparent
+ );
+ --sl-color-bg-accent: var(--coldark10);
+ --sl-color-hairline-light: color-mix(
+ in srgb,
+ var(--coldark03) 50%,
+ transparent
+ );
+ --sl-color-hairline: color-mix(in srgb, var(--coldark03) 70%, transparent);
+ --sl-color-hairline-shade: color-mix(
+ in srgb,
+ var(--coldark03) 40%,
+ transparent
+ );
+ --sl-color-backdrop-overlay: color-mix(
+ in srgb,
+ var(--coldark04) 42%,
+ transparent
+ );
+ --sl-shadow-md: 0 18px 40px
+ color-mix(in srgb, var(--coldark06) 10%, transparent);
+ --sl-shadow-lg: 0 24px 64px
+ color-mix(in srgb, var(--coldark06) 14%, transparent);
}
.hero-banner {
@@ -105,7 +179,9 @@
width: min(100%, 44rem);
display: block;
margin: 0 auto;
- filter: drop-shadow(0 16px 32px rgb(0 0 0 / 18%));
+ filter: drop-shadow(
+ 0 16px 32px color-mix(in srgb, var(--coldark07) 18%, transparent)
+ );
}
.palette-grid {
@@ -120,7 +196,11 @@
border: 1px solid var(--sl-color-hairline-light);
border-radius: 1rem;
background:
- linear-gradient(180deg, rgb(108 184 230 / 8%), transparent 45%),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark10) 8%, transparent),
+ transparent 45%
+ ),
var(--sl-color-bg-nav);
box-shadow: var(--sl-shadow-md);
}
@@ -144,12 +224,13 @@
}
.swatch {
- --swatch: #6cb8e6;
+ --swatch: var(--coldark10);
width: 1.1rem;
height: 1.1rem;
border-radius: 999px;
background: var(--swatch);
- box-shadow: inset 0 0 0 1px rgb(0 0 0 / 18%);
+ box-shadow: inset 0 0 0 1px
+ color-mix(in srgb, var(--coldark07) 18%, transparent);
flex: none;
}
@@ -161,10 +242,14 @@
background:
radial-gradient(
circle at top right,
- rgb(108 184 230 / 10%),
+ color-mix(in srgb, var(--coldark10) 10%, transparent),
transparent 35%
),
- linear-gradient(180deg, rgb(240 244 248 / 2%), transparent),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark00) 2%, transparent),
+ transparent
+ ),
var(--sl-color-bg-nav);
border-radius: 1rem;
}
@@ -174,10 +259,14 @@
background:
radial-gradient(
circle at top right,
- rgb(0 90 142 / 10%),
+ color-mix(in srgb, var(--coldark10) 10%, transparent),
transparent 35%
),
- linear-gradient(180deg, rgb(255 255 255 / 65%), transparent),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark00) 65%, transparent),
+ transparent
+ ),
var(--sl-color-bg-nav);
}
From 1bcc036ab6b7be79c694a77ee66760086a321d89 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 27 Mar 2026 00:30:19 +0100
Subject: [PATCH 06/23] feat: reorganize colors denomination from `coldark08`
to `coldark15`
---
README.md | 14 +-
packages/coldark-dircolors/README.md | 16 +-
packages/coldark-firefox/README.md | 2 +-
.../coldark-gtksourceview/coldark-cold.xml | 158 +++++++++---------
.../coldark-gtksourceview/coldark-dark.xml | 158 +++++++++---------
packages/coldark-vscode/README.md | 14 +-
website/src/content/docs/colors.mdx | 70 ++++----
.../docs/variants/coldark-dircolors.md | 10 +-
.../content/docs/variants/coldark-firefox.md | 2 +-
.../content/docs/variants/coldark-vscode.md | 14 +-
website/src/styles/coldark.css | 78 ++++-----
11 files changed, 268 insertions(+), 268 deletions(-)
diff --git a/README.md b/README.md
index 7e524c0..2861fd7 100644
--- a/README.md
+++ b/README.md
@@ -47,14 +47,14 @@ Coldark consists of three color palettes. The first is common to both versions.
| Denomination | Coldark Cold | Coldark Dark | Preview | General use |
| :----------: | :----------: | :----------: | :-----: | ----------- |
-| `coldark08` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for parameters, tags, CSS variables, and embedded punctuation |
-| `coldark09` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, booleans, and attribute names |
-| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for interactive accents, classes, variables, and headings |
+| `coldark08` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark09` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, keywords, and storage-like tokens |
+| `coldark10` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, booleans, and attribute names |
| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, and positive states |
-| `coldark12` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for regex, escapes, values, and high-visibility secondary accents |
-| `coldark13` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for functions and selector-like identifiers |
-| `coldark14` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, keywords, and storage-like tokens |
-| `coldark15` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark12` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for parameters, tags, CSS variables, and embedded punctuation |
+| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for interactive accents, classes, variables, and headings |
+| `coldark14` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for functions and selector-like identifiers |
+| `coldark15` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for regex, escapes, values, and high-visibility secondary accents |
## Variations
diff --git a/packages/coldark-dircolors/README.md b/packages/coldark-dircolors/README.md
index a94175e..9765ff4 100644
--- a/packages/coldark-dircolors/README.md
+++ b/packages/coldark-dircolors/README.md
@@ -26,18 +26,18 @@ This variant is designed for dircolors in conjunction with the [Coldark variant
Used as foreground for ignored files (e.g., `.log`, `.bak`).
- **Terminal white slot**
Used as foreground for missing files, files with setuid or setgid permissions, files with capability, and sticky not other writable directories.
-- **`coldark08`: Cyan accent**
- Used as foreground for symbolic links, regular files with more than one link, pipes and audio files.
-- **`coldark09`: Yellow accent**
+- **`coldark08`: Red accent**
+ Used as foreground for orphaned symbolic links and executable. Also used as background for missing files.
+- **`coldark10`: Yellow accent**
Used as foreground for socket files, block devices drivers and character device drivers and video files.
-- **`coldark10`: Blue accent**
- Used as foreground for directories and as background for sticky not other writable directories.
- **`coldark11`: Green accent**
Used as foreground for other writable directories, archives and various documents. Also used as background for sticky other writable directories.
-- **`coldark12`: Magenta accent**
+- **`coldark12`: Cyan accent**
+ Used as foreground for symbolic links, regular files with more than one link, pipes and audio files.
+- **`coldark13`: Blue accent**
+ Used as foreground for directories and as background for sticky not other writable directories.
+- **`coldark15`: Magenta accent**
Used as foreground for doors and images.
-- **`coldark15`: Red accent**
- Used as foreground for orphaned symbolic links and executable. Also used as background for missing files.
## Screenshots
diff --git a/packages/coldark-firefox/README.md b/packages/coldark-firefox/README.md
index a30bbf2..4af91ea 100644
--- a/packages/coldark-firefox/README.md
+++ b/packages/coldark-firefox/README.md
@@ -40,7 +40,7 @@ Firefox uses a small subset of the shared Coldark palette. The neutral denominat
| `coldark05` | `#213043` | `#213043` | ![#213043][#213043] | Selected tab, toolbar, and sidebar background in Coldark Dark |
| `coldark06` | `#111b27` | `#111b27` | ![#111b27][#111b27] | Default foreground in Coldark Cold and default background in Coldark Dark |
| `coldark07` | `#0b121b` | `#0b121b` | ![#0b121b][#0b121b] | Inactive frame, highlight, and border background in Coldark Dark |
-| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Special icons, focus border, selected tab border, tab loading, and field highlight |
+| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Special icons, focus border, selected tab border, tab loading, and field highlight |
For Coldark Cold specifically, the browser chrome also uses `coldark01` (`#e3eaf2`) as the main frame and field background, `coldark02` (`#d0dae7`) for selected tab and toolbar surfaces, `coldark03` (`#8da1b9`) for inactive frame and border emphasis, `coldark05` (`#213043`) for icon and popup foreground, and `coldark06` (`#111b27`) for the main foreground text.
diff --git a/packages/coldark-gtksourceview/coldark-cold.xml b/packages/coldark-gtksourceview/coldark-cold.xml
index a3110e7..3088cd1 100644
--- a/packages/coldark-gtksourceview/coldark-cold.xml
+++ b/packages/coldark-gtksourceview/coldark-cold.xml
@@ -20,14 +20,14 @@
-
-
-
+
+
+
-
-
-
-
+
+
+
+
@@ -38,138 +38,138 @@
-
-
+
+
-
+
-
+
-
-
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
-
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
+
+
+
-
-
-
-
+
+
+
+
-
-
+
+
-
-
-
+
+
+
-
-
-
-
-
+
+
+
+
+
-
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
+
+
-
-
+
+
-
+
-
-
-
+
+
+
-
+
diff --git a/packages/coldark-gtksourceview/coldark-dark.xml b/packages/coldark-gtksourceview/coldark-dark.xml
index 3c0c70d..301201d 100644
--- a/packages/coldark-gtksourceview/coldark-dark.xml
+++ b/packages/coldark-gtksourceview/coldark-dark.xml
@@ -20,14 +20,14 @@
-
-
-
+
+
+
-
-
-
-
+
+
+
+
@@ -38,138 +38,138 @@
-
-
+
+
-
+
-
+
-
-
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
-
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
+
+
+
-
-
-
-
+
+
+
+
-
-
+
+
-
-
-
+
+
+
-
-
-
-
-
+
+
+
+
+
-
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
+
+
-
-
+
+
-
+
-
-
-
+
+
+
-
+
diff --git a/packages/coldark-vscode/README.md b/packages/coldark-vscode/README.md
index 632174b..f299157 100644
--- a/packages/coldark-vscode/README.md
+++ b/packages/coldark-vscode/README.md
@@ -59,14 +59,14 @@ This variant is designed for [Visual Studio Code](https://code.visualstudio.com/
| Denomination | Coldark Cold | Coldark Dark | Preview | Usage in VS Code |
| :----------: | :----------: | :----------: | :-----: | ---------------- |
-| `coldark08` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark09` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark10` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, classes, variables, and headings |
+| `coldark08` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark09` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark10` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
-| `coldark13` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark14` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark15` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark12` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, classes, variables, and headings |
+| `coldark14` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark15` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
## How to install
diff --git a/website/src/content/docs/colors.mdx b/website/src/content/docs/colors.mdx
index ea27461..410c503 100644
--- a/website/src/content/docs/colors.mdx
+++ b/website/src/content/docs/colors.mdx
@@ -59,36 +59,36 @@ Coldark uses three palettes:
Coldark Cold accents
-
- #006d6d coldark08
+
+ #c22f2e coldark08
-
- #755f00 coldark09
+
+ #a04900 coldark09
-
- #005a8e coldark10
+
+ #755f00 coldark10
#116b00 coldark11
-
- #af00af coldark12
+
+ #006d6d coldark12
-
- #7c00aa coldark13
+
+ #005a8e coldark13
-
- #a04900 coldark14
+
+ #7c00aa coldark14
-
- #c22f2e coldark15
+
+ #af00af coldark15
@@ -96,36 +96,36 @@ Coldark uses three palettes:
Coldark Dark accents
-
- #66cccc coldark08
+
+ #cd6660 coldark08
-
- #e6d37a coldark09
+
+ #e9ae7e coldark09
-
- #6cb8e6 coldark10
+
+ #e6d37a coldark10
#91d076 coldark11
-
- #f4adf4 coldark12
+
+ #66cccc coldark12
-
- #c699e3 coldark13
+
+ #6cb8e6 coldark13
-
- #e9ae7e coldark14
+
+ #c699e3 coldark14
-
- #cd6660 coldark15
+
+ #f4adf4 coldark15
@@ -148,14 +148,14 @@ Coldark uses three palettes:
| Token | Coldark Cold | Coldark Dark | Role |
| ----------- | ------------ | ------------ | ------------------------------------------------------------------- |
-| `coldark08` | `#006d6d` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
-| `coldark09` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
-| `coldark10` | `#005a8e` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark08` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
+| `coldark09` | `#a04900` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
+| `coldark10` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, and link text. |
-| `coldark12` | `#af00af` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
-| `coldark13` | `#7c00aa` | `#c699e3` | Purple for functions and CSS classes or IDs. |
-| `coldark14` | `#a04900` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
-| `coldark15` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
+| `coldark12` | `#006d6d` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
+| `coldark13` | `#005a8e` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark14` | `#7c00aa` | `#c699e3` | Purple for functions and CSS classes or IDs. |
+| `coldark15` | `#af00af` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
## Source of truth
diff --git a/website/src/content/docs/variants/coldark-dircolors.md b/website/src/content/docs/variants/coldark-dircolors.md
index 77cd5c2..6f50c7b 100644
--- a/website/src/content/docs/variants/coldark-dircolors.md
+++ b/website/src/content/docs/variants/coldark-dircolors.md
@@ -20,12 +20,12 @@ Dircolors maps a smaller set of semantic Coldark colors to file kinds and shell
| Terminal black | Foreground for sticky other writable directories |
| Terminal bright black | Foreground for ignored files such as `.log` or `.bak` |
| Terminal white | Foreground for missing files, setuid or setgid files, files with capability, and sticky not other writable directories |
-| `coldark08` | Foreground for symbolic links, multi-link regular files, pipes, and audio files |
-| `coldark09` | Foreground for sockets, block devices, character devices, and video files |
-| `coldark10` | Foreground for directories and background for sticky not other writable directories |
+| `coldark08` | Foreground for orphaned symbolic links and executables, plus background for missing files |
+| `coldark10` | Foreground for sockets, block devices, character devices, and video files |
| `coldark11` | Foreground for other writable directories, archives, and many documents, plus background for sticky other writable directories |
-| `coldark12` | Foreground for doors and images |
-| `coldark15` | Foreground for orphaned symbolic links and executables, plus background for missing files |
+| `coldark12` | Foreground for symbolic links, multi-link regular files, pipes, and audio files |
+| `coldark13` | Foreground for directories and background for sticky not other writable directories |
+| `coldark15` | Foreground for doors and images |
## Installation
diff --git a/website/src/content/docs/variants/coldark-firefox.md b/website/src/content/docs/variants/coldark-firefox.md
index 7f77b74..294bc25 100644
--- a/website/src/content/docs/variants/coldark-firefox.md
+++ b/website/src/content/docs/variants/coldark-firefox.md
@@ -27,7 +27,7 @@ Firefox only exposes a smaller theming surface than editors like VS Code, so thi
| `coldark05` | `#213043` | `#213043` | Selected tab, toolbar, and sidebar background in Coldark Dark |
| `coldark06` | `#111b27` | `#111b27` | Main foreground in Coldark Cold and main frame background in Coldark Dark |
| `coldark07` | `#0b121b` | `#0b121b` | Inactive frame, highlight, and border background in Coldark Dark |
-| `coldark10` | `#005a8e` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
+| `coldark13` | `#005a8e` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
## Installation
diff --git a/website/src/content/docs/variants/coldark-vscode.md b/website/src/content/docs/variants/coldark-vscode.md
index 77e6fe2..7ff2125 100644
--- a/website/src/content/docs/variants/coldark-vscode.md
+++ b/website/src/content/docs/variants/coldark-vscode.md
@@ -37,14 +37,14 @@ This package is the reference implementation for Coldark. The main [Colors](../.
| Token | Coldark Cold | Coldark Dark | Role |
| --- | --- | --- | --- |
-| `coldark08` | `#006d6d` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark09` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark10` | `#005a8e` | `#6cb8e6` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark08` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark09` | `#a04900` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark10` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#af00af` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
-| `coldark13` | `#7c00aa` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark14` | `#a04900` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark15` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark12` | `#006d6d` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark13` | `#005a8e` | `#6cb8e6` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark14` | `#7c00aa` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark15` | `#af00af` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
## Implementation notes
diff --git a/website/src/styles/coldark.css b/website/src/styles/coldark.css
index 0105a66..1499f5b 100644
--- a/website/src/styles/coldark.css
+++ b/website/src/styles/coldark.css
@@ -11,14 +11,14 @@
--coldark05: #213043;
--coldark06: #111b27;
--coldark07: #0b121b;
- --coldark08: #66cccc;
- --coldark09: #e6d37a;
- --coldark10: #6cb8e6;
+ --coldark08: #cd6660;
+ --coldark09: #e9ae7e;
+ --coldark10: #e6d37a;
--coldark11: #91d076;
- --coldark12: #f4adf4;
- --coldark13: #c699e3;
- --coldark14: #e9ae7e;
- --coldark15: #cd6660;
+ --coldark12: #66cccc;
+ --coldark13: #6cb8e6;
+ --coldark14: #c699e3;
+ --coldark15: #f4adf4;
--sl-color-white: var(--coldark00);
--sl-color-gray-1: var(--coldark01);
@@ -30,23 +30,23 @@
--sl-color-black: var(--coldark07);
--sl-color-accent-low: var(--coldark05);
- --sl-color-accent: var(--coldark10);
+ --sl-color-accent: var(--coldark13);
--sl-color-accent-high: var(--coldark02);
--sl-color-blue-low: var(--coldark05);
- --sl-color-blue: var(--coldark10);
+ --sl-color-blue: var(--coldark13);
--sl-color-blue-high: var(--coldark02);
--sl-color-green-low: var(--coldark05);
--sl-color-green: var(--coldark11);
--sl-color-green-high: var(--coldark02);
--sl-color-orange-low: var(--coldark05);
- --sl-color-orange: var(--coldark14);
+ --sl-color-orange: var(--coldark09);
--sl-color-orange-high: var(--coldark00);
--sl-color-purple-low: var(--coldark05);
- --sl-color-purple: var(--coldark13);
+ --sl-color-purple: var(--coldark14);
--sl-color-purple-high: var(--coldark00);
--sl-color-red-low: var(--coldark05);
- --sl-color-red: var(--coldark15);
+ --sl-color-red: var(--coldark08);
--sl-color-red-high: var(--coldark00);
--sl-color-text: var(--coldark02);
@@ -60,7 +60,7 @@
var(--coldark05) 70%,
transparent
);
- --sl-color-bg-accent: var(--coldark10);
+ --sl-color-bg-accent: var(--coldark13);
--sl-color-hairline-light: color-mix(
in srgb,
var(--coldark03) 30%,
@@ -81,14 +81,14 @@
:root[data-theme="light"],
[data-theme="light"] ::backdrop {
- --coldark08: #006d6d;
- --coldark09: #755f00;
- --coldark10: #005a8e;
+ --coldark08: #c22f2e;
+ --coldark09: #a04900;
+ --coldark10: #755f00;
--coldark11: #116b00;
- --coldark12: #af00af;
- --coldark13: #7c00aa;
- --coldark14: #a04900;
- --coldark15: #c22f2e;
+ --coldark12: #006d6d;
+ --coldark13: #005a8e;
+ --coldark14: #7c00aa;
+ --coldark15: #af00af;
--sl-color-white: var(--coldark06);
--sl-color-gray-1: var(--coldark05);
@@ -100,12 +100,12 @@
--sl-color-gray-7: var(--coldark00);
--sl-color-black: var(--coldark00);
- --sl-color-accent-high: var(--coldark10);
- --sl-color-accent: var(--coldark10);
+ --sl-color-accent-high: var(--coldark13);
+ --sl-color-accent: var(--coldark13);
--sl-color-accent-low: var(--coldark02);
- --sl-color-blue-high: var(--coldark10);
- --sl-color-blue: var(--coldark10);
+ --sl-color-blue-high: var(--coldark13);
+ --sl-color-blue: var(--coldark13);
--sl-color-blue-low: var(--coldark02);
--sl-color-green-high: var(--coldark11);
--sl-color-green: var(--coldark11);
@@ -114,30 +114,30 @@
var(--coldark11) 18%,
var(--coldark00)
);
- --sl-color-orange-high: var(--coldark14);
- --sl-color-orange: var(--coldark14);
+ --sl-color-orange-high: var(--coldark09);
+ --sl-color-orange: var(--coldark09);
--sl-color-orange-low: color-mix(
in srgb,
- var(--coldark14) 18%,
+ var(--coldark09) 18%,
var(--coldark00)
);
- --sl-color-purple-high: var(--coldark13);
- --sl-color-purple: var(--coldark13);
+ --sl-color-purple-high: var(--coldark14);
+ --sl-color-purple: var(--coldark14);
--sl-color-purple-low: color-mix(
in srgb,
- var(--coldark13) 18%,
+ var(--coldark14) 18%,
var(--coldark00)
);
- --sl-color-red-high: var(--coldark15);
- --sl-color-red: var(--coldark15);
+ --sl-color-red-high: var(--coldark08);
+ --sl-color-red: var(--coldark08);
--sl-color-red-low: color-mix(
in srgb,
- var(--coldark15) 18%,
+ var(--coldark08) 18%,
var(--coldark00)
);
--sl-color-text: var(--coldark05);
- --sl-color-text-accent: var(--coldark10);
+ --sl-color-text-accent: var(--coldark13);
--sl-color-text-invert: var(--coldark01);
--sl-color-bg: var(--coldark01);
--sl-color-bg-nav: var(--coldark00);
@@ -147,7 +147,7 @@
var(--coldark02) 80%,
transparent
);
- --sl-color-bg-accent: var(--coldark10);
+ --sl-color-bg-accent: var(--coldark13);
--sl-color-hairline-light: color-mix(
in srgb,
var(--coldark03) 50%,
@@ -198,7 +198,7 @@
background:
linear-gradient(
180deg,
- color-mix(in srgb, var(--coldark10) 8%, transparent),
+ color-mix(in srgb, var(--coldark13) 8%, transparent),
transparent 45%
),
var(--sl-color-bg-nav);
@@ -224,7 +224,7 @@
}
.swatch {
- --swatch: var(--coldark10);
+ --swatch: var(--coldark13);
width: 1.1rem;
height: 1.1rem;
border-radius: 999px;
@@ -242,7 +242,7 @@
background:
radial-gradient(
circle at top right,
- color-mix(in srgb, var(--coldark10) 10%, transparent),
+ color-mix(in srgb, var(--coldark13) 10%, transparent),
transparent 35%
),
linear-gradient(
@@ -259,7 +259,7 @@
background:
radial-gradient(
circle at top right,
- color-mix(in srgb, var(--coldark10) 10%, transparent),
+ color-mix(in srgb, var(--coldark13) 10%, transparent),
transparent 35%
),
linear-gradient(
From 0dc586c07247fd7a991eaf69b61527f020cdd50b Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 27 Mar 2026 00:47:10 +0100
Subject: [PATCH 07/23] docs: add changeset for colors reorganization
---
.changeset/friendly-toads-judge.md | 16 ++++++++++++++++
1 file changed, 16 insertions(+)
create mode 100644 .changeset/friendly-toads-judge.md
diff --git a/.changeset/friendly-toads-judge.md b/.changeset/friendly-toads-judge.md
new file mode 100644
index 0000000..1987fda
--- /dev/null
+++ b/.changeset/friendly-toads-judge.md
@@ -0,0 +1,16 @@
+---
+"coldark-bat": major
+"coldark-dircolors": major
+"coldark-firefox": major
+"coldark-gtksourceview": major
+"coldark-prism": major
+"coldark-vscode": major
+"coldark-xfce4-terminal": major
+---
+
+Reorganizes the shared Coldark denominations to ease maintenance and variant porting.
+
+* `coldark00` to `coldark07` now form a stable neutral ramp ordered from the lightest common shade to the darkest.
+* `coldark08` to `coldark15` now form stable accent slots ordered by hue from red to magenta.
+
+The documentation have been updated to preserve the rendered colors while making the palette easier to understand, maintain, and port to other tools.
From 996e6a0333df37fa4233aa86cde4f9daf12917f2 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Fri, 27 Mar 2026 23:43:50 +0100
Subject: [PATCH 08/23] fix: start updating website CSS manually
---
.cspell/project-words.txt | 1 +
website/package.json | 1 -
website/src/content/docs/index.mdx | 8 +-
website/src/styles/coldark.css | 327 ++++++++++++++---------------
4 files changed, 166 insertions(+), 171 deletions(-)
diff --git a/.cspell/project-words.txt b/.cspell/project-words.txt
index dd55e23..cf09be9 100644
--- a/.cspell/project-words.txt
+++ b/.cspell/project-words.txt
@@ -24,6 +24,7 @@ pacman
prereq
rmvb
rxvt
+seti
Stackframe
svgz
tzst
diff --git a/website/package.json b/website/package.json
index d1029e7..662a4d5 100644
--- a/website/package.json
+++ b/website/package.json
@@ -5,7 +5,6 @@
"private": true,
"scripts": {
"dev": "astro dev",
- "start": "astro dev",
"build": "astro build",
"preview": "astro preview",
"astro": "astro"
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 892625b..db6f36b 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -52,17 +52,17 @@ import { Card, CardGrid } from "@astrojs/starlight/components";
The reference implementation of the Coldark palette for Visual Studio Code.
-
+
A web-friendly syntax highlighting theme for Prism.js.
A browser theme that follows the system preference and supports manual
switching.
-
+
Terminal syntax highlighting for bat with cold and dark variants.
-
+
File-type coloring for shells and tools that use `LS_COLORS`.
Terminal presets tailored for the XFCE4 terminal.
diff --git a/website/src/styles/coldark.css b/website/src/styles/coldark.css
index 1499f5b..1971d70 100644
--- a/website/src/styles/coldark.css
+++ b/website/src/styles/coldark.css
@@ -20,63 +20,56 @@
--coldark14: #c699e3;
--coldark15: #f4adf4;
- --sl-color-white: var(--coldark00);
- --sl-color-gray-1: var(--coldark01);
+ --sl-color-black: var(--coldark06);
+ --sl-color-blue-high: var(--sl-color-blue);
+ --sl-color-blue: var(--coldark13);
+ --sl-color-blue-low: color-mix(
+ in srgb,
+ var(--coldark13) 25%,
+ var(--coldark07)
+ );
+ --sl-color-green: var(--coldark11);
+ --sl-color-green-low: color-mix(
+ in srgb,
+ var(--coldark11) 25%,
+ var(--coldark07)
+ );
+ --sl-color-gray-1: var(--coldark00);
--sl-color-gray-2: var(--coldark02);
--sl-color-gray-3: var(--coldark03);
--sl-color-gray-4: var(--coldark04);
--sl-color-gray-5: var(--coldark05);
- --sl-color-gray-6: var(--coldark06);
- --sl-color-black: var(--coldark07);
-
- --sl-color-accent-low: var(--coldark05);
- --sl-color-accent: var(--coldark13);
- --sl-color-accent-high: var(--coldark02);
-
- --sl-color-blue-low: var(--coldark05);
- --sl-color-blue: var(--coldark13);
- --sl-color-blue-high: var(--coldark02);
- --sl-color-green-low: var(--coldark05);
- --sl-color-green: var(--coldark11);
- --sl-color-green-high: var(--coldark02);
- --sl-color-orange-low: var(--coldark05);
+ --sl-color-gray-6: var(--coldark07);
+ --sl-color-gray-7: var(--coldark06);
+ --sl-color-orange-high: var(--sl-color-orange);
--sl-color-orange: var(--coldark09);
- --sl-color-orange-high: var(--coldark00);
- --sl-color-purple-low: var(--coldark05);
- --sl-color-purple: var(--coldark14);
- --sl-color-purple-high: var(--coldark00);
- --sl-color-red-low: var(--coldark05);
- --sl-color-red: var(--coldark08);
- --sl-color-red-high: var(--coldark00);
-
- --sl-color-text: var(--coldark02);
- --sl-color-text-accent: var(--coldark01);
- --sl-color-text-invert: var(--coldark06);
- --sl-color-bg: var(--coldark06);
- --sl-color-bg-nav: var(--coldark07);
- --sl-color-bg-sidebar: var(--coldark07);
- --sl-color-bg-inline-code: color-mix(
+ --sl-color-orange-low: color-mix(
in srgb,
- var(--coldark05) 70%,
- transparent
+ var(--coldark09) 25%,
+ var(--coldark07)
);
- --sl-color-bg-accent: var(--coldark13);
- --sl-color-hairline-light: color-mix(
+ --sl-color-purple-high: var(--sl-color-purple);
+ --sl-color-purple: var(--coldark14);
+ --sl-color-purple-low: color-mix(
in srgb,
- var(--coldark03) 30%,
- transparent
+ var(--coldark14) 25%,
+ var(--coldark07)
);
- --sl-color-hairline: color-mix(in srgb, var(--coldark07) 90%, transparent);
- --sl-color-hairline-shade: var(--coldark07);
- --sl-color-backdrop-overlay: color-mix(
+ --sl-color-red-high: var(--sl-color-red);
+ --sl-color-red: var(--coldark08);
+ --sl-color-red-low: color-mix(
in srgb,
- var(--coldark07) 70%,
- transparent
+ var(--coldark08) 25%,
+ var(--coldark07)
);
- --sl-shadow-md: 0 18px 40px
- color-mix(in srgb, var(--coldark07) 28%, transparent);
- --sl-shadow-lg: 0 24px 64px
- color-mix(in srgb, var(--coldark07) 40%, transparent);
+ --sl-color-white: var(--coldark01);
+ --sl-color-accent-high: var(--sl-color-blue-high);
+ --sl-color-accent: var(--sl-color-blue);
+ --sl-color-accent-low: var(--sl-color-blue-low);
+ --sl-color-bg-nav: var(--coldark07);
+ --sl-color-bg-sidebar: var(--sl-color-bg);
+ --sl-color-hairline-shade: var(--sl-color-gray-6);
+ --sl-color-text-invert: var(--sl-color-black);
}
:root[data-theme="light"],
@@ -90,98 +83,128 @@
--coldark14: #7c00aa;
--coldark15: #af00af;
- --sl-color-white: var(--coldark06);
- --sl-color-gray-1: var(--coldark05);
- --sl-color-gray-2: var(--coldark04);
- --sl-color-gray-3: var(--coldark03);
- --sl-color-gray-4: var(--coldark02);
- --sl-color-gray-5: var(--coldark01);
- --sl-color-gray-6: var(--coldark00);
+ --sl-color-black: var(--coldark01);
+ --sl-color-gray-1: var(--coldark07);
+ --sl-color-gray-2: var(--coldark06);
+ --sl-color-gray-3: var(--coldark05);
+ --sl-color-gray-4: var(--coldark04);
+ --sl-color-gray-5: var(--coldark03);
+ --sl-color-gray-6: var(--coldark02);
--sl-color-gray-7: var(--coldark00);
- --sl-color-black: var(--coldark00);
-
- --sl-color-accent-high: var(--coldark13);
- --sl-color-accent: var(--coldark13);
- --sl-color-accent-low: var(--coldark02);
-
- --sl-color-blue-high: var(--coldark13);
- --sl-color-blue: var(--coldark13);
- --sl-color-blue-low: var(--coldark02);
- --sl-color-green-high: var(--coldark11);
- --sl-color-green: var(--coldark11);
+ --sl-color-white: var(--coldark06);
+ --sl-color-blue-low: color-mix(
+ in srgb,
+ var(--coldark13) 15%,
+ var(--coldark00)
+ );
--sl-color-green-low: color-mix(
in srgb,
- var(--coldark11) 18%,
+ var(--coldark11) 15%,
var(--coldark00)
);
- --sl-color-orange-high: var(--coldark09);
- --sl-color-orange: var(--coldark09);
--sl-color-orange-low: color-mix(
in srgb,
- var(--coldark09) 18%,
+ var(--coldark09) 15%,
var(--coldark00)
);
- --sl-color-purple-high: var(--coldark14);
- --sl-color-purple: var(--coldark14);
--sl-color-purple-low: color-mix(
in srgb,
- var(--coldark14) 18%,
+ var(--coldark14) 15%,
var(--coldark00)
);
- --sl-color-red-high: var(--coldark08);
- --sl-color-red: var(--coldark08);
--sl-color-red-low: color-mix(
in srgb,
- var(--coldark08) 18%,
+ var(--coldark08) 15%,
var(--coldark00)
);
+ }
- --sl-color-text: var(--coldark05);
- --sl-color-text-accent: var(--coldark13);
- --sl-color-text-invert: var(--coldark01);
- --sl-color-bg: var(--coldark01);
- --sl-color-bg-nav: var(--coldark00);
- --sl-color-bg-sidebar: var(--coldark01);
- --sl-color-bg-inline-code: color-mix(
- in srgb,
- var(--coldark02) 80%,
- transparent
- );
- --sl-color-bg-accent: var(--coldark13);
- --sl-color-hairline-light: color-mix(
- in srgb,
- var(--coldark03) 50%,
- transparent
- );
- --sl-color-hairline: color-mix(in srgb, var(--coldark03) 70%, transparent);
- --sl-color-hairline-shade: color-mix(
- in srgb,
- var(--coldark03) 40%,
- transparent
- );
- --sl-color-backdrop-overlay: color-mix(
- in srgb,
- var(--coldark04) 42%,
- transparent
- );
- --sl-shadow-md: 0 18px 40px
- color-mix(in srgb, var(--coldark06) 10%, transparent);
- --sl-shadow-lg: 0 24px 64px
- color-mix(in srgb, var(--coldark06) 14%, transparent);
+ :focus-visible {
+ outline-color: var(--sl-color-accent);
}
- .hero-banner {
- margin: 2rem 0 0;
- padding: 1rem 0 0;
+ body > a:first-child:focus {
+ accent-color: var(--coldark01);
+ background-color: var(--coldark04);
+ border: 1px solid var(--coldark03);
+ font-weight: 600;
}
- .hero-banner img {
- width: min(100%, 44rem);
- display: block;
- margin: 0 auto;
- filter: drop-shadow(
- 0 16px 32px color-mix(in srgb, var(--coldark07) 18%, transparent)
- );
+ .header {
+ --sl-color-black: var(--coldark02);
+ --sl-color-white: var(--coldark06);
+ --sl-color-text-accent: var(--sl-color-black);
+ accent-color: var(--coldark00);
+ }
+
+ .header a:hover {
+ color: var(--coldark00);
+ }
+
+ .header button {
+ --sl-color-black: var(--coldark06);
+ --sl-color-white: var(--coldark02);
+
+ &:hover {
+ background-color: var(--coldark05);
+ border-color: var(--coldark05);
+ }
+ }
+
+ :where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
+ .header
+ button {
+ background-color: var(--coldark01);
+
+ &:hover {
+ background-color: var(--coldark00);
+ border-color: var(--coldark01);
+ color: var(--sl-color-black);
+ }
+ }
+
+ .header label {
+ color: var(--sl-color-black);
+
+ &:hover {
+ color: var(--coldark00);
+ }
+ }
+
+ .header option {
+ background-color: var(--sl-color-gray-7);
+ }
+
+ .card {
+ --card-bg: var(--sl-color-gray-5);
+
+ background:
+ radial-gradient(
+ circle at right,
+ color-mix(in srgb, var(--coldark13) 5%, transparent),
+ transparent 20%
+ ),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark01) 2%, transparent),
+ transparent
+ ),
+ var(--card-bg);
+ border-color: var(--sl-color-gray-4);
+ border-radius: 0.5rem;
+ box-shadow: var(--sl-shadow-sm);
+ }
+
+ :where(:root[data-theme="light"], [data-theme="light"] ::backdrop) .card {
+ --card-bg: var(--sl-color-gray-7);
+
+ border-color: var(--sl-color-gray-6);
+ }
+
+ :where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
+ .pagination-links
+ a {
+ background: var(--coldark00);
}
.palette-grid {
@@ -192,9 +215,9 @@
}
.palette-card {
- padding: 1rem 1rem 0.75rem;
+ padding: 1rem;
border: 1px solid var(--sl-color-hairline-light);
- border-radius: 1rem;
+ border-radius: 0.5rem;
background:
linear-gradient(
180deg,
@@ -202,11 +225,22 @@
transparent 45%
),
var(--sl-color-bg-nav);
- box-shadow: var(--sl-shadow-md);
+ box-shadow: var(--sl-shadow-sm);
}
- .palette-card h3 {
- margin-top: 0;
+ [data-theme="light"] .palette-card {
+ background:
+ radial-gradient(
+ circle at top right,
+ color-mix(in srgb, var(--coldark13) 5%, transparent),
+ transparent 35%
+ ),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--sl-color-gray-7) 65%, transparent),
+ transparent
+ ),
+ var(--sl-color-gray-7);
}
.swatch-list {
@@ -223,55 +257,16 @@
font-size: 0.95rem;
}
+ .swatch-list p {
+ margin: 0;
+ }
+
.swatch {
- --swatch: var(--coldark13);
- width: 1.1rem;
- height: 1.1rem;
+ width: 1.2rem;
+ height: 1.2rem;
border-radius: 999px;
background: var(--swatch);
box-shadow: inset 0 0 0 1px
color-mix(in srgb, var(--coldark07) 18%, transparent);
- flex: none;
- }
-
- .sl-markdown-content a:not(.card) {
- text-decoration-thickness: 0.08em;
- }
-
- .card {
- background:
- radial-gradient(
- circle at top right,
- color-mix(in srgb, var(--coldark13) 10%, transparent),
- transparent 35%
- ),
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--coldark00) 2%, transparent),
- transparent
- ),
- var(--sl-color-bg-nav);
- border-radius: 1rem;
- }
-
- [data-theme="light"] .card,
- [data-theme="light"] .palette-card {
- background:
- radial-gradient(
- circle at top right,
- color-mix(in srgb, var(--coldark13) 10%, transparent),
- transparent 35%
- ),
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--coldark00) 65%, transparent),
- transparent
- ),
- var(--sl-color-bg-nav);
- }
-
- .site-title {
- letter-spacing: 0.02em;
- font-weight: 700;
}
}
From 1dd88f17641a6e57f424822bad487a83f0d5d371 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sat, 28 Mar 2026 23:44:41 +0100
Subject: [PATCH 09/23] chore: reorganize styles and override more Starlight
styles
---
website/src/styles/coldark.css | 279 +-------------------
website/src/styles/custom/palettes.css | 62 +++++
website/src/styles/overrides/base.css | 10 +
website/src/styles/overrides/cards.css | 25 ++
website/src/styles/overrides/header.css | 44 +++
website/src/styles/overrides/pagination.css | 5 +
website/src/styles/overrides/sidebars.css | 4 +
website/src/styles/tokens/colors.css | 117 ++++++++
website/src/styles/tokens/fonts.css | 26 ++
website/src/styles/tokens/spacings.css | 5 +
10 files changed, 307 insertions(+), 270 deletions(-)
create mode 100644 website/src/styles/custom/palettes.css
create mode 100644 website/src/styles/overrides/base.css
create mode 100644 website/src/styles/overrides/cards.css
create mode 100644 website/src/styles/overrides/header.css
create mode 100644 website/src/styles/overrides/pagination.css
create mode 100644 website/src/styles/overrides/sidebars.css
create mode 100644 website/src/styles/tokens/colors.css
create mode 100644 website/src/styles/tokens/fonts.css
create mode 100644 website/src/styles/tokens/spacings.css
diff --git a/website/src/styles/coldark.css b/website/src/styles/coldark.css
index 1971d70..adad251 100644
--- a/website/src/styles/coldark.css
+++ b/website/src/styles/coldark.css
@@ -1,272 +1,11 @@
@layer starlight, theme, utilities;
-@layer theme {
- :root,
- ::backdrop {
- --coldark00: #f0f4f8;
- --coldark01: #e3eaf2;
- --coldark02: #d0dae7;
- --coldark03: #8da1b9;
- --coldark04: #3c526d;
- --coldark05: #213043;
- --coldark06: #111b27;
- --coldark07: #0b121b;
- --coldark08: #cd6660;
- --coldark09: #e9ae7e;
- --coldark10: #e6d37a;
- --coldark11: #91d076;
- --coldark12: #66cccc;
- --coldark13: #6cb8e6;
- --coldark14: #c699e3;
- --coldark15: #f4adf4;
-
- --sl-color-black: var(--coldark06);
- --sl-color-blue-high: var(--sl-color-blue);
- --sl-color-blue: var(--coldark13);
- --sl-color-blue-low: color-mix(
- in srgb,
- var(--coldark13) 25%,
- var(--coldark07)
- );
- --sl-color-green: var(--coldark11);
- --sl-color-green-low: color-mix(
- in srgb,
- var(--coldark11) 25%,
- var(--coldark07)
- );
- --sl-color-gray-1: var(--coldark00);
- --sl-color-gray-2: var(--coldark02);
- --sl-color-gray-3: var(--coldark03);
- --sl-color-gray-4: var(--coldark04);
- --sl-color-gray-5: var(--coldark05);
- --sl-color-gray-6: var(--coldark07);
- --sl-color-gray-7: var(--coldark06);
- --sl-color-orange-high: var(--sl-color-orange);
- --sl-color-orange: var(--coldark09);
- --sl-color-orange-low: color-mix(
- in srgb,
- var(--coldark09) 25%,
- var(--coldark07)
- );
- --sl-color-purple-high: var(--sl-color-purple);
- --sl-color-purple: var(--coldark14);
- --sl-color-purple-low: color-mix(
- in srgb,
- var(--coldark14) 25%,
- var(--coldark07)
- );
- --sl-color-red-high: var(--sl-color-red);
- --sl-color-red: var(--coldark08);
- --sl-color-red-low: color-mix(
- in srgb,
- var(--coldark08) 25%,
- var(--coldark07)
- );
- --sl-color-white: var(--coldark01);
- --sl-color-accent-high: var(--sl-color-blue-high);
- --sl-color-accent: var(--sl-color-blue);
- --sl-color-accent-low: var(--sl-color-blue-low);
- --sl-color-bg-nav: var(--coldark07);
- --sl-color-bg-sidebar: var(--sl-color-bg);
- --sl-color-hairline-shade: var(--sl-color-gray-6);
- --sl-color-text-invert: var(--sl-color-black);
- }
-
- :root[data-theme="light"],
- [data-theme="light"] ::backdrop {
- --coldark08: #c22f2e;
- --coldark09: #a04900;
- --coldark10: #755f00;
- --coldark11: #116b00;
- --coldark12: #006d6d;
- --coldark13: #005a8e;
- --coldark14: #7c00aa;
- --coldark15: #af00af;
-
- --sl-color-black: var(--coldark01);
- --sl-color-gray-1: var(--coldark07);
- --sl-color-gray-2: var(--coldark06);
- --sl-color-gray-3: var(--coldark05);
- --sl-color-gray-4: var(--coldark04);
- --sl-color-gray-5: var(--coldark03);
- --sl-color-gray-6: var(--coldark02);
- --sl-color-gray-7: var(--coldark00);
- --sl-color-white: var(--coldark06);
- --sl-color-blue-low: color-mix(
- in srgb,
- var(--coldark13) 15%,
- var(--coldark00)
- );
- --sl-color-green-low: color-mix(
- in srgb,
- var(--coldark11) 15%,
- var(--coldark00)
- );
- --sl-color-orange-low: color-mix(
- in srgb,
- var(--coldark09) 15%,
- var(--coldark00)
- );
- --sl-color-purple-low: color-mix(
- in srgb,
- var(--coldark14) 15%,
- var(--coldark00)
- );
- --sl-color-red-low: color-mix(
- in srgb,
- var(--coldark08) 15%,
- var(--coldark00)
- );
- }
-
- :focus-visible {
- outline-color: var(--sl-color-accent);
- }
-
- body > a:first-child:focus {
- accent-color: var(--coldark01);
- background-color: var(--coldark04);
- border: 1px solid var(--coldark03);
- font-weight: 600;
- }
-
- .header {
- --sl-color-black: var(--coldark02);
- --sl-color-white: var(--coldark06);
- --sl-color-text-accent: var(--sl-color-black);
- accent-color: var(--coldark00);
- }
-
- .header a:hover {
- color: var(--coldark00);
- }
-
- .header button {
- --sl-color-black: var(--coldark06);
- --sl-color-white: var(--coldark02);
-
- &:hover {
- background-color: var(--coldark05);
- border-color: var(--coldark05);
- }
- }
-
- :where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
- .header
- button {
- background-color: var(--coldark01);
-
- &:hover {
- background-color: var(--coldark00);
- border-color: var(--coldark01);
- color: var(--sl-color-black);
- }
- }
-
- .header label {
- color: var(--sl-color-black);
-
- &:hover {
- color: var(--coldark00);
- }
- }
-
- .header option {
- background-color: var(--sl-color-gray-7);
- }
-
- .card {
- --card-bg: var(--sl-color-gray-5);
-
- background:
- radial-gradient(
- circle at right,
- color-mix(in srgb, var(--coldark13) 5%, transparent),
- transparent 20%
- ),
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--coldark01) 2%, transparent),
- transparent
- ),
- var(--card-bg);
- border-color: var(--sl-color-gray-4);
- border-radius: 0.5rem;
- box-shadow: var(--sl-shadow-sm);
- }
-
- :where(:root[data-theme="light"], [data-theme="light"] ::backdrop) .card {
- --card-bg: var(--sl-color-gray-7);
-
- border-color: var(--sl-color-gray-6);
- }
-
- :where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
- .pagination-links
- a {
- background: var(--coldark00);
- }
-
- .palette-grid {
- display: grid;
- gap: 1rem;
- grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
- margin: 1.5rem 0 2rem;
- }
-
- .palette-card {
- padding: 1rem;
- border: 1px solid var(--sl-color-hairline-light);
- border-radius: 0.5rem;
- background:
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--coldark13) 8%, transparent),
- transparent 45%
- ),
- var(--sl-color-bg-nav);
- box-shadow: var(--sl-shadow-sm);
- }
-
- [data-theme="light"] .palette-card {
- background:
- radial-gradient(
- circle at top right,
- color-mix(in srgb, var(--coldark13) 5%, transparent),
- transparent 35%
- ),
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--sl-color-gray-7) 65%, transparent),
- transparent
- ),
- var(--sl-color-gray-7);
- }
-
- .swatch-list {
- list-style: none;
- padding: 0;
- margin: 0.75rem 0 0;
- }
-
- .swatch-list li {
- display: flex;
- align-items: center;
- gap: 0.75rem;
- padding: 0.4rem 0;
- font-size: 0.95rem;
- }
-
- .swatch-list p {
- margin: 0;
- }
-
- .swatch {
- width: 1.2rem;
- height: 1.2rem;
- border-radius: 999px;
- background: var(--swatch);
- box-shadow: inset 0 0 0 1px
- color-mix(in srgb, var(--coldark07) 18%, transparent);
- }
-}
+@import url("tokens/colors.css") layer(theme);
+@import url("tokens/fonts.css") layer(theme);
+@import url("tokens/spacings.css") layer(theme);
+@import url("overrides/base.css") layer(theme);
+@import url("overrides/cards.css") layer(theme);
+@import url("overrides/header.css") layer(theme);
+@import url("overrides/pagination.css") layer(theme);
+@import url("overrides/sidebars.css") layer(theme);
+@import url("custom/palettes.css") layer(theme);
diff --git a/website/src/styles/custom/palettes.css b/website/src/styles/custom/palettes.css
new file mode 100644
index 0000000..5227932
--- /dev/null
+++ b/website/src/styles/custom/palettes.css
@@ -0,0 +1,62 @@
+.palette-grid {
+ display: grid;
+ gap: 1rem;
+ grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
+ margin: 1.5rem 0 2rem;
+}
+
+.palette-card {
+ padding: 1rem;
+ border: 1px solid var(--sl-color-hairline-light);
+ border-radius: 0.5rem;
+ background:
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark13) 8%, transparent),
+ transparent 45%
+ ),
+ var(--sl-color-bg-nav);
+ box-shadow: var(--sl-shadow-sm);
+}
+
+[data-theme="light"] .palette-card {
+ background:
+ radial-gradient(
+ circle at top right,
+ color-mix(in srgb, var(--coldark13) 5%, transparent),
+ transparent 35%
+ ),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--sl-color-gray-7) 65%, transparent),
+ transparent
+ ),
+ var(--sl-color-gray-7);
+}
+
+.swatch-list {
+ list-style: none;
+ padding: 0;
+ margin: 0.75rem 0 0;
+}
+
+.swatch-list li {
+ display: flex;
+ align-items: center;
+ gap: 0.75rem;
+ padding: 0.4rem 0;
+ font-size: 0.95rem;
+}
+
+.swatch-list p {
+ margin: 0;
+}
+
+.swatch {
+ width: 1.2rem;
+ height: 1.2rem;
+ border-radius: 999px;
+ background: var(--swatch);
+ box-shadow: inset 0 0 0 1px
+ color-mix(in srgb, var(--coldark07) 18%, transparent);
+}
diff --git a/website/src/styles/overrides/base.css b/website/src/styles/overrides/base.css
new file mode 100644
index 0000000..b775a64
--- /dev/null
+++ b/website/src/styles/overrides/base.css
@@ -0,0 +1,10 @@
+:focus-visible {
+ outline-color: var(--sl-color-accent);
+}
+
+body > a:first-child:focus {
+ accent-color: var(--coldark01);
+ background-color: var(--coldark04);
+ border: 1px solid var(--coldark03);
+ font-weight: 600;
+}
diff --git a/website/src/styles/overrides/cards.css b/website/src/styles/overrides/cards.css
new file mode 100644
index 0000000..5d80f6d
--- /dev/null
+++ b/website/src/styles/overrides/cards.css
@@ -0,0 +1,25 @@
+.card {
+ --card-bg: var(--sl-color-gray-5);
+
+ background:
+ radial-gradient(
+ circle at right,
+ color-mix(in srgb, var(--coldark13) 5%, transparent),
+ transparent 20%
+ ),
+ linear-gradient(
+ 180deg,
+ color-mix(in srgb, var(--coldark01) 2%, transparent),
+ transparent
+ ),
+ var(--card-bg);
+ border-color: var(--sl-color-gray-4);
+ border-radius: 0.5rem;
+ box-shadow: var(--sl-shadow-sm);
+}
+
+:where(:root[data-theme="light"], [data-theme="light"] ::backdrop) .card {
+ --card-bg: var(--sl-color-gray-7);
+
+ border-color: var(--sl-color-gray-6);
+}
diff --git a/website/src/styles/overrides/header.css b/website/src/styles/overrides/header.css
new file mode 100644
index 0000000..02c765a
--- /dev/null
+++ b/website/src/styles/overrides/header.css
@@ -0,0 +1,44 @@
+.header {
+ --sl-color-black: var(--coldark02);
+ --sl-color-white: var(--coldark06);
+ --sl-color-text-accent: var(--sl-color-black);
+ accent-color: var(--coldark00);
+}
+
+.header a:hover {
+ color: var(--coldark00);
+}
+
+.header button {
+ --sl-color-black: var(--coldark06);
+ --sl-color-white: var(--coldark02);
+
+ &:hover {
+ background-color: var(--coldark05);
+ border-color: var(--coldark05);
+ }
+}
+
+:where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
+ .header
+ button {
+ background-color: var(--coldark01);
+
+ &:hover {
+ background-color: var(--coldark00);
+ border-color: var(--coldark01);
+ color: var(--sl-color-black);
+ }
+}
+
+.header label {
+ color: var(--sl-color-black);
+
+ &:hover {
+ color: var(--coldark00);
+ }
+}
+
+.header option {
+ background-color: var(--sl-color-gray-7);
+}
diff --git a/website/src/styles/overrides/pagination.css b/website/src/styles/overrides/pagination.css
new file mode 100644
index 0000000..89fcb00
--- /dev/null
+++ b/website/src/styles/overrides/pagination.css
@@ -0,0 +1,5 @@
+:where(:root[data-theme="light"], [data-theme="light"] ::backdrop)
+ .pagination-links
+ a {
+ background: var(--coldark00);
+}
diff --git a/website/src/styles/overrides/sidebars.css b/website/src/styles/overrides/sidebars.css
new file mode 100644
index 0000000..9c7bfd3
--- /dev/null
+++ b/website/src/styles/overrides/sidebars.css
@@ -0,0 +1,4 @@
+.sidebar-content,
+.right-sidebar-panel {
+ padding: var(--sl-sidebar-pad-x);
+}
diff --git a/website/src/styles/tokens/colors.css b/website/src/styles/tokens/colors.css
new file mode 100644
index 0000000..722287c
--- /dev/null
+++ b/website/src/styles/tokens/colors.css
@@ -0,0 +1,117 @@
+:root,
+::backdrop {
+ --coldark00: #f0f4f8;
+ --coldark01: #e3eaf2;
+ --coldark02: #d0dae7;
+ --coldark03: #8da1b9;
+ --coldark04: #3c526d;
+ --coldark05: #213043;
+ --coldark06: #111b27;
+ --coldark07: #0b121b;
+ --coldark08: #cd6660;
+ --coldark09: #e9ae7e;
+ --coldark10: #e6d37a;
+ --coldark11: #91d076;
+ --coldark12: #66cccc;
+ --coldark13: #6cb8e6;
+ --coldark14: #c699e3;
+ --coldark15: #f4adf4;
+
+ --sl-color-black: var(--coldark06);
+ --sl-color-blue-high: var(--sl-color-blue);
+ --sl-color-blue: var(--coldark13);
+ --sl-color-blue-low: color-mix(
+ in srgb,
+ var(--coldark13) 25%,
+ var(--coldark07)
+ );
+ --sl-color-green: var(--coldark11);
+ --sl-color-green-low: color-mix(
+ in srgb,
+ var(--coldark11) 25%,
+ var(--coldark07)
+ );
+ --sl-color-gray-1: var(--coldark00);
+ --sl-color-gray-2: var(--coldark02);
+ --sl-color-gray-3: var(--coldark03);
+ --sl-color-gray-4: var(--coldark04);
+ --sl-color-gray-5: var(--coldark05);
+ --sl-color-gray-6: var(--coldark07);
+ --sl-color-gray-7: var(--coldark06);
+ --sl-color-orange-high: var(--sl-color-orange);
+ --sl-color-orange: var(--coldark09);
+ --sl-color-orange-low: color-mix(
+ in srgb,
+ var(--coldark09) 25%,
+ var(--coldark07)
+ );
+ --sl-color-purple-high: var(--sl-color-purple);
+ --sl-color-purple: var(--coldark14);
+ --sl-color-purple-low: color-mix(
+ in srgb,
+ var(--coldark14) 25%,
+ var(--coldark07)
+ );
+ --sl-color-red-high: var(--sl-color-red);
+ --sl-color-red: var(--coldark08);
+ --sl-color-red-low: color-mix(
+ in srgb,
+ var(--coldark08) 25%,
+ var(--coldark07)
+ );
+ --sl-color-white: var(--coldark01);
+ --sl-color-accent-high: var(--sl-color-blue-high);
+ --sl-color-accent: var(--sl-color-blue);
+ --sl-color-accent-low: var(--sl-color-blue-low);
+ --sl-color-bg-nav: var(--coldark07);
+ --sl-color-bg-sidebar: var(--sl-color-bg);
+ --sl-color-hairline-shade: var(--sl-color-gray-6);
+ --sl-color-text-invert: var(--sl-color-black);
+}
+
+:root[data-theme="light"],
+[data-theme="light"] ::backdrop {
+ --coldark08: #c22f2e;
+ --coldark09: #a04900;
+ --coldark10: #755f00;
+ --coldark11: #116b00;
+ --coldark12: #006d6d;
+ --coldark13: #005a8e;
+ --coldark14: #7c00aa;
+ --coldark15: #af00af;
+
+ --sl-color-black: var(--coldark01);
+ --sl-color-gray-1: var(--coldark07);
+ --sl-color-gray-2: var(--coldark06);
+ --sl-color-gray-3: var(--coldark05);
+ --sl-color-gray-4: var(--coldark04);
+ --sl-color-gray-5: var(--coldark03);
+ --sl-color-gray-6: var(--coldark02);
+ --sl-color-gray-7: var(--coldark00);
+ --sl-color-white: var(--coldark06);
+ --sl-color-blue-low: color-mix(
+ in srgb,
+ var(--coldark13) 15%,
+ var(--coldark00)
+ );
+ --sl-color-green-low: color-mix(
+ in srgb,
+ var(--coldark11) 15%,
+ var(--coldark00)
+ );
+ --sl-color-orange-low: color-mix(
+ in srgb,
+ var(--coldark09) 15%,
+ var(--coldark00)
+ );
+ --sl-color-purple-low: color-mix(
+ in srgb,
+ var(--coldark14) 15%,
+ var(--coldark00)
+ );
+ --sl-color-red-low: color-mix(
+ in srgb,
+ var(--coldark08) 15%,
+ var(--coldark00)
+ );
+}
diff --git a/website/src/styles/tokens/fonts.css b/website/src/styles/tokens/fonts.css
new file mode 100644
index 0000000..483f3d1
--- /dev/null
+++ b/website/src/styles/tokens/fonts.css
@@ -0,0 +1,26 @@
+:root,
+::backdrop {
+ --font-size-base: 16;
+ --font-size-ratio: 1.125;
+ --font-weight-regular: 400;
+ --font-weight-bold: 600;
+ --line-height: 1.618;
+ --one-px-in-rem: 0.0625rem;
+
+ --sl-line-height: var(--line-height);
+ --sl-line-height-headings: calc(var(--line-height) * 1.25);
+ --sl-text-base: clamp(
+ calc(var(--one-px-in-rem) * var(--font-size-base)),
+ calc(calc(var(--one-px-in-rem) * var(--font-size-base)) + 0.075dvw),
+ calc(var(--one-px-in-rem) * var(--font-size-base) * 2)
+ );
+ --sl-text-xs: calc(var(--sl-text-base) / pow(var(--font-size-ratio), 2));
+ --sl-text-sm: calc(var(--sl-text-base) / var(--font-size-ratio));
+ --sl-text-lg: calc(var(--sl-text-base) * var(--font-size-ratio));
+ --sl-text-xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 2));
+ --sl-text-2xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 3));
+ --sl-text-3xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 4));
+ --sl-text-4xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 5));
+ --sl-text-5xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 6));
+ --sl-text-6xl: calc(var(--sl-text-base) * pow(var(--font-size-ratio), 7));
+}
diff --git a/website/src/styles/tokens/spacings.css b/website/src/styles/tokens/spacings.css
new file mode 100644
index 0000000..a697552
--- /dev/null
+++ b/website/src/styles/tokens/spacings.css
@@ -0,0 +1,5 @@
+:root,
+::backdrop {
+ --spacing-ratio: 1.618;
+ --sl-sidebar-pad-x: calc(var(--spacing-ratio) * 1rem);
+}
From 73f71768f400dcbd913d1ea72d5a6134e04e1546 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sat, 28 Mar 2026 23:56:00 +0100
Subject: [PATCH 10/23] revert: move color reorganization to dedicated branch
---
.changeset/friendly-toads-judge.md | 16 --
README.md | 72 +++---
.../coldark-assets/common-shades-palette.svg | 71 +++---
packages/coldark-dircolors/README.md | 26 +--
packages/coldark-firefox/README.md | 38 ++--
.../coldark-gtksourceview/coldark-cold.xml | 208 +++++++++---------
.../coldark-gtksourceview/coldark-dark.xml | 198 ++++++++---------
packages/coldark-vscode/README.md | 70 +++---
8 files changed, 358 insertions(+), 341 deletions(-)
delete mode 100644 .changeset/friendly-toads-judge.md
diff --git a/.changeset/friendly-toads-judge.md b/.changeset/friendly-toads-judge.md
deleted file mode 100644
index 1987fda..0000000
--- a/.changeset/friendly-toads-judge.md
+++ /dev/null
@@ -1,16 +0,0 @@
----
-"coldark-bat": major
-"coldark-dircolors": major
-"coldark-firefox": major
-"coldark-gtksourceview": major
-"coldark-prism": major
-"coldark-vscode": major
-"coldark-xfce4-terminal": major
----
-
-Reorganizes the shared Coldark denominations to ease maintenance and variant porting.
-
-* `coldark00` to `coldark07` now form a stable neutral ramp ordered from the lightest common shade to the darkest.
-* `coldark08` to `coldark15` now form stable accent slots ordered by hue from red to magenta.
-
-The documentation have been updated to preserve the rendered colors while making the palette easier to understand, maintain, and port to other tools.
diff --git a/README.md b/README.md
index 2861fd7..70526f8 100644
--- a/README.md
+++ b/README.md
@@ -26,35 +26,49 @@ Coldark consists of three color palettes. The first is common to both versions.
## Colors in detail
-`coldark00` to `coldark07` are the shared neutral ramp, ordered from the lightest shade to the darkest.
-
-`coldark08` to `coldark15` are fixed accent slots by hue. Their role stays the same between variants, while their hex value changes to fit the light or dark context.
-
-### Common shades
-
-| Denomination | Hex Code | Preview | General use |
-| :----------: | :------: | :-----: | ----------- |
-| `coldark00` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Lightest background and elevated surfaces |
-| `coldark01` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Soft backgrounds and bright UI surfaces |
-| `coldark02` | `#d0dae7` | ![#d0dae7][#d0dae7] | Light foregrounds and secondary surfaces |
-| `coldark03` | `#8da1b9` | ![#8da1b9][#8da1b9] | Selections, borders, muted emphasis |
-| `coldark04` | `#3c526d` | ![#3c526d][#3c526d] | Comments, placeholders, subdued text |
-| `coldark05` | `#213043` | ![#213043][#213043] | Strong surfaces and supporting foregrounds |
-| `coldark06` | `#111b27` | ![#111b27][#111b27] | Default dark foreground or background, depending on variant |
-| `coldark07` | `#0b121b` | ![#0b121b][#0b121b] | Deepest structural background |
-
-### Accent colors
-
-| Denomination | Coldark Cold | Coldark Dark | Preview | General use |
-| :----------: | :----------: | :----------: | :-----: | ----------- |
-| `coldark08` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
-| `coldark09` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, keywords, and storage-like tokens |
-| `coldark10` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, booleans, and attribute names |
-| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, and positive states |
-| `coldark12` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for parameters, tags, CSS variables, and embedded punctuation |
-| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for interactive accents, classes, variables, and headings |
-| `coldark14` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for functions and selector-like identifiers |
-| `coldark15` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for regex, escapes, values, and high-visibility secondary accents |
+I tried to keep the same descriptions for both versions. However, for complex themes like VS Code, it doesn't work. So I separated the descriptions into 2 sections.
+
+### Light Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :------: | :-----: | ----------- | :----------: |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Darker background** - Editor Gutter, Inputs, Line Highlight, Status bar (no folder). Also used as foreground for Activity bar. | `coldark01` |
+| `#8da1b9` | ![#8da1b9][#8da1b9] | **Selection background** - Code block, Secondary buttons, Some highlighting. Also used for Borders. | `coldark02` |
+| `#3c526d` | ![#3c526d][#3c526d] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
+| `#213043` | ![#213043][#213043] | **Lighter foreground** – Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
+| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Also used as Shadow and for most of Punctuation. | `coldark05` |
+| `#0b121b` | ![#0b121b][#0b121b] | **Darker foreground** – Also used as background for Activity bar. | `coldark06` |
+| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter background** – Tab active, Embedded modals, Widgets. | `coldark07` |
+| `#006d6d` | ![#006d6d][#006d6d] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
+| `#755f00` | ![#755f00][#755f00] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
+| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
+| `#116b00` | ![#116b00][#116b00] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
+| `#af00af` | ![#af00af][#af00af] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
+| `#7c00aa` | ![#7c00aa][#7c00aa] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
+| `#a04900` | ![#a04900][#a04900] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
+| `#c22f2e` | ![#c22f2e][#c22f2e] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
+
+### Dark Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :------: | :-----: | ----------- | :----------: |
+| `#111b27` | ![#111b27][#111b27] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
+| `#213043` | ![#213043][#213043] | **Light background** - Editor Gutter, Embedded modals, Widgets, Line Highlight, Tab active. | `coldark01` |
+| `#3c526d` | ![#3c526d][#3c526d] | **Selection background** - Code block, Secondary buttons, Some highlighting. | `coldark02` |
+| `#8da1b9` | ![#8da1b9][#8da1b9] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Activity bar, Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Also used for most of Punctuation. | `coldark05` |
+| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter foreground** – Menu, Tab hover. | `coldark06` |
+| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Activity bar, Inputs, Status bar (no folder). Also used for Borders. | `coldark07` |
+| `#66cccc` | ![#66cccc][#66cccc] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
+| `#e6d37a` | ![#e6d37a][#e6d37a] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
+| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
+| `#91d076` | ![#91d076][#91d076] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
+| `#f4adf4` | ![#f4adf4][#f4adf4] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
+| `#c699e3` | ![#c699e3][#c699e3] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
+| `#e9ae7e` | ![#e9ae7e][#e9ae7e] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
+| `#cd6660` | ![#cd6660][#cd6660] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
## Variations
diff --git a/packages/coldark-assets/common-shades-palette.svg b/packages/coldark-assets/common-shades-palette.svg
index b21c16f..01015a7 100644
--- a/packages/coldark-assets/common-shades-palette.svg
+++ b/packages/coldark-assets/common-shades-palette.svg
@@ -5,71 +5,70 @@
xmlns="http://www.w3.org/2000/svg">
+ d="M 0,530 H 1200 V 630 H 0 Z" />
+ d="M 0,0 H 1200 V 198 H 0 Z" />
+ d="m 0,202 h 1200 v 20 H 0 Z" />
+ style="fill:#0b121b"
+ d="M 0,526 V 226 h 150 v 300 z" />
+ style="fill:#111b27"
+ d="M 150,526 V 226 h 150 v 300 z" />
+ style="fill:#213043"
+ d="M 300,526 V 226 h 150 v 300 z" />
+ style="fill:#3c526d"
+ d="M 450,526 V 226 h 150 v 300 z" />
+ d="M 600,526 V 226 h 150 v 300 z" />
+ style="fill:#d0dae7"
+ d="M 750,526 V 226 h 150 v 300 z" />
+ style="fill:#e3eaf2"
+ d="M 900,526 V 226 h 150 v 300 z" />
+ style="fill:#f0f4f8"
+ d="M 1050,526 V 226 h 150 v 300 z" />
+ style="fill:#e3eaf2"
+ d="m 40.664055,583.39258 -0.89062,4.8164 h -1.67578 l 0.89062,-4.8164 h -3.16406 l -0.86719,4.8164 h -1.71093 l 0.89062,-4.8164 h -1.83984 v -1.4414 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44142 h 3.02343 l 0.85547,-4.65233 h 1.6875 l -0.86718,4.65233 h 3.16406 l 0.86719,-4.65233 h 1.67578 l -0.86719,4.65233 h 1.82812 v 1.44142 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.4414 z m -3.9375,-4.80469 -0.62109,3.36328 h 3.16406 l 0.63282,-3.36328 z m 18.33985,1.69921 q 0,8.15625 -5.15625,8.15625 -2.48438,0 -3.75,-2.08593 -1.26563,-2.08594 -1.26563,-6.07032 0,-3.90233 1.26563,-5.96483 1.26562,-2.07422 3.84375,-2.07422 2.48437,0 3.77344,2.05077 1.28906,2.03907 1.28906,5.98828 z m -3.4336,0 q 0,-3.65625 -0.41015,-5.25 -0.41016,-1.60546 -1.28906,-1.60546 -0.86719,0 -1.24219,1.54688 -0.36328,1.54687 -0.36328,5.30858 0,3.82032 0.375,5.40235 0.375,1.58203 1.23047,1.58203 0.86718,0 1.27734,-1.61718 0.42187,-1.62891 0.42187,-5.3672 z m 13.28907,2.09767 q 0,-2.16797 -0.53907,-3.17579 -0.52734,-1.0078 -1.74609,-1.0078 -0.44531,0 -0.97266,0.10547 -0.52734,0.0937 -0.86718,0.29296 v 8.42579 q 0.75,0.1875 1.83984,0.1875 1.16016,0 1.72266,-1.125 0.5625,-1.13672 0.5625,-3.70313 z m -7.51172,-9.79688 -1.125,-0.26954 v -0.76171 h 4.51172 v 4.04296 q 0,1.08985 -0.11719,2.21485 0.46875,-0.38672 1.34766,-0.64452 0.89062,-0.26953 1.73437,-0.26953 2.39063,0 3.49219,1.3125 1.10156,1.3125 1.10156,4.18358 0,2.83595 -1.41797,4.44142 -1.40625,1.60546 -3.97265,1.60546 -1.89844,0 -5.55469,-0.79688 z m 19.94531,14.33203 2.73047,0.28125 v 1.00781 h -8.83594 v -1.00781 l 2.71875,-0.28125 v -11.84765 l -2.70703,0.89062 v -0.9961 l 4.42969,-2.60156 h 1.66406 z m 14.94141,1.28906 h -9.96094 v -2.21484 q 1.00781,-1.07812 1.86328,-1.93359 1.875,-1.85157 2.74219,-2.90625 0.86719,-1.06641 1.26562,-2.20313 0.41016,-1.13672 0.41016,-2.58985 0,-1.27734 -0.62109,-2.0625 -0.6211,-0.78515 -1.65235,-0.78515 -0.72656,0 -1.16015,0.15235 -0.4336,0.15233 -0.79688,0.45702 l -0.50391,2.27344 h -1.01953 v -3.57422 q 0.9375,-0.21094 1.82813,-0.35156 0.90234,-0.15235 1.95703,-0.15235 2.58984,0 3.96094,1.06641 1.38281,1.06641 1.38281,3.03516 0,1.23047 -0.41016,2.23828 -0.41015,0.99609 -1.30078,1.94531 -0.8789,0.94922 -3.51562,3.09375 -1.00782,0.82031 -2.17969,1.86328 h 7.71094 z m 9.058585,-1.28906 2.73048,0.28125 v 1.00781 h -8.835945 v -1.00781 l 2.71875,-0.28125 v -11.84765 l -2.70703,0.89062 v -0.9961 l 4.42969,-2.60156 h 1.664065 z m 12.91406,-4.53515 q 0,-2.16798 -0.53906,-3.17579 -0.52733,-1.00781 -1.74608,-1.00781 -0.44532,0 -0.97267,0.10547 -0.52733,0.0937 -0.86719,0.29296 v 8.42579 q 0.75,0.1875 1.83986,0.1875 1.16014,0 1.72264,-1.125 0.5625,-1.13672 0.5625,-3.70312 z m -7.51172,-9.79688 -1.125,-0.26954 v -0.76171 h 4.51172 v 4.04296 q 0,1.08985 -0.11718,2.21485 0.46875,-0.38672 1.34765,-0.64453 0.89063,-0.26953 1.73438,-0.26953 2.39062,0 3.49218,1.3125 1.10157,1.3125 1.10157,4.18359 0,2.83594 -1.41797,4.44141 -1.40625,1.60546 -3.97266,1.60546 -1.89844,0 -5.55469,-0.79687 z"
+ aria-label="#0b121b" />
+ d="m 192.46875,583.39258 -0.89063,4.81641 h -1.67577 l 0.89062,-4.81641 h -3.16406 l -0.86719,4.81641 h -1.71093 l 0.89062,-4.81641 h -1.83984 v -1.4414 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44141 h 3.02343 l 0.85547,-4.65234 h 1.6875 l -0.86718,4.65234 h 3.16406 l 0.86719,-4.65234 h 1.67578 l -0.86719,4.65234 h 1.82812 v 1.44141 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.4414 z m -3.9375,-4.80468 -0.62109,3.36328 h 3.16406 l 0.63282,-3.36328 z m 15.28125,8.33203 2.73047,0.28125 v 1.0078 h -8.83593 v -1.0078 l 2.71875,-0.28125 v -11.84766 l -2.70704,0.89062 v -0.99609 l 4.42968,-2.60157 h 1.66407 z m 10.67579,0 2.73046,0.28125 v 1.0078 h -8.83594 v -1.0078 l 2.71875,-0.28125 v -11.84766 l -2.70702,0.89062 v -0.99609 l 4.42968,-2.60157 h 1.66407 z m 10.67577,0 2.73048,0.28125 v 1.0078 h -8.83594 v -1.0078 l 2.71875,-0.28125 v -11.84766 l -2.70703,0.89062 V 574.9668 L 223.5,572.36523 h 1.66407 z m 12.91406,-4.53516 q 0,-2.16797 -0.53906,-3.17579 -0.52735,-1.0078 -1.7461,-1.0078 -0.44531,0 -0.97265,0.10547 -0.52735,0.0937 -0.86719,0.29296 v 8.42579 q 0.75,0.1875 1.83984,0.1875 1.16016,0 1.72266,-1.125 0.5625,-1.13672 0.5625,-3.70313 z m -7.51172,-9.79688 -1.125,-0.26954 v -0.76171 h 4.51172 v 4.04296 q 0,1.08985 -0.11719,2.21485 0.46875,-0.38672 1.34767,-0.64452 0.89062,-0.26953 1.73437,-0.26953 2.39063,0 3.49219,1.3125 1.10156,1.3125 1.10156,4.18358 0,2.83595 -1.41797,4.44142 -1.40625,1.60546 -3.97265,1.60546 -1.89844,0 -5.55469,-0.79688 z m 22.88672,15.62109 h -9.96094 v -2.21484 q 1.00782,-1.07812 1.86328,-1.93359 1.875,-1.85157 2.74219,-2.90625 0.86719,-1.06641 1.26563,-2.20313 0.41015,-1.13672 0.41015,-2.58985 0,-1.27734 -0.62109,-2.0625 -0.6211,-0.78515 -1.65235,-0.78515 -0.72656,0 -1.16015,0.15235 -0.4336,0.15233 -0.79688,0.45702 l -0.5039,2.27344 h -1.01952 v -3.57422 q 0.9375,-0.21094 1.82812,-0.35156 0.90234,-0.15235 1.95702,-0.15235 2.58986,0 3.96094,1.06641 1.38281,1.06641 1.38281,3.03516 0,1.23047 -0.41014,2.23828 -0.41017,0.99609 -1.30079,1.94531 -0.8789,0.94922 -3.51563,3.09375 -1.00781,0.82031 -2.17969,1.86328 h 7.71094 z m 3.42188,-11.22656 h -1.01953 v -4.48828 h 10.04297 v 0.92578 l -6.10547,14.78906 h -2.80078 l 6.6211,-13.10156 h -6.19922 z"
+ aria-label="#111b27" />
+ d="m 341.93554,583.04687 -0.89062,4.81642 h -1.67578 l 0.89062,-4.81642 h -3.16406 l -0.86719,4.81642 h -1.71093 l 0.89062,-4.81642 h -1.83984 v -1.44139 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44141 h 3.02343 l 0.85547,-4.65234 h 1.6875 l -0.86718,4.65234 h 3.16406 l 0.86719,-4.65234 h 1.67578 l -0.86719,4.65234 h 1.82812 v 1.44141 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.44139 z m -3.9375,-4.80467 -0.62109,3.36327 h 3.16406 l 0.63282,-3.36327 z m 18.22266,9.62108 h -9.96094 v -2.21483 q 1.00782,-1.07814 1.86328,-1.93361 1.875,-1.85156 2.74219,-2.90625 0.86719,-1.06639 1.26563,-2.20312 0.41015,-1.13672 0.41015,-2.58985 0,-1.27734 -0.62109,-2.0625 -0.62109,-0.78515 -1.65234,-0.78515 -0.72657,0 -1.16016,0.15234 -0.43359,0.15234 -0.79688,0.45703 l -0.5039,2.27344 h -1.01953 v -3.57422 q 0.9375,-0.21094 1.82812,-0.35156 0.90235,-0.15235 1.95703,-0.15235 2.58985,0 3.96094,1.06641 1.38281,1.06641 1.38281,3.03516 0,1.23047 -0.41015,2.23828 -0.41016,0.99609 -1.30078,1.94531 -0.87891,0.94922 -3.51563,3.09375 -1.00781,0.82031 -2.17969,1.86328 h 7.71094 z m 9.05859,-1.28906 2.73047,0.28125 v 1.00781 h -8.83593 v -1.00781 l 2.71875,-0.28125 v -11.84766 l -2.70704,0.89063 v -0.9961 l 4.42969,-2.60156 h 1.66406 z m 15.15235,-2.98827 q 0,2.14452 -1.53516,3.32811 -1.53515,1.1836 -4.26562,1.1836 -2.17969,0 -4.33594,-0.46875 l -0.14063,-3.8086 h 1.07813 l 0.60937,2.51953 q 1.01954,0.57422 2.13282,0.57422 1.41797,0 2.21484,-0.90233 0.79688,-0.91407 0.79688,-2.54298 0,-1.41797 -0.64454,-2.16797 -0.63281,-0.76172 -2.0625,-0.85547 l -1.35937,-0.082 v -1.41797 l 1.3125,-0.0937 q 1.04297,-0.0703 1.53516,-0.76172 0.5039,-0.70312 0.5039,-2.10937 0,-1.3125 -0.59765,-2.0625 -0.58594,-0.75 -1.67579,-0.75 -0.63281,0 -1.04296,0.19922 -0.39844,0.1875 -0.76172,0.41015 l -0.50391,2.27344 h -1.01953 v -3.57422 q 1.19531,-0.30469 2.0625,-0.39844 0.86719,-0.10547 1.71094,-0.10547 5.28515,0 5.28515,3.86719 0,1.59375 -0.84375,2.57813 -0.84375,0.98437 -2.41406,1.21875 3.96094,0.48047 3.96094,3.94922 z m 11.90625,-3.64454 q 0,8.15625 -5.15625,8.15625 -2.48438,0 -3.75,-2.08594 -1.26563,-2.08594 -1.26563,-6.07031 0,-3.90235 1.26563,-5.96485 1.26562,-2.07422 3.84375,-2.07422 2.48437,0 3.77344,2.05078 1.28906,2.03907 1.28906,5.98829 z m -3.4336,0 q 0,-3.65625 -0.41015,-5.25 -0.41016,-1.60546 -1.28906,-1.60546 -0.86719,0 -1.24219,1.54686 -0.36328,1.54689 -0.36328,5.3086 0,3.82031 0.375,5.40234 0.375,1.58203 1.23047,1.58203 0.86718,0 1.27734,-1.61719 0.42187,-1.62889 0.42187,-5.36718 z m 14.33204,4.8164 v 3.10548 h -3.15235 v -3.10548 h -6.5039 v -1.91015 l 7.07812,-10.78125 h 2.57813 v 10.28906 h 1.57031 v 2.40234 z m -3.15235,-7.05469 q 0,-1.3125 0.11719,-2.48437 l -4.67578,7.13673 h 4.55859 z m 16.34766,5.88283 q 0,2.14452 -1.53516,3.32811 -1.53515,1.1836 -4.26562,1.1836 -2.17969,0 -4.33594,-0.46875 l -0.14063,-3.8086 h 1.07813 l 0.60937,2.51953 q 1.01954,0.57422 2.13282,0.57422 1.41797,0 2.21484,-0.90233 0.79688,-0.91407 0.79688,-2.54298 0,-1.41797 -0.64454,-2.16797 -0.63281,-0.76172 -2.0625,-0.85547 l -1.35937,-0.082 v -1.41797 l 1.3125,-0.0937 q 1.04297,-0.0703 1.53516,-0.76172 0.5039,-0.70312 0.5039,-2.10937 0,-1.3125 -0.59765,-2.0625 -0.58594,-0.75 -1.67579,-0.75 -0.63281,0 -1.04296,0.19922 -0.39844,0.1875 -0.76172,0.41015 l -0.50391,2.27344 h -1.01953 v -3.57422 q 1.19531,-0.30469 2.0625,-0.39844 0.86719,-0.10547 1.71094,-0.10547 5.28515,0 5.28515,3.86719 0,1.59375 -0.84375,2.57813 -0.84375,0.98437 -2.41406,1.21875 3.96094,0.48047 3.96094,3.94922 z"
+ aria-label="#213043" />
+ d="m 491.66014,583.39259 -0.89062,4.81641 h -1.67578 l 0.89062,-4.81641 h -3.16406 l -0.86719,4.81641 h -1.71093 l 0.89062,-4.81641 h -1.83984 v -1.4414 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44141 h 3.02343 l 0.85548,-4.65234 h 1.6875 l -0.86719,4.65234 h 3.16407 l 0.86718,-4.65234 h 1.67578 l -0.86719,4.65234 h 1.82812 v 1.44141 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.4414 z m -3.9375,-4.80468 -0.62109,3.36328 h 3.16406 l 0.63282,-3.36328 z m 18.4336,5.34375 q 0,2.14453 -1.53516,3.32812 -1.53515,1.18359 -4.26562,1.18359 -2.17969,0 -4.33594,-0.46875 l -0.14063,-3.80859 h 1.07813 l 0.60937,2.51953 q 1.01954,0.57422 2.13282,0.57422 1.41797,0 2.21484,-0.90234 0.79688,-0.91407 0.79688,-2.54297 0,-1.41797 -0.64454,-2.16797 -0.63281,-0.76172 -2.0625,-0.85547 l -1.35937,-0.082 v -1.41797 l 1.3125,-0.0937 q 1.04297,-0.0703 1.53516,-0.76172 0.5039,-0.70312 0.5039,-2.10937 0,-1.3125 -0.59765,-2.0625 -0.58594,-0.75 -1.67579,-0.75 -0.63281,0 -1.04296,0.19922 -0.39844,0.1875 -0.76172,0.41015 l -0.50391,2.27344 h -1.01953 v -3.57422 q 1.19531,-0.30469 2.0625,-0.39844 0.86719,-0.10547 1.71094,-0.10547 5.28515,0 5.28515,3.86719 0,1.59375 -0.84375,2.57813 -0.84375,0.98437 -2.41406,1.21875 3.96094,0.48047 3.96094,3.94922 z m 10.875,3.60937 q -0.52735,0.42188 -1.46485,0.65625 -0.92577,0.23438 -1.91015,0.23438 -2.94141,0 -4.40625,-1.41797 -1.45313,-1.41797 -1.45313,-4.33594 0,-1.81641 0.65625,-3.10547 0.66797,-1.30078 1.89844,-1.98047 1.23047,-0.6914 2.85938,-0.6914 1.64062,0 3.57421,0.41015 v 3.25781 h -0.84375 l -0.49218,-1.93359 q -0.39844,-0.29297 -0.78516,-0.41016 -0.38672,-0.11718 -1.01953,-0.11718 -0.69141,0 -1.25391,0.55078 -0.5625,0.55078 -0.8789,1.55859 -0.30469,0.9961 -0.30469,2.39063 0,2.35547 0.72656,3.36328 0.73828,1.00781 2.33203,1.00781 1.61719,0 2.76563,-0.33984 z m 6.22265,-8.625 q 2.78907,0 4.13673,1.14844 1.35937,1.14844 1.35937,3.46875 0,2.36719 -1.47656,3.64453 -1.46485,1.26562 -4.20704,1.26562 -2.17968,0 -4.33593,-0.46875 l -0.14063,-3.80859 h 1.07813 l 0.60937,2.51953 q 0.45703,0.25781 1.125,0.42188 0.66797,0.15234 1.20703,0.15234 2.69532,0 2.69532,-3.60937 0,-1.875 -0.69141,-2.70704 -0.67969,-0.84375 -2.17969,-0.84375 -0.83203,0 -1.52344,0.30469 l -0.36328,0.15235 h -1.17187 v -8.0625 h 8.20312 v 2.61328 h -6.90234 v 4.125 q 1.42969,-0.31641 2.57812,-0.31641 z m 17.34375,9.29297 h -9.96093 v -2.21484 q 1.00781,-1.07813 1.86328,-1.9336 1.875,-1.85156 2.74219,-2.90625 0.86718,-1.0664 1.26562,-2.20312 0.41016,-1.13672 0.41016,-2.58985 0,-1.27734 -0.6211,-2.0625 -0.62109,-0.78515 -1.65234,-0.78515 -0.72656,0 -1.16016,0.15234 -0.43359,0.15234 -0.79687,0.45703 l -0.50391,2.27344 h -1.01953 v -3.57422 q 0.9375,-0.21094 1.82813,-0.35156 0.90234,-0.15235 1.95703,-0.15235 2.58984,0 3.96093,1.06641 1.38282,1.06641 1.38282,3.03516 0,1.23047 -0.41016,2.23828 -0.41016,0.99609 -1.30078,1.94531 -0.87891,0.94922 -3.51563,3.09375 -1.00781,0.82031 -2.17968,1.86328 h 7.71093 z m 12.32813,-4.875 q 0,2.47266 -1.27734,3.79687 -1.27735,1.3125 -3.63281,1.3125 -2.69532,0 -4.13673,-2.05078 -1.42968,-2.05078 -1.42968,-5.9414 0,-2.53125 0.75,-4.3711 0.76172,-1.83984 2.12109,-2.80078 1.35938,-0.96094 3.12891,-0.96094 1.82812,0 3.52734,0.50391 v 3.57422 h -1.01953 l -0.50391,-2.27344 q -0.80859,-0.60937 -1.76953,-0.60937 -1.17187,0 -1.91015,1.5 -0.72656,1.5 -0.85547,4.19531 1.27734,-0.55078 2.53125,-0.55078 2.14453,0 3.30468,1.20703 1.17188,1.20703 1.17188,3.46875 z m -4.95703,3.92578 q 0.85547,0 1.18359,-0.92578 0.32813,-0.92578 0.32813,-2.77734 0,-1.65235 -0.45703,-2.54297 -0.45704,-0.89063 -1.35938,-0.89063 -0.86718,0 -1.76953,0.26953 v 0.0586 q 0,6.80859 2.07422,6.80859 z m 14.25,0.32813 q -0.65625,0.42187 -1.00781,0.5625 -0.35156,0.1289 -0.79688,0.21093 -0.44531,0.082 -0.98437,0.082 -2.4375,0 -3.63281,-1.39453 -1.19532,-1.40625 -1.19532,-4.3125 0,-2.85937 1.27734,-4.34765 1.28907,-1.48828 3.72657,-1.48828 1.27734,0 2.57812,0.3164 -0.0703,-0.38672 -0.0703,-1.8164 v -2.78907 l -1.125,-0.28125 v -0.77343 H 565.5 v 15.59765 l 1.20703,0.28125 v 0.77344 h -4.24219 z m -4.1836,-4.94532 q 0,2.19141 0.55079,3.35157 0.55078,1.14843 1.58203,1.14843 0.9375,0 1.94531,-0.5039 v -8.29688 q -0.91406,-0.24609 -1.85156,-0.24609 -1.05469,0 -1.64063,1.16015 -0.58594,1.14844 -0.58594,3.38672 z"
+ aria-label="#3c526d" />
+ d="m 791.14453,583.39259 -0.89062,4.81641 h -1.67579 l 0.89063,-4.81641 h -3.16406 l -0.86719,4.81641 h -1.71093 l 0.89062,-4.81641 h -1.83984 v -1.4414 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44141 h 3.02343 l 0.85547,-4.65234 h 1.6875 l -0.86718,4.65234 h 3.16406 l 0.86719,-4.65234 h 1.67578 l -0.86719,4.65234 h 1.82812 v 1.44141 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.4414 z m -3.9375,-4.80468 -0.62109,3.36328 H 789.75 l 0.63282,-3.36328 z m 15.84375,9 q -0.65625,0.42187 -1.00781,0.5625 -0.35156,0.1289 -0.79688,0.21093 -0.44531,0.082 -0.98437,0.082 -2.4375,0 -3.63281,-1.39453 -1.19532,-1.40625 -1.19532,-4.3125 0,-2.85937 1.27735,-4.34765 1.28906,-1.48828 3.72656,-1.48828 1.27734,0 2.57812,0.3164 -0.0703,-0.38672 -0.0703,-1.8164 v -2.78907 l -1.125,-0.28125 v -0.77343 h 4.51171 v 15.59765 l 1.20704,0.28125 v 0.77344 h -4.2422 z m -4.18359,-4.94532 q 0,2.19141 0.55078,3.35157 0.55078,1.14843 1.58203,1.14843 0.9375,0 1.94531,-0.5039 v -8.29688 q -0.91406,-0.24609 -1.85156,-0.24609 -1.05469,0 -1.64063,1.16015 -0.58593,1.14844 -0.58593,3.38672 z m 20.02734,-2.35547 q 0,8.15625 -5.15625,8.15625 -2.48437,0 -3.75,-2.08593 -1.26562,-2.08594 -1.26562,-6.07032 0,-3.90234 1.26562,-5.96484 1.26563,-2.07422 3.84375,-2.07422 2.48438,0 3.77344,2.05078 1.28906,2.03907 1.28906,5.98828 z m -3.43359,0 q 0,-3.65625 -0.41016,-5.25 -0.41016,-1.60546 -1.28906,-1.60546 -0.86719,0 -1.24219,1.54687 -0.36328,1.54688 -0.36328,5.30859 0,3.82032 0.375,5.40235 0.375,1.58203 1.23047,1.58203 0.86719,0 1.27735,-1.61719 0.42187,-1.6289 0.42187,-5.36719 z m 12.9375,7.30079 q -0.65625,0.42187 -1.00782,0.5625 -0.35155,0.1289 -0.79687,0.21093 -0.44531,0.082 -0.98438,0.082 -2.4375,0 -3.6328,-1.39453 -1.19532,-1.40625 -1.19532,-4.3125 0,-2.85937 1.27735,-4.34765 1.28906,-1.48828 3.72656,-1.48828 1.27734,0 2.57812,0.3164 -0.0703,-0.38672 -0.0703,-1.8164 v -2.78907 l -1.125,-0.28125 v -0.77343 h 4.51172 v 15.59765 l 1.20703,0.28125 v 0.77344 h -4.24219 z m -4.18359,-4.94532 q 0,2.19141 0.55077,3.35157 0.55079,1.14843 1.58204,1.14843 0.9375,0 1.94531,-0.5039 v -8.29688 q -0.91406,-0.24609 -1.85156,-0.24609 -1.05469,0 -1.64063,1.16015 -0.58594,1.14844 -0.58593,3.38672 z m 15.33984,-5.69531 q 4.13672,0 4.13672,3.04688 v 7.16015 l 1.10156,0.28125 v 0.77344 h -4.05469 l -0.25781,-0.84375 q -0.91406,0.62109 -1.65234,0.84375 -0.73828,0.23437 -1.48828,0.23437 -3.41016,0 -3.41016,-3.28125 0,-1.24218 0.50391,-1.98046 0.5039,-0.75 1.45312,-1.10157 0.94922,-0.36328 2.98828,-0.41015 l 1.42969,-0.0352 v -1.60547 q 0,-1.99219 -1.62891,-1.99219 -0.98437,0 -2.20312,0.60938 l -0.44531,1.37109 h -0.77344 v -2.66015 q 1.76953,-0.26953 2.60156,-0.33985 0.83203,-0.0703 1.69922,-0.0703 z m 0.75,5.73047 -0.98437,0.0352 q -1.13673,0.0469 -1.58204,0.59765 -0.43359,0.55078 -0.43359,1.78125 0,0.9961 0.35156,1.46485 0.35157,0.46875 0.91407,0.46875 0.79687,0 1.73437,-0.41016 z m 10.64063,-5.75391 q 2.23827,0 3.23437,1.19532 1.00781,1.19531 1.00781,3.71484 v 0.96094 h -5.77734 v 0.1875 q 0,1.74609 0.28125,2.48437 0.28125,0.73828 0.91406,1.125 0.63281,0.38672 1.73438,0.38672 1.03125,0 2.60156,-0.33984 v 0.90234 q -0.64453,0.38672 -1.67578,0.64453 -1.01953,0.2461 -1.99219,0.2461 -2.70703,0 -4.00781,-1.40625 -1.28906,-1.41797 -1.28906,-4.38282 0,-2.88281 1.23046,-4.30078 1.24219,-1.41797 3.73829,-1.41797 z m -0.12891,1.1836 q -0.70313,0 -1.05469,0.76172 -0.33985,0.76171 -0.33985,2.69531 h 2.5547 q 0,-1.57031 -0.10548,-2.20313 -0.10547,-0.64453 -0.36327,-0.94922 -0.2461,-0.30468 -0.69141,-0.30468 z m 7.38281,-1.125 h -1.01953 v -4.48828 h 10.04297 v 0.92578 l -6.10547,14.78906 h -2.80078 l 6.62109,-13.10156 h -6.19922 z"
+ aria-label="#d0dae7" />
+ d="m 945.39257,583.51562 -0.89062,4.81641 h -1.67578 l 0.89062,-4.81641 h -3.16406 l -0.86719,4.81641 h -1.71093 l 0.89062,-4.81641 h -1.83984 v -1.4414 h 2.13281 l 0.62109,-3.36328 h -2.7539 v -1.44141 h 3.02343 l 0.85547,-4.65234 h 1.6875 l -0.86718,4.65234 h 3.16406 l 0.86719,-4.65234 h 1.67578 l -0.86719,4.65234 h 1.82812 v 1.44141 h -2.08593 l -0.59766,3.36328 h 2.68359 v 1.4414 z m -3.9375,-4.80468 -0.62109,3.36328 h 3.16406 l 0.63282,-3.36328 z m 13.04297,-1.66407 q 2.23828,0 3.23438,1.19532 1.00781,1.19531 1.00781,3.71484 v 0.96094 h -5.77734 v 0.1875 q 0,1.74609 0.28125,2.48437 0.28125,0.73828 0.91406,1.125 0.63281,0.38672 1.73437,0.38672 1.03125,0 2.60157,-0.33984 v 0.90234 q -0.64453,0.38672 -1.67578,0.64453 -1.01954,0.2461 -1.99219,0.2461 -2.70703,0 -4.00781,-1.40625 -1.28907,-1.41797 -1.28907,-4.38282 0,-2.88281 1.23047,-4.30078 1.24219,-1.41797 3.73828,-1.41797 z m -0.1289,1.1836 q -0.70313,0 -1.05469,0.76172 -0.33984,0.76171 -0.33984,2.69531 h 2.55468 q 0,-1.57031 -0.10547,-2.20313 -0.10546,-0.64453 -0.36328,-0.94922 -0.24609,-0.30468 -0.6914,-0.30468 z m 16.17187,5.82422 q 0,2.14453 -1.53515,3.32812 -1.53516,1.18359 -4.26563,1.18359 -2.17969,0 -4.33594,-0.46875 l -0.14062,-3.80859 h 1.07812 l 0.60938,2.51953 q 1.01953,0.57422 2.13281,0.57422 1.41797,0 2.21484,-0.90234 0.79688,-0.91406 0.79688,-2.54297 0,-1.41797 -0.64453,-2.16797 -0.63281,-0.76172 -2.0625,-0.85547 l -1.35938,-0.082 v -1.41797 l 1.3125,-0.0937 q 1.04297,-0.0703 1.53516,-0.76172 0.50391,-0.70312 0.50391,-2.10937 0,-1.3125 -0.59766,-2.0625 -0.58594,-0.75 -1.67578,-0.75 -0.63281,0 -1.04297,0.19922 -0.39844,0.1875 -0.76172,0.41015 l -0.50391,2.27344 h -1.01953 v -3.57422 q 1.19532,-0.30469 2.0625,-0.39844 0.86719,-0.10547 1.71094,-0.10547 5.28516,0 5.28516,3.86719 0,1.59375 -0.84375,2.57813 -0.84375,0.98437 -2.41407,1.21875 3.96094,0.48047 3.96094,3.94922 z m 6.60938,-7.00782 q 2.23828,0 3.23437,1.19532 1.00781,1.19531 1.00781,3.71484 v 0.96094 h -5.77734 v 0.1875 q 0,1.74609 0.28125,2.48437 0.28125,0.73828 0.91406,1.125 0.63282,0.38672 1.73438,0.38672 1.03125,0 2.60156,-0.33984 v 0.90234 q -0.64453,0.38672 -1.67578,0.64453 -1.01953,0.2461 -1.99219,0.2461 -2.70703,0 -4.00781,-1.40625 -1.28906,-1.41797 -1.28906,-4.38282 0,-2.88281 1.23047,-4.30078 1.24218,-1.41797 3.73828,-1.41797 z m -0.12891,1.1836 q -0.70312,0 -1.05469,0.76173 -0.33984,0.76171 -0.33984,2.6953 h 2.55469 q 0,-1.5703 -0.10547,-2.20313 -0.10547,-0.64453 -0.36328,-0.94921 -0.2461,-0.30469 -0.69141,-0.30469 z m 11.39063,-1.16016 q 4.13671,0 4.13671,3.04688 v 7.16015 l 1.10157,0.28125 v 0.77344 h -4.05469 l -0.25781,-0.84375 q -0.91407,0.62109 -1.65235,0.84375 -0.73828,0.23437 -1.48828,0.23437 -3.41015,0 -3.41015,-3.28125 0,-1.24218 0.5039,-1.98046 0.50391,-0.75 1.45313,-1.10157 0.94922,-0.36328 2.98828,-0.41015 l 1.42969,-0.0352 v -1.60548 q 0,-1.99219 -1.62891,-1.99219 -0.98438,0 -2.20313,0.60938 l -0.44531,1.37109 h -0.77344 v -2.66015 q 1.76954,-0.26953 2.60157,-0.33985 0.83203,-0.0703 1.69922,-0.0703 z m 0.75,5.73047 -0.98438,0.0352 q -1.13672,0.0469 -1.58203,0.59765 -0.43359,0.55078 -0.43359,1.78125 0,0.9961 0.35156,1.46485 0.35156,0.46875 0.91406,0.46875 0.79688,0 1.73438,-0.41016 z m 6.6914,-4.26562 h -1.66406 v -0.8086 l 1.66406,-0.45702 v -1.18359 q 0,-2.25 1.14844,-3.44533 1.14844,-1.20702 3.29295,-1.20702 1.1602,0 1.9453,0.22266 v 2.625 h -0.75 l -0.3398,-1.27735 q -0.2813,-0.28125 -0.7383,-0.28125 -1.17187,0 -1.17187,2.98829 v 1.60546 h 2.23827 v 1.21875 h -2.23827 v 8.74219 l 1.79297,0.28125 v 0.77344 h -6.375 v -0.77344 l 1.19531,-0.28125 z m 17.12109,9.79687 h -9.9609 v -2.21483 q 1.0078,-1.07814 1.8632,-1.93361 1.875,-1.85156 2.7422,-2.90625 0.8672,-1.06639 1.2657,-2.20312 0.4101,-1.13672 0.4101,-2.58985 0,-1.27734 -0.6211,-2.0625 -0.6211,-0.78515 -1.6523,-0.78515 -0.7266,0 -1.1602,0.15234 -0.4336,0.15234 -0.7969,0.45703 l -0.5039,2.27344 h -1.0195 v -3.57422 q 0.9375,-0.21094 1.8281,-0.35156 0.9024,-0.15235 1.9571,-0.15235 2.5898,0 3.9609,1.06641 1.3828,1.06641 1.3828,3.03516 0,1.23047 -0.4101,2.23828 -0.4102,0.99609 -1.3008,1.94531 -0.8789,0.94922 -3.5156,3.09375 -1.0079,0.82031 -2.1797,1.86328 h 7.7109 z"
+ aria-label="#e3eaf2" />
+ d="m 1097.9355,583.51562 -0.8906,4.81642 h -1.6758 l 0.8907,-4.81642 h -3.1641 l -0.8672,4.81642 h -1.7109 l 0.8906,-4.81642 h -1.8398 v -1.44139 h 2.1328 l 0.6211,-3.36328 h -2.7539 v -1.44141 h 3.0234 l 0.8555,-4.65234 h 1.6875 l -0.8672,4.65234 h 3.164 l 0.8672,-4.65234 h 1.6758 l -0.8672,4.65234 h 1.8281 v 1.44141 h -2.0859 l -0.5977,3.36328 h 2.6836 v 1.44139 z m -3.9375,-4.80467 -0.6211,3.36327 h 3.1641 l 0.6328,-3.36327 z m 9.0938,-0.17579 h -1.6641 v -0.8086 l 1.6641,-0.45702 v -1.18359 q 0,-2.25 1.1484,-3.44533 1.1485,-1.20702 3.293,-1.20702 1.1602,0 1.9453,0.22266 v 2.625 h -0.75 l -0.3398,-1.27735 q -0.2813,-0.28125 -0.7383,-0.28125 -1.1719,0 -1.1719,2.98829 v 1.60546 h 2.2383 v 1.21875 h -2.2383 v 8.74219 l 1.793,0.28125 v 0.77344 h -6.375 v -0.77344 l 1.1953,-0.28125 z m 17.2383,1.875 q 0,8.15625 -5.1563,8.15625 -2.4844,0 -3.75,-2.08594 -1.2656,-2.08594 -1.2656,-6.07031 0,-3.90235 1.2656,-5.96485 1.2656,-2.07422 3.8438,-2.07422 2.4843,0 3.7734,2.05078 1.2891,2.03907 1.2891,5.98829 z m -3.4336,0 q 0,-3.65625 -0.4102,-5.25 -0.4101,-1.60546 -1.289,-1.60546 -0.8672,0 -1.2422,1.54686 -0.3633,1.54689 -0.3633,5.3086 0,3.82031 0.375,5.40234 0.375,1.58203 1.2305,1.58203 0.8671,0 1.2773,-1.61719 0.4219,-1.62889 0.4219,-5.36718 z m 6.1875,-1.875 h -1.6641 v -0.8086 l 1.6641,-0.45702 v -1.18359 q 0,-2.25 1.1484,-3.44533 1.1485,-1.20702 3.293,-1.20702 1.1601,0 1.9453,0.22266 v 2.625 h -0.75 l -0.3398,-1.27735 q -0.2813,-0.28125 -0.7383,-0.28125 -1.1719,0 -1.1719,2.98829 v 1.60546 h 2.2383 v 1.21875 h -2.2383 v 8.74219 l 1.793,0.28125 v 0.77344 h -6.375 v -0.77344 l 1.1953,-0.28125 z m 16.1367,6.6914 v 3.10548 h -3.1523 v -3.10548 h -6.504 v -1.91015 l 7.0782,-10.78125 h 2.5781 v 10.28906 h 1.5703 v 2.40234 z m -3.1523,-7.05469 q 0,-1.3125 0.1171,-2.48437 l -4.6757,7.13673 h 4.5586 z m 7.0078,0.36329 h -1.6641 v -0.8086 l 1.6641,-0.45702 v -1.18359 q 0,-2.25 1.1484,-3.44533 1.1484,-1.20702 3.293,-1.20702 1.1601,0 1.9453,0.22266 v 2.625 h -0.75 l -0.3399,-1.27735 q -0.2812,-0.28125 -0.7382,-0.28125 -1.1719,0 -1.1719,2.98829 v 1.60546 h 2.2383 v 1.21875 h -2.2383 v 8.74219 l 1.793,0.28125 v 0.77344 h -6.375 v -0.77344 l 1.1953,-0.28125 z m 16.9922,-2.05079 q 0,1.28908 -0.6329,2.20313 -0.6328,0.90234 -1.7812,1.3125 1.3476,0.50391 2.0625,1.55859 0.7148,1.05469 0.7148,2.53125 0,2.22657 -1.289,3.35157 -1.2774,1.125 -3.9844,1.125 -5.1328,0 -5.1328,-4.47657 0,-1.5 0.7265,-2.55468 0.7266,-1.05469 2.0157,-1.53516 -1.1367,-0.43359 -1.7578,-1.33594 -0.6211,-0.90233 -0.6211,-2.21483 0,-1.92189 1.2656,-3 1.2773,-1.07814 3.5976,-1.07814 2.2735,0 3.5391,1.10157 1.2774,1.08985 1.2774,3.01171 z m -2.9649,7.60547 q 0,-1.80468 -0.4687,-2.625 -0.4688,-0.8203 -1.4766,-0.8203 -0.9609,0 -1.3828,0.79687 -0.4219,0.79688 -0.4219,2.64843 0,1.81642 0.4219,2.5547 0.4336,0.73827 1.3828,0.73827 1.0078,0 1.4766,-0.77344 0.4687,-0.77342 0.4687,-2.51953 z m -0.3633,-7.60547 q 0,-1.53514 -0.3867,-2.22656 -0.3867,-0.70311 -1.1719,-0.70311 -0.75,0 -1.1132,0.69139 -0.3516,0.69141 -0.3516,2.23828 0,1.59375 0.3516,2.25 0.3515,0.65625 1.1132,0.65625 0.8086,0 1.1836,-0.66797 0.375,-0.67968 0.375,-2.23828 z"
+ aria-label="#f0f4f8" />
+ d="m 333.02093,129.02082 q -14.04166,0 -21.91666,-7.45833 -7.87499,-7.45833 -7.87499,-20.66666 0,-14.333325 7.49999,-21.749988 7.54166,-7.45833 22.24999,-7.45833 9.70833,0 20.12499,2.791665 l 0.25,13.416661 h -3.74999 l -1.16667,-8.08333 q -5.5,-3.749998 -12.79166,-3.749998 -9.66667,0 -14.125,6.041664 -4.45833,5.999998 -4.45833,18.666656 0,11.70833 4.66667,17.83333 4.66666,6.125 13.58332,6.125 4.70834,0 8.20834,-1.25 3.54166,-1.25 5.54166,-2.95834 l 1.33333,-9.16666 h 3.79167 l -0.25,14.16666 q -3.75,1.45833 -9.75,2.5 -6,1 -11.16666,1 z m 67.08331,-20.62499 q 0,10.54166 -4.54168,15.58333 -4.49998,5.04166 -13.79165,5.04166 -8.99999,0 -13.41666,-5.08333 -4.41667,-5.125 -4.41667,-15.54166 0,-10.374996 4.45833,-15.374994 4.50001,-5.041664 13.70834,-5.041664 9.29166,0 13.62499,5.208331 4.375,5.166664 4.375,15.208327 z m -12.20833,0 q 0,-9.166663 -1.375,-12.666662 -1.33333,-3.541665 -4.66667,-3.541665 -3.20833,0 -4.45833,3.374999 -1.24999,3.374998 -1.24999,12.833328 0,9.625 1.24999,13.04166 1.29167,3.41667 4.45833,3.41667 3.29167,0 4.66667,-3.58334 1.375,-3.62499 1.375,-12.87499 z m 33.54165,-15.958327 2.83333,-1.458333 q 5.83333,-2.999998 10.45833,-2.999998 6.99999,0 9.33333,5.083331 8.54166,-5.083331 14.41666,-5.083331 10.58333,0 10.58333,11.541661 v 24.916657 l 3.91666,1 v 2.75 h -19.45831 v -2.75 l 3.5,-1 v -23.29166 q 0,-3.499996 -1.375,-5.458328 -1.33335,-1.958333 -4.08335,-1.958333 -3.08333,0 -6.66665,1.749999 0.41666,1.75 0.41666,4.041665 v 24.916657 l 3.91666,1 v 2.75 h -19.45832 v -2.75 l 3.5,-1 v -23.29166 q 0,-3.499996 -1.375,-5.458328 -1.33334,-1.958333 -4.08334,-1.958333 -2.74999,0 -6.29166,1.624999 v 29.083322 l 3.58333,1 v 2.75 H 405.6459 v -2.75 l 3.83333,-1 V 92.770836 l -3.83333,-0.999999 v -2.749999 h 15.20832 z m 71.08329,0 2.83334,-1.458333 q 5.83333,-2.999998 10.45833,-2.999998 6.99999,0 9.33333,5.083331 8.54166,-5.083331 14.41666,-5.083331 10.58333,0 10.58333,11.541661 v 24.916657 l 3.91666,1 v 2.75 h -19.45833 v -2.75 l 3.5,-1 v -23.29166 q 0,-3.499996 -1.375,-5.458328 -1.33333,-1.958333 -4.08333,-1.958333 -3.08332,0 -6.66665,1.749999 0.41665,1.75 0.41665,4.041665 v 24.916657 l 3.91668,1 v 2.75 h -19.45833 v -2.75 l 3.5,-1 v -23.29166 q 0,-3.499996 -1.375,-5.458328 -1.33334,-1.958333 -4.08334,-1.958333 -2.75,0 -6.29166,1.624999 v 29.083322 l 3.58333,1 v 2.75 h -19.45833 v -2.75 l 3.83335,-1 V 92.770836 l -3.83335,-0.999999 v -2.749999 h 15.20833 z m 92.41665,15.958327 q 0,10.54166 -4.54166,15.58333 -4.5,5.04166 -13.79166,5.04166 -9,0 -13.41666,-5.08333 -4.41668,-5.125 -4.41668,-15.54166 0,-10.374996 4.45834,-15.374994 4.5,-5.041664 13.70833,-5.041664 9.29165,0 13.62499,5.208331 4.375,5.166664 4.375,15.208327 z m -12.20834,0 q 0,-9.166663 -1.375,-12.666662 -1.33332,-3.541665 -4.66665,-3.541665 -3.20833,0 -4.45833,3.374999 -1.25,3.374998 -1.25,12.833328 0,9.625 1.25,13.04166 1.29166,3.41667 4.45833,3.41667 3.29165,0 4.66665,-3.58334 1.375,-3.62499 1.375,-12.87499 z m 33.54166,-15.958327 2.83333,-1.458333 q 5.83332,-2.999998 10.5,-2.999998 10.83332,0 10.83332,11.541661 v 24.916657 l 3.91667,1 v 2.75 h -19.45833 v -2.75 l 3.49999,-1 v -23.29166 q 0,-3.499996 -1.5,-5.458328 -1.45833,-1.958333 -4.20833,-1.958333 -3.16665,0 -6.33332,1.416666 v 29.291655 l 3.58332,1 v 2.75 h -19.45832 v -2.75 l 3.83333,-1 V 92.770836 l -3.83333,-0.999999 v -2.749999 h 15.20833 z m 81.83329,23.333327 q 0,6.54166 -4.04167,9.91666 -4,3.33333 -11.66666,3.33333 -3.16667,0 -7,-0.70833 -3.79166,-0.66667 -5.75,-1.41667 v -10.66666 h 2.75 l 1.58334,5.5 q 1.45833,1.45833 3.83333,2.45833 2.375,0.95833 4.83333,0.95833 3.625,0 5.375,-1.54166 1.79166,-1.58334 1.79166,-4 0,-2.29167 -1.70833,-3.66667 -1.70833,-1.375 -7.45833,-3.16666 -6.04166,-1.875 -8.58333,-5.125 -2.5,-3.25 -2.5,-7.999997 0,-5.333331 3.95833,-8.499996 3.95833,-3.166665 10.20833,-3.166665 4.29167,0 11.54165,1.208332 v 10.041663 h -2.75 l -1.33332,-4.583332 q -1.20833,-1.208332 -3.41666,-1.958332 -2.16667,-0.791666 -4.125,-0.791666 -3,0 -4.45833,1.249999 -1.41667,1.208333 -1.41667,3.333332 0,2.208332 1.79167,3.625002 1.79166,1.41666 7.37499,3.08333 6.08333,1.875 8.625,4.95833 2.54167,3.04166 2.54167,7.625 z m 20.25001,-29.833324 q 0,2.749999 -0.25,6.499997 l 2.875,-1.458333 q 5.91665,-2.999998 10.625,-2.999998 10.83332,0 10.83332,11.541661 v 24.916657 l 3.91667,1 v 2.75 h -19.45833 v -2.75 l 3.5,-1 v -23.29166 q 0,-3.499996 -1.5,-5.458328 -1.45833,-1.958333 -4.20833,-1.958333 -3.16666,0 -6.33333,1.416666 v 29.291655 l 3.58333,1 v 2.75 h -19.45832 v -2.75 l 3.83332,-1 V 72.729178 l -4,-1 v -2.749999 h 16.04167 z m 52.04164,2.208332 q 14.70833,0 14.70833,10.833329 v 25.458323 l 3.91666,1 v 2.75 H 764.6041 l -0.91667,-3 q -3.25,2.20833 -5.875,3 -2.625,0.83333 -5.29166,0.83333 -12.125,0 -12.125,-11.66666 0,-4.41667 1.79167,-7.04166 1.79167,-2.66667 5.16666,-3.91667 3.375,-1.29167 10.625,-1.45833 l 5.08333,-0.125 v -5.708333 q 0,-7.08333 -5.79166,-7.08333 -3.5,0 -7.83333,2.166665 L 747.8541,99.0625 h -2.74999 v -9.458329 q 6.29165,-0.958333 9.24999,-1.208333 2.95833,-0.25 6.04166,-0.25 z m 2.66667,20.374992 -3.5,0.125 q -4.04167,0.16667 -5.62499,2.125 -1.54168,1.95833 -1.54168,6.33333 0,3.54167 1.25,5.20833 1.25,1.66667 3.25,1.66667 2.83333,0 6.16666,-1.45834 z m 47.79165,17.45833 q -2.33333,1.49999 -3.58333,1.99999 -1.25,0.45834 -2.83334,0.75 -1.58333,0.29167 -3.5,0.29167 -8.66666,0 -12.91666,-4.95833 -4.25,-5 -4.25,-15.33333 0,-10.16666 4.54167,-15.458324 4.58333,-5.291664 13.24999,-5.291664 4.54167,0 9.16667,1.124999 -0.25,-1.374999 -0.25,-6.458331 v -9.916662 l -4,-1 v -2.749999 h 16.04166 v 55.458311 l 4.29166,1 v 2.75 h -15.08332 z m -14.875,-17.58333 q 0,7.79166 1.95834,11.91666 1.95833,4.08333 5.625,4.08333 3.33333,0 6.91666,-1.79166 V 93.104169 q -3.25,-0.874999 -6.58333,-0.874999 -3.75,0 -5.83334,4.124998 -2.08333,4.083332 -2.08333,12.041662 z m 52.37498,-20.333325 q 7.95834,0 11.5,4.249998 3.58334,4.249998 3.58334,13.208327 v 3.41667 h -20.54166 v 0.66666 q 0,6.20833 1,8.83333 1,2.625 3.25,4 2.25,1.375 6.16666,1.375 3.66666,0 9.25,-1.20833 v 3.20833 q -2.29167,1.375 -5.95834,2.29167 -3.625,0.87499 -7.08332,0.87499 -9.625,0 -14.25,-4.99999 -4.58334,-5.04167 -4.58334,-15.58333 0,-10.249996 4.375,-15.291661 4.41666,-5.041664 13.29166,-5.041664 z m -0.45832,4.208331 q -2.5,0 -3.75,2.708333 -1.20834,2.708332 -1.20834,9.583331 h 9.08332 q 0,-5.583333 -0.375,-7.833332 -0.37499,-2.291666 -1.29166,-3.374999 -0.875,-1.083333 -2.45832,-1.083333 z m 48.87499,23.499994 q 0,6.54166 -4.04167,9.91666 -4,3.33333 -11.66665,3.33333 -3.16667,0 -7,-0.70833 -3.79167,-0.66667 -5.75,-1.41667 v -10.66666 h 2.75 l 1.58333,5.5 q 1.45833,1.45833 3.83333,2.45833 2.375,0.95833 4.83334,0.95833 3.62499,0 5.37499,-1.54166 1.79167,-1.58334 1.79167,-4 0,-2.29167 -1.70833,-3.66667 -1.70834,-1.375 -7.45833,-3.16666 -6.04167,-1.875 -8.58334,-5.125 -2.5,-3.25 -2.5,-7.999997 0,-5.333331 3.95834,-8.499996 3.95833,-3.166665 10.20833,-3.166665 4.29166,0 11.54166,1.208332 v 10.041663 h -2.75 l -1.33334,-4.583332 q -1.20832,-1.208332 -3.41666,-1.958332 -2.16666,-0.791666 -4.125,-0.791666 -2.99999,0 -4.45834,1.249999 -1.41665,1.208333 -1.41665,3.333332 0,2.208332 1.79165,3.625002 1.79168,1.41666 7.375,3.08333 6.08334,1.875 8.625,4.95833 2.54167,3.04166 2.54167,7.625 z" />
diff --git a/packages/coldark-dircolors/README.md b/packages/coldark-dircolors/README.md
index 9765ff4..f4f8b9c 100644
--- a/packages/coldark-dircolors/README.md
+++ b/packages/coldark-dircolors/README.md
@@ -20,24 +20,24 @@ This variant is designed for dircolors in conjunction with the [Coldark variant
## Use of colors
-- **Terminal black slot**
+- **`coldark00`: Black**
Used as foreground for sticky other writable directories.
-- **Terminal bright black slot**
+- **`coldark00`: Dark gray**
Used as foreground for ignored files (e.g., `.log`, `.bak`).
-- **Terminal white slot**
- Used as foreground for missing files, files with setuid or setgid permissions, files with capability, and sticky not other writable directories.
-- **`coldark08`: Red accent**
- Used as foreground for orphaned symbolic links and executable. Also used as background for missing files.
-- **`coldark10`: Yellow accent**
- Used as foreground for socket files, block devices drivers and character device drivers and video files.
-- **`coldark11`: Green accent**
- Used as foreground for other writable directories, archives and various documents. Also used as background for sticky other writable directories.
-- **`coldark12`: Cyan accent**
+- **`coldark05`: White**
+ Used as foreground for missing files, files with setuid or setgid permissions, files with capability, sticky not other writable directories.
+- **`coldark08`: Cyan**
Used as foreground for symbolic links, regular files with more than one link, pipes and audio files.
-- **`coldark13`: Blue accent**
+- **`coldark09`: Yellow**
+ Used as foreground for socket files, block devices drivers and character device drivers and video files.
+- **`coldark10`: Blue**
Used as foreground for directories and as background for sticky not other writable directories.
-- **`coldark15`: Magenta accent**
+- **`coldark11`: Green**
+ Used as foreground for other writable directories, archives and various documents. Also used as background for sticky other writable directories.
+- **`coldark12`: Magenta**
Used as foreground for doors and images.
+- **`coldark15`: Red**
+ Used as foreground for orphaned symbolic links and executable. Also used as background for missing files.
## Screenshots
diff --git a/packages/coldark-firefox/README.md b/packages/coldark-firefox/README.md
index 4af91ea..386532e 100644
--- a/packages/coldark-firefox/README.md
+++ b/packages/coldark-firefox/README.md
@@ -28,21 +28,29 @@ If the shortcut doesn't work, check that it's not being used by another extensio
## Colors
-Firefox uses a small subset of the shared Coldark palette. The neutral denominations stay fixed across variants, while the blue accent keeps the same denomination and changes value with the variant.
-
-| Denomination | Coldark Cold | Coldark Dark | Preview | Usage in Firefox |
-| :----------: | :----------: | :----------: | :-----: | ---------------- |
-| `coldark00` | `#f0f4f8` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Popup, focused fields, and elevated button states in Coldark Cold |
-| `coldark01` | `#e3eaf2` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Default foreground for selected tab and toolbar in Coldark Dark |
-| `coldark02` | `#d0dae7` | `#d0dae7` | ![#d0dae7][#d0dae7] | Icons, popup text, field text, and inactive tab foreground in Coldark Dark |
-| `coldark03` | `#8da1b9` | `#8da1b9` | ![#8da1b9][#8da1b9] | Unused by the current Firefox theme |
-| `coldark04` | `#3c526d` | `#3c526d` | ![#3c526d][#3c526d] | Popup and focused field background in Coldark Dark |
-| `coldark05` | `#213043` | `#213043` | ![#213043][#213043] | Selected tab, toolbar, and sidebar background in Coldark Dark |
-| `coldark06` | `#111b27` | `#111b27` | ![#111b27][#111b27] | Default foreground in Coldark Cold and default background in Coldark Dark |
-| `coldark07` | `#0b121b` | `#0b121b` | ![#0b121b][#0b121b] | Inactive frame, highlight, and border background in Coldark Dark |
-| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Special icons, focus border, selected tab border, tab loading, and field highlight |
-
-For Coldark Cold specifically, the browser chrome also uses `coldark01` (`#e3eaf2`) as the main frame and field background, `coldark02` (`#d0dae7`) for selected tab and toolbar surfaces, `coldark03` (`#8da1b9`) for inactive frame and border emphasis, `coldark05` (`#213043`) for icon and popup foreground, and `coldark06` (`#111b27`) for the main foreground text.
+### Light Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :-------: | :-----------------: | --------------------------------------------------------------------------------------------------------- | :----------: |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** - Frame, new tab page, fields | `coldark00` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark background** - Selected tab, toolbar, sidebar | `coldark01` |
+| `#8da1b9` | ![#8da1b9][#8da1b9] | **Darker background** - Inactive frame, highlight, borders | `coldark02` |
+| `#213043` | ![#213043][#213043] | **Lighter foreground** – Icons, new tab page, popup, highlight, fields, inactive tab. | `coldark04` |
+| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Selected tab, toolbar | `coldark05` |
+| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Lighter background** – Popup, focused fields, buttons states | `coldark07` |
+| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Special icons (e.g. bookmark), focus border, selected tab border, tab loading, field highlight | `coldark10` |
+
+### Dark Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :-------: | :-----------------: | --------------------------------------------------------------------------------------------------------- | :----------: |
+| `#111b27` | ![#111b27][#111b27] | **Default background** – Frame, new tab page, fields | `coldark00` |
+| `#213043` | ![#213043][#213043] | **Light background** - Selected tab, toolbar, sidebar | `coldark01` |
+| `#3c526d` | ![#3c526d][#3c526d] | **Lighter background** - Popup, focused fields, buttons states | `coldark02` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Icons, new tab page, popup, highlight, fields, inactive tab. | `coldark04` |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Selected tab, toolbar | `coldark05` |
+| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Inactive frame, highlight, borders | `coldark07` |
+| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Special icons (e.g. bookmark), focus border, selected tab border, tab loading, field highlight | `coldark10` |
## Screenshots
diff --git a/packages/coldark-gtksourceview/coldark-cold.xml b/packages/coldark-gtksourceview/coldark-cold.xml
index 3088cd1..d028245 100644
--- a/packages/coldark-gtksourceview/coldark-cold.xml
+++ b/packages/coldark-gtksourceview/coldark-cold.xml
@@ -12,164 +12,164 @@
<_description>Light version of Coldark - A theme in shades of blue-grey adapted for GTK.
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
+
+
-
+
-
-
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
-
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
+
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+
-
-
+
+
-
-
-
+
+
+
-
-
-
-
-
+
+
+
+
+
-
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
+
+
-
-
+
+
-
+
-
-
-
+
+
+
-
+
diff --git a/packages/coldark-gtksourceview/coldark-dark.xml b/packages/coldark-gtksourceview/coldark-dark.xml
index 301201d..a5d0c79 100644
--- a/packages/coldark-gtksourceview/coldark-dark.xml
+++ b/packages/coldark-gtksourceview/coldark-dark.xml
@@ -12,164 +12,164 @@
<_description>Dark version of Coldark - A theme in shades of blue-grey adapted for GTK.
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
-
+
+
+
+
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
-
-
+
+
+
+
+
-
+
-
+
-
-
+
+
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
-
+
-
+
-
-
-
+
+
+
-
+
-
-
-
+
+
+
-
+
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
+
+
+
+
-
-
+
+
-
-
-
+
+
+
-
-
-
-
-
+
+
+
+
+
-
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
+
+
-
-
+
+
-
+
-
-
-
+
+
+
-
+
diff --git a/packages/coldark-vscode/README.md b/packages/coldark-vscode/README.md
index f299157..6464101 100644
--- a/packages/coldark-vscode/README.md
+++ b/packages/coldark-vscode/README.md
@@ -38,35 +38,47 @@ This variant is designed for [Visual Studio Code](https://code.visualstudio.com/
## Colors
-`coldark00` to `coldark07` are the fixed shared neutral ramp, ordered from the lightest common shade to the darkest.
-
-`coldark08` to `coldark15` are fixed accent slots by hue, with one value for Coldark Cold and another for Coldark Dark.
-
-### Common shades
-
-| Denomination | Hex Code | Preview | Usage in VS Code |
-| :----------: | :------: | :-----: | ---------------- |
-| `coldark00` | `#f0f4f8` | ![#f0f4f8][#f0f4f8] | Lightest surfaces such as active tabs, widgets, and elevated panels |
-| `coldark01` | `#e3eaf2` | ![#e3eaf2][#e3eaf2] | Bright backgrounds in Coldark Cold and the default foreground in Coldark Dark |
-| `coldark02` | `#d0dae7` | ![#d0dae7][#d0dae7] | Soft foregrounds and secondary surfaces |
-| `coldark03` | `#8da1b9` | ![#8da1b9][#8da1b9] | Selection backgrounds, borders, and muted emphasis |
-| `coldark04` | `#3c526d` | ![#3c526d][#3c526d] | Comments, placeholders, and subdued text |
-| `coldark05` | `#213043` | ![#213043][#213043] | Strong surfaces like widgets and line highlights |
-| `coldark06` | `#111b27` | ![#111b27][#111b27] | Main dark foreground in Coldark Cold and main background in Coldark Dark |
-| `coldark07` | `#0b121b` | ![#0b121b][#0b121b] | Deep structural background for activity bars, gutters, and borders |
-
-### Accent colors
-
-| Denomination | Coldark Cold | Coldark Dark | Preview | Usage in VS Code |
-| :----------: | :----------: | :----------: | :-----: | ---------------- |
-| `coldark08` | `#c22f2e` | `#cd6660` | ![#c22f2e][#c22f2e] / ![#cd6660][#cd6660] | Red for errors, deletions, invalid states, and deprecated items |
-| `coldark09` | `#a04900` | `#e9ae7e` | ![#a04900][#a04900] / ![#e9ae7e][#e9ae7e] | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark10` | `#755f00` | `#e6d37a` | ![#755f00][#755f00] / ![#e6d37a][#e6d37a] | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark11` | `#116b00` | `#91d076` | ![#116b00][#116b00] / ![#91d076][#91d076] | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#006d6d` | `#66cccc` | ![#006d6d][#006d6d] / ![#66cccc][#66cccc] | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark13` | `#005a8e` | `#6cb8e6` | ![#005a8e][#005a8e] / ![#6cb8e6][#6cb8e6] | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, classes, variables, and headings |
-| `coldark14` | `#7c00aa` | `#c699e3` | ![#7c00aa][#7c00aa] / ![#c699e3][#c699e3] | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark15` | `#af00af` | `#f4adf4` | ![#af00af][#af00af] / ![#f4adf4][#f4adf4] | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+### Light Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :------: | :-----: | ----------- | :----------: |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark background** - Editor Gutter, Inputs, Line Highlight, Status bar (no folder), No tabs. Also used as foreground for Activity bar. | `coldark01` |
+| `#8da1b9` | ![#8da1b9][#8da1b9] | **Selection background** - Code block, Secondary buttons, Some highlighting. Also used for Borders. | `coldark02` |
+| `#3c526d` | ![#3c526d][#3c526d] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
+| `#213043` | ![#213043][#213043] | **Light foreground** – Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
+| `#111b27` | ![#111b27][#111b27] | **Default foreground** - Also used as Shadow and for most of Punctuation. | `coldark05` |
+| `#0b121b` | ![#0b121b][#0b121b] | **Dark foreground** – Also used as background for Activity bar. | `coldark06` |
+| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Light background** – Tab active, Embedded modals, Widgets. | `coldark07` |
+| `#006d6d` | ![#006d6d][#006d6d] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
+| `#755f00` | ![#755f00][#755f00] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
+| `#005a8e` | ![#005a8e][#005a8e] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
+| `#116b00` | ![#116b00][#116b00] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
+| `#af00af` | ![#af00af][#af00af] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
+| `#7c00aa` | ![#7c00aa][#7c00aa] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
+| `#a04900` | ![#a04900][#a04900] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
+| `#c22f2e` | ![#c22f2e][#c22f2e] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
+
+### Dark Theme
+
+| Hex Code | Preview | Description | Denomination |
+| :------: | :-----: | ----------- | :----------: |
+| `#111b27` | ![#111b27][#111b27] | **Default background** – Also used as foreground for Button & Badges. | `coldark00` |
+| `#213043` | ![#213043][#213043] | **Light background** - Embedded modals, Widgets, Line Highlight, Tab active. | `coldark01` |
+| `#3c526d` | ![#3c526d][#3c526d] | **Selection background** - Code block, Secondary buttons, Some highlighting. | `coldark02` |
+| `#8da1b9` | ![#8da1b9][#8da1b9] | **Comments** - Invisible, Ignored, Placeholder. | `coldark03` |
+| `#d0dae7` | ![#d0dae7][#d0dae7] | **Dark foreground** – Activity bar, Inputs, Status bar (no folder), Embedded modals & Widgets. | `coldark04` |
+| `#e3eaf2` | ![#e3eaf2][#e3eaf2] | **Default foreground** - Also used for most of Punctuation. | `coldark05` |
+| `#f0f4f8` | ![#f0f4f8][#f0f4f8] | **Light foreground** – Menu, Tab hover. | `coldark06` |
+| `#0b121b` | ![#0b121b][#0b121b] | **Dark background** - Activity bar, Inputs, Status bar (no folder), Editor Gutter, No tabs. Also used for Borders. | `coldark07` |
+| `#66cccc` | ![#66cccc][#66cccc] | **Cyan** - Merge incoming content, Parameters, Tags, Support constant, CSS Variables, Markup inline raw, Punctuation Section Embedded (e.g. ``) | `coldark08` |
+| `#e6d37a` | ![#e6d37a][#e6d37a] | **Yellow** - Modified, Hints, Integers, Boolean, Constants Language, Attribute Names, Shell Case Patterns, Markup Link URL | `coldark09` |
+| `#6cb8e6` | ![#6cb8e6][#6cb8e6] | **Blue** - Badges, Buttons, Find Match, Info, Merge current content, Selection (outside editor), Status bar (folder open), Namespaces, Classes, Variables, Constants Other, Markup Headings, Property names | `coldark10` |
+| `#91d076` | ![#91d076][#91d076] | **Green** - Added elements, Strings, CSS Colors, CSS Font names, Markup Link Text | `coldark11` |
+| `#f4adf4` | ![#f4adf4][#f4adf4] | **Magenta** - Untracked elements, Token Expression value Support, Regular Expressions, Escape Characters, Constant Characters, Storage Modifiers, Instances, Markup List Punctuation, CSS values | `coldark12` |
+| `#c699e3` | ![#c699e3][#c699e3] | **Purple** - Unverified, Functions, CSS Classes & IDs | `coldark13` |
+| `#e9ae7e` | ![#e9ae7e][#e9ae7e] | **Orange** - Warnings, Status bar (debugging), Keywords, Storage, CSS Pseudo elements | `coldark14` |
+| `#cd6660` | ![#cd6660][#cd6660] | **Red** - Errors, Deleted, Invalids, Deprecated | `coldark15` |
## How to install
From 48bc845e2881f96fdaea68e28b7434eb5ac8fb70 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 29 Mar 2026 21:49:40 +0200
Subject: [PATCH 11/23] docs: write the about page
---
.cspell/project-words.txt | 1 +
website/astro.config.mjs | 2 +-
website/src/content/docs/about.mdx | 30 +++++++++++++++++++
website/src/content/docs/index.mdx | 3 +-
.../docs/{variants => ports}/coldark-bat.md | 0
.../{variants => ports}/coldark-dircolors.md | 0
.../{variants => ports}/coldark-firefox.md | 0
.../coldark-gtksourceview.md | 0
.../docs/{variants => ports}/coldark-prism.md | 0
.../{variants => ports}/coldark-vscode.md | 0
.../coldark-xfce4-terminal.md | 0
website/src/content/docs/why-coldark.mdx | 8 -----
12 files changed, 34 insertions(+), 10 deletions(-)
create mode 100644 website/src/content/docs/about.mdx
rename website/src/content/docs/{variants => ports}/coldark-bat.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-dircolors.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-firefox.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-gtksourceview.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-prism.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-vscode.md (100%)
rename website/src/content/docs/{variants => ports}/coldark-xfce4-terminal.md (100%)
delete mode 100644 website/src/content/docs/why-coldark.mdx
diff --git a/.cspell/project-words.txt b/.cspell/project-words.txt
index cf09be9..d345920 100644
--- a/.cspell/project-words.txt
+++ b/.cspell/project-words.txt
@@ -21,6 +21,7 @@ MULTIHARDLINK
Nord
objc
pacman
+Poldark
prereq
rmvb
rxvt
diff --git a/website/astro.config.mjs b/website/astro.config.mjs
index 69b2713..24fea97 100644
--- a/website/astro.config.mjs
+++ b/website/astro.config.mjs
@@ -40,7 +40,7 @@ export default defineConfig({
],
sidebar: [
{ label: "Getting started", slug: "" },
- { label: "Why Coldark", slug: "why-coldark" },
+ { label: "About", slug: "about" },
{ label: "Colors", slug: "colors" },
{
label: "Variants",
diff --git a/website/src/content/docs/about.mdx b/website/src/content/docs/about.mdx
new file mode 100644
index 0000000..c98d744
--- /dev/null
+++ b/website/src/content/docs/about.mdx
@@ -0,0 +1,30 @@
+---
+title: About Coldark
+description: Discover the philosophy behind Coldark.
+sidebar:
+ order: 2
+---
+
+Coldark is a blue-grey theme available in two variants, Cold and Dark, with ports for editors, terminals, browsers, and other developer tools. The core theme and its ports are [open-source](https://github.com/ArmandPhilippot/coldark) under the MIT License.
+
+## Why Coldark?
+
+I created Coldark because I couldn't find a Visual Studio Code theme that felt comfortable to use for long periods. I don't need extremely high contrast, but after spending hours in front of a screen, I wanted colors that stayed readable without causing eye strain.
+
+Most themes I tried either had too little contrast, an incomplete palette, or colors that simply didn't feel right to me. I also wanted a theme that offered both a light variant and a dark variant, so I could switch depending on the time of day, the lighting, or just my mood. I'm mostly a light-theme person during the day, but I still like switching to a dark theme in the evening.
+
+Once I was happy with the VS Code port, I wanted the same visual language across the rest of my tools, from the terminal to the browser. The goal was a single palette that could adapt to different environments while remaining coherent.
+
+## Why 16 colors?
+
+Although I started with a VS Code theme, I wanted the palette to work in environments with more limited color support. That led me to draw inspiration from [base16](https://github.com/chriskempson/base16) and [Nord](https://www.nordtheme.com/).
+
+Keeping the core palette to 16 colors makes it easier to maintain a consistent visual language across both variants, including ports that only support a small number of colors.
+
+Coldark is not strictly limited to 16 colors, though. Some ports require extra colors for opacity, layering, or UI states, but those colors are derived from the core palette.
+
+## Where does the name come from?
+
+I didn't have a name in mind when I started the project. I was probably also influenced by the TV show "Poldark", which I was watching at the time.
+
+I wanted a theme with a light palette that didn't feel too white. The blue-grey tones felt cold to me, and "Coldark" seemed like a fun portmanteau of "cold" and "dark". It was short, memorable, and fit the project's mood well enough that I kept it.
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index db6f36b..8709cec 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -10,7 +10,7 @@ hero:
file: ../../assets/coldark-banner.svg
actions:
- text: Discover Coldark
- link: /coldark/why-coldark/
+ link: /coldark/about/
icon: right-arrow
- text: Explore the colors
link: /coldark/colors/
@@ -21,6 +21,7 @@ hero:
- text: View on GitHub
link: https://github.com/ArmandPhilippot/coldark
icon: external
+ variant: minimal
---
import { Card, CardGrid } from "@astrojs/starlight/components";
diff --git a/website/src/content/docs/variants/coldark-bat.md b/website/src/content/docs/ports/coldark-bat.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-bat.md
rename to website/src/content/docs/ports/coldark-bat.md
diff --git a/website/src/content/docs/variants/coldark-dircolors.md b/website/src/content/docs/ports/coldark-dircolors.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-dircolors.md
rename to website/src/content/docs/ports/coldark-dircolors.md
diff --git a/website/src/content/docs/variants/coldark-firefox.md b/website/src/content/docs/ports/coldark-firefox.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-firefox.md
rename to website/src/content/docs/ports/coldark-firefox.md
diff --git a/website/src/content/docs/variants/coldark-gtksourceview.md b/website/src/content/docs/ports/coldark-gtksourceview.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-gtksourceview.md
rename to website/src/content/docs/ports/coldark-gtksourceview.md
diff --git a/website/src/content/docs/variants/coldark-prism.md b/website/src/content/docs/ports/coldark-prism.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-prism.md
rename to website/src/content/docs/ports/coldark-prism.md
diff --git a/website/src/content/docs/variants/coldark-vscode.md b/website/src/content/docs/ports/coldark-vscode.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-vscode.md
rename to website/src/content/docs/ports/coldark-vscode.md
diff --git a/website/src/content/docs/variants/coldark-xfce4-terminal.md b/website/src/content/docs/ports/coldark-xfce4-terminal.md
similarity index 100%
rename from website/src/content/docs/variants/coldark-xfce4-terminal.md
rename to website/src/content/docs/ports/coldark-xfce4-terminal.md
diff --git a/website/src/content/docs/why-coldark.mdx b/website/src/content/docs/why-coldark.mdx
deleted file mode 100644
index 686e04b..0000000
--- a/website/src/content/docs/why-coldark.mdx
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: Why Coldark?
-description: Discover the philosophy behind Coldark.
-sidebar:
- order: 2
----
-
-TODO.
From f333c7330db20eb06623b88ddc0b44a1ac259037 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 29 Mar 2026 22:32:50 +0200
Subject: [PATCH 12/23] fix: consistent wording around variants/ports
---
website/astro.config.mjs | 8 ++---
website/src/content/docs/index.mdx | 34 +++++++++----------
website/src/content/docs/ports/coldark-bat.md | 4 +--
.../content/docs/ports/coldark-dircolors.md | 2 +-
.../src/content/docs/ports/coldark-firefox.md | 6 ++--
.../docs/ports/coldark-gtksourceview.md | 4 +--
.../src/content/docs/ports/coldark-prism.md | 2 +-
.../src/content/docs/ports/coldark-vscode.md | 4 +--
.../docs/ports/coldark-xfce4-terminal.md | 2 +-
9 files changed, 33 insertions(+), 33 deletions(-)
diff --git a/website/astro.config.mjs b/website/astro.config.mjs
index 24fea97..ef3f47d 100644
--- a/website/astro.config.mjs
+++ b/website/astro.config.mjs
@@ -10,8 +10,8 @@ export default defineConfig({
starlight({
title: "Coldark",
description:
- "Documentation for the Coldark theme, its palettes, and its variants.",
- tagline: "A blue-grey theme with light and dark versions.",
+ "Documentation for the Coldark theme, its palettes, its variants, and its ports.",
+ tagline: "A blue-grey theme with light and dark variants.",
logo: {
src: "./src/assets/coldark-logo.svg",
alt: "Coldark logo",
@@ -43,8 +43,8 @@ export default defineConfig({
{ label: "About", slug: "about" },
{ label: "Colors", slug: "colors" },
{
- label: "Variants",
- autogenerate: { directory: "variants" },
+ label: "Ports",
+ autogenerate: { directory: "ports" },
},
],
}),
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 8709cec..9b4a452 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -1,11 +1,11 @@
---
title: Coldark
-description: Discover the Coldark theme, its accessible blue-grey palettes, and every available variant.
+description: Discover the Coldark theme, its accessible blue-grey palettes, and every available port.
template: splash
prev: false
next: false
hero:
- tagline: A blue-grey theme with light and dark versions, designed for comfortable reading across and declined for editors, terminals, browsers, and developer tools.
+ tagline: A blue-grey theme available in Cold and Dark variants, designed for comfortable reading in editors, terminals, browsers, and other developer tools.
image:
file: ../../assets/coldark-banner.svg
actions:
@@ -15,8 +15,8 @@ hero:
- text: Explore the colors
link: /coldark/colors/
icon: right-arrow
- - text: Browse variants
- link: /coldark/variants/coldark-vscode/
+ - text: Browse ports
+ link: /coldark/ports/coldark-vscode/
icon: right-arrow
- text: View on GitHub
link: https://github.com/ArmandPhilippot/coldark
@@ -37,45 +37,45 @@ import { Card, CardGrid } from "@astrojs/starlight/components";
The project aims for comfortable contrast and a consistent visual language
across every package.
-
- Coldark ships as a lighter “Cold” version and a darker “Dark” version, each
+
+ Coldark ships in a lighter “Cold” variant and a darker “Dark” variant, each
reusing the same semantic structure.
-
+
The palette already powers VS Code, bat, Firefox, Prism, GTKSourceView,
- dircolors, and XFCE4 Terminal variants.
+ dircolors, and XFCE4 Terminal ports.
-## Available variants
+## Available ports
-
+
The reference implementation of the Coldark palette for Visual Studio Code.
-
+
A web-friendly syntax highlighting theme for Prism.js.
-
+
A browser theme that follows the system preference and supports manual
switching.
-
- Terminal syntax highlighting for bat with cold and dark variants.
+
+ Terminal syntax highlighting for bat with both Cold and Dark variants.
-
+
File-type coloring for shells and tools that use `LS_COLORS`.
Editor themes for GTK-based applications like Mousepad and Gedit.
Terminal presets tailored for the XFCE4 terminal.
diff --git a/website/src/content/docs/ports/coldark-bat.md b/website/src/content/docs/ports/coldark-bat.md
index 101dd84..e1299a9 100644
--- a/website/src/content/docs/ports/coldark-bat.md
+++ b/website/src/content/docs/ports/coldark-bat.md
@@ -9,11 +9,11 @@ Coldark for bat brings the project to the terminal with two syntax themes that m
- Designed for [bat](https://github.com/sharkdp/bat).
- Ships `Coldark-Cold` and `Coldark-Dark`.
-- Great fit for terminals that already use other Coldark variants.
+- Great fit for terminals that already use other Coldark ports.
## Colors
-The bat variant reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](../../colors/) page.
+The bat port reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](../../colors/) page.
### Coldark Cold
diff --git a/website/src/content/docs/ports/coldark-dircolors.md b/website/src/content/docs/ports/coldark-dircolors.md
index 6f50c7b..f24d280 100644
--- a/website/src/content/docs/ports/coldark-dircolors.md
+++ b/website/src/content/docs/ports/coldark-dircolors.md
@@ -3,7 +3,7 @@ title: Dircolors
description: Coldark file-type coloring for shells and tools using LS_COLORS.
---
-Coldark dircolors applies the palette to file listings and works especially well alongside the XFCE4 Terminal variant.
+Coldark dircolors applies the palette to file listings and works especially well alongside the XFCE4 Terminal port.
## Highlights
diff --git a/website/src/content/docs/ports/coldark-firefox.md b/website/src/content/docs/ports/coldark-firefox.md
index 294bc25..e6bdae0 100644
--- a/website/src/content/docs/ports/coldark-firefox.md
+++ b/website/src/content/docs/ports/coldark-firefox.md
@@ -7,19 +7,19 @@ Coldark for Firefox adapts the palette to browser chrome and focuses on the part
## Highlights
-- Detects the user's preferred dark mode and applies the matching version automatically.
+- Detects the user's preferred dark mode and applies the matching variant automatically.
- Lets users switch between variants from a toolbar icon.
- Supports a keyboard shortcut to toggle the theme.
## Palette scope
-Firefox only exposes a smaller theming surface than editors like VS Code, so this variant uses a reduced subset of the full Coldark palette. It focuses on frames, toolbars, selected tabs, fields, icons, and highlight states.
+Firefox only exposes a smaller theming surface than editors like VS Code, so this port uses a reduced subset of the full Coldark palette. It focuses on frames, toolbars, selected tabs, fields, icons, and highlight states.
## Colors
| Token | Coldark Cold | Coldark Dark | Role |
| --- | --- | --- | --- |
-| `coldark00` | `#f0f4f8` | `#f0f4f8` | Popup, focused field, and elevated button background in the light variant |
+| `coldark00` | `#f0f4f8` | `#f0f4f8` | Popup, focused field, and elevated button background in Coldark Cold |
| `coldark01` | `#e3eaf2` | `#e3eaf2` | Bright frame/background support in Coldark Cold and default selected-tab foreground in Coldark Dark |
| `coldark02` | `#d0dae7` | `#d0dae7` | Supporting foreground in Coldark Dark |
| `coldark03` | `#8da1b9` | `#8da1b9` | Unused by the current Firefox package |
diff --git a/website/src/content/docs/ports/coldark-gtksourceview.md b/website/src/content/docs/ports/coldark-gtksourceview.md
index 8a42226..503d6aa 100644
--- a/website/src/content/docs/ports/coldark-gtksourceview.md
+++ b/website/src/content/docs/ports/coldark-gtksourceview.md
@@ -3,7 +3,7 @@ title: GTKSourceView
description: Coldark themes for GTKSourceView-based editors such as Mousepad and Gedit.
---
-This variant adapts Coldark to GTKSourceView and targets editors such as Mousepad and Gedit.
+This port adapts Coldark to GTKSourceView and targets editors such as Mousepad and Gedit.
## Highlights
@@ -13,7 +13,7 @@ This variant adapts Coldark to GTKSourceView and targets editors such as Mousepa
## Colors
-GTKSourceView keeps close to the shared Coldark palette and uses more of the neutral surface colors than terminal-oriented variants do.
+GTKSourceView keeps close to the shared Coldark palette and uses more of the neutral surface colors than terminal-oriented ports do.
### Coldark Cold
diff --git a/website/src/content/docs/ports/coldark-prism.md b/website/src/content/docs/ports/coldark-prism.md
index 302e4cd..985bff4 100644
--- a/website/src/content/docs/ports/coldark-prism.md
+++ b/website/src/content/docs/ports/coldark-prism.md
@@ -9,7 +9,7 @@ Coldark Prism brings the same blue-grey language to Prism.js with a cold and a d
- Built for [Prism.js](https://prismjs.com/).
- Offers both `prism-coldark-cold.css` and `prism-coldark-dark.css`.
-- Stays visually close to the VS Code variant while adapting to Prism's token set.
+- Stays visually close to the VS Code port while adapting to Prism's token set.
## Colors
diff --git a/website/src/content/docs/ports/coldark-vscode.md b/website/src/content/docs/ports/coldark-vscode.md
index 7ff2125..ba08953 100644
--- a/website/src/content/docs/ports/coldark-vscode.md
+++ b/website/src/content/docs/ports/coldark-vscode.md
@@ -18,7 +18,7 @@ Coldark for VS Code is the reference implementation of the theme. It defines the
## Colors
-This package is the reference implementation for Coldark. The main [Colors](../../colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code variant.
+This package is the reference implementation for Coldark. The main [Colors](../../colors/) page documents the shared palette, and the tables below keep the package-specific wording from the VS Code port.
### Common shades
@@ -51,7 +51,7 @@ This package is the reference implementation for Coldark. The main [Colors](../.
The current VS Code theme files confirm a few useful maintenance patterns:
- `coldark00` to `coldark07` form a shared neutral ramp from lightest to darkest, even though each variant assigns those shades to different UI roles.
-- `coldark06` and `coldark07` carry much of the structural contrast in the dark variant, while `coldark00` and `coldark01` do the same for elevated surfaces in the light variant.
+- `coldark06` and `coldark07` carry much of the structural contrast in the Dark variant, while `coldark00` and `coldark01` do the same for elevated surfaces in the Cold variant.
- `coldark08` to `coldark15` stay stable by hue across both variants, which makes ports easier because contributors can reason about accent intent separately from light/dark adaptation.
## Syntax highlighting patterns
diff --git a/website/src/content/docs/ports/coldark-xfce4-terminal.md b/website/src/content/docs/ports/coldark-xfce4-terminal.md
index 85e2294..42b9e06 100644
--- a/website/src/content/docs/ports/coldark-xfce4-terminal.md
+++ b/website/src/content/docs/ports/coldark-xfce4-terminal.md
@@ -13,7 +13,7 @@ Coldark for XFCE4 Terminal brings the palette to terminal surfaces with dedicate
## Colors
-The XFCE4 Terminal variant uses a compact subset of the Coldark palettes. Compared with VS Code, it keeps fewer semantic accents and focuses on the colors that matter most in a terminal palette.
+The XFCE4 Terminal port uses a compact subset of the Coldark palettes. Compared with VS Code, it keeps fewer semantic accents and focuses on the colors that matter most in a terminal palette.
### Coldark Cold
From 62cdd0d67e027663c4cf2d715ebc81b1f440430d Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 29 Mar 2026 23:16:08 +0200
Subject: [PATCH 13/23] fix: tweak an about page paragraph
---
website/src/content/docs/about.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/website/src/content/docs/about.mdx b/website/src/content/docs/about.mdx
index c98d744..eef69c5 100644
--- a/website/src/content/docs/about.mdx
+++ b/website/src/content/docs/about.mdx
@@ -21,7 +21,7 @@ Although I started with a VS Code theme, I wanted the palette to work in environ
Keeping the core palette to 16 colors makes it easier to maintain a consistent visual language across both variants, including ports that only support a small number of colors.
-Coldark is not strictly limited to 16 colors, though. Some ports require extra colors for opacity, layering, or UI states, but those colors are derived from the core palette.
+Coldark is not strictly limited to 16 colors, though. Some ports require extra colors for opacity, layering, UI states, or subtle interface effects, but those colors are derived from the core palette.
## Where does the name come from?
From 5800d22e01c789f2adc25a6639204033deead672 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 29 Mar 2026 23:37:52 +0200
Subject: [PATCH 14/23] fix: one more sentence tweak in the about page
---
website/src/content/docs/about.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/website/src/content/docs/about.mdx b/website/src/content/docs/about.mdx
index eef69c5..4dcb7e7 100644
--- a/website/src/content/docs/about.mdx
+++ b/website/src/content/docs/about.mdx
@@ -27,4 +27,4 @@ Coldark is not strictly limited to 16 colors, though. Some ports require extra c
I didn't have a name in mind when I started the project. I was probably also influenced by the TV show "Poldark", which I was watching at the time.
-I wanted a theme with a light palette that didn't feel too white. The blue-grey tones felt cold to me, and "Coldark" seemed like a fun portmanteau of "cold" and "dark". It was short, memorable, and fit the project's mood well enough that I kept it.
+I wanted a theme with a light palette that didn't feel too white. The blue-grey tones of the light variant felt cold to me, and "Coldark" seemed like a fun portmanteau of "cold" and "dark". It was short, memorable, and fit the project's mood well enough that I kept it.
From 15b4af14e6774a786bc6832da22285c013958357 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 29 Mar 2026 23:43:28 +0200
Subject: [PATCH 15/23] fix: rewrite about page description
---
website/src/content/docs/about.mdx | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/website/src/content/docs/about.mdx b/website/src/content/docs/about.mdx
index 4dcb7e7..73d0d17 100644
--- a/website/src/content/docs/about.mdx
+++ b/website/src/content/docs/about.mdx
@@ -1,6 +1,6 @@
---
title: About Coldark
-description: Discover the philosophy behind Coldark.
+description: Learn why Coldark exists, how its palette was designed, and what shaped the project.
sidebar:
order: 2
---
From 0f87c074e59ab4e94743bc0c03b3010d99ea80d4 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 5 Apr 2026 23:29:02 +0200
Subject: [PATCH 16/23] feat: add a Swatch component
---
package.json | 3 +-
pnpm-lock.yaml | 315 ++++++++++++++++++++++++++
website/package.json | 9 +-
website/src/components/Swatch.astro | 73 ++++++
website/src/components/Swatch.test.ts | 56 +++++
website/src/types/tokens.ts | 1 +
website/src/utils/constants.ts | 42 ++++
website/vitest.config.ts | 11 +
8 files changed, 507 insertions(+), 3 deletions(-)
create mode 100644 website/src/components/Swatch.astro
create mode 100644 website/src/components/Swatch.test.ts
create mode 100644 website/src/types/tokens.ts
create mode 100644 website/src/utils/constants.ts
create mode 100644 website/vitest.config.ts
diff --git a/package.json b/package.json
index 9658d97..4b951ca 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,8 @@
"lint:spelling": "cspell \"**\" --no-progress",
"prepare": "husky",
"website:build": "pnpm --filter coldark-website build",
- "website:dev": "pnpm --filter coldark-website dev"
+ "website:dev": "pnpm --filter coldark-website dev",
+ "website:test": "pnpm --filter coldark-website test"
},
"devDependencies": {
"@arphi/commitlint-config": "^1.0.7",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2a61d9a..5474707 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -85,9 +85,15 @@ importers:
specifier: ^0.34.2
version: 0.34.5
devDependencies:
+ '@vitest/coverage-v8':
+ specifier: ^4.1.2
+ version: 4.1.2(vitest@4.1.2(@types/node@25.3.3)(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)))
typescript:
specifier: ^5.9.3
version: 5.9.3
+ vitest:
+ specifier: ^4.1.2
+ version: 4.1.2(@types/node@25.3.3)(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2))
packages:
@@ -207,6 +213,10 @@ packages:
resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
engines: {node: '>=6.9.0'}
+ '@bcoe/v8-coverage@1.0.2':
+ resolution: {integrity: sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==}
+ engines: {node: '>=18'}
+
'@capsizecss/unpack@4.0.0':
resolution: {integrity: sha512-VERIM64vtTP1C4mxQ5thVT9fK0apjPFobqybMtA1UdUujWka24ERHbRHFGmpbbhp73MhV+KSsHQH9C6uOTdEQA==}
engines: {node: '>=18'}
@@ -997,9 +1007,16 @@ packages:
resolution: {integrity: sha512-AokJm4tuBHillT+FpMtxQ60n8ObyXBatq7jD2/JA9dxbDDokKQm8KMht5ibGzLVU9IJDIKK4TPKgMHEYMn3lMg==}
engines: {node: '>=18'}
+ '@jridgewell/resolve-uri@3.1.2':
+ resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
+ engines: {node: '>=6.0.0'}
+
'@jridgewell/sourcemap-codec@1.5.5':
resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+ '@jridgewell/trace-mapping@0.3.31':
+ resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
+
'@manypkg/find-root@1.1.0':
resolution: {integrity: sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==}
@@ -1418,6 +1435,9 @@ packages:
resolution: {integrity: sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==}
engines: {node: '>=18'}
+ '@standard-schema/spec@1.1.0':
+ resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
+
'@textlint/ast-node-types@15.5.2':
resolution: {integrity: sha512-fCaOxoup5LIyBEo7R1oYWE7V4bSX0KQeHh66twon9e9usaLE3ijgF8QjYsR6joCssdeCHVd0wHm7ppsEyTr6vg==}
@@ -1436,9 +1456,15 @@ packages:
'@tybys/wasm-util@0.10.1':
resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==}
+ '@types/chai@5.2.3':
+ resolution: {integrity: sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==}
+
'@types/debug@4.1.13':
resolution: {integrity: sha512-KSVgmQmzMwPlmtljOomayoR89W4FynCAi3E8PPs7vmDVPe84hT+vGPKkJfThkmXs0x0jAaa9U8uW8bbfyS2fWw==}
+ '@types/deep-eql@4.0.2':
+ resolution: {integrity: sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==}
+
'@types/estree-jsx@1.0.5':
resolution: {integrity: sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==}
@@ -1503,6 +1529,44 @@ packages:
'@ungap/structured-clone@1.3.0':
resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==}
+ '@vitest/coverage-v8@4.1.2':
+ resolution: {integrity: sha512-sPK//PHO+kAkScb8XITeB1bf7fsk85Km7+rt4eeuRR3VS1/crD47cmV5wicisJmjNdfeokTZwjMk4Mj2d58Mgg==}
+ peerDependencies:
+ '@vitest/browser': 4.1.2
+ vitest: 4.1.2
+ peerDependenciesMeta:
+ '@vitest/browser':
+ optional: true
+
+ '@vitest/expect@4.1.2':
+ resolution: {integrity: sha512-gbu+7B0YgUJ2nkdsRJrFFW6X7NTP44WlhiclHniUhxADQJH5Szt9mZ9hWnJPJ8YwOK5zUOSSlSvyzRf0u1DSBQ==}
+
+ '@vitest/mocker@4.1.2':
+ resolution: {integrity: sha512-Ize4iQtEALHDttPRCmN+FKqOl2vxTiNUhzobQFFt/BM1lRUTG7zRCLOykG/6Vo4E4hnUdfVLo5/eqKPukcWW7Q==}
+ peerDependencies:
+ msw: ^2.4.9
+ vite: ^6.0.0 || ^7.0.0 || ^8.0.0
+ peerDependenciesMeta:
+ msw:
+ optional: true
+ vite:
+ optional: true
+
+ '@vitest/pretty-format@4.1.2':
+ resolution: {integrity: sha512-dwQga8aejqeuB+TvXCMzSQemvV9hNEtDDpgUKDzOmNQayl2OG241PSWeJwKRH3CiC+sESrmoFd49rfnq7T4RnA==}
+
+ '@vitest/runner@4.1.2':
+ resolution: {integrity: sha512-Gr+FQan34CdiYAwpGJmQG8PgkyFVmARK8/xSijia3eTFgVfpcpztWLuP6FttGNfPLJhaZVP/euvujeNYar36OQ==}
+
+ '@vitest/snapshot@4.1.2':
+ resolution: {integrity: sha512-g7yfUmxYS4mNxk31qbOYsSt2F4m1E02LFqO53Xpzg3zKMhLAPZAjjfyl9e6z7HrW6LvUdTwAQR3HHfLjpko16A==}
+
+ '@vitest/spy@4.1.2':
+ resolution: {integrity: sha512-DU4fBnbVCJGNBwVA6xSToNXrkZNSiw59H8tcuUspVMsBDBST4nfvsPsEHDHGtWRRnqBERBQu7TrTKskmjqTXKA==}
+
+ '@vitest/utils@4.1.2':
+ resolution: {integrity: sha512-xw2/TiX82lQHA06cgbqRKFb5lCAy3axQ4H4SoUFhUsg+wztiet+co86IAMDtF6Vm1hc7J6j09oh/rgDn+JdKIQ==}
+
'@vscode/vsce-sign-alpine-arm64@2.0.6':
resolution: {integrity: sha512-wKkJBsvKF+f0GfsUuGT0tSW0kZL87QggEiqNqK6/8hvqsXvpx8OsTEc3mnE1kejkh5r+qUyQ7PtF8jZYN0mo8Q==}
cpu: [arm64]
@@ -1681,6 +1745,13 @@ packages:
resolution: {integrity: sha512-1OvF9IbWwaeiM9VhzYXVQacMibxpXOMYVNIvMtKRyX9SImBXpKcFr8XvFDeEslCyuH/t6KRt7HEO94AlP8Iatw==}
engines: {node: '>=12'}
+ assertion-error@2.0.1:
+ resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
+ engines: {node: '>=12'}
+
+ ast-v8-to-istanbul@1.0.0:
+ resolution: {integrity: sha512-1fSfIwuDICFA4LKkCzRPO7F0hzFf0B7+Xqrl27ynQaa+Rh0e1Es0v6kWHPott3lU10AyAr7oKHa65OppjLn3Rg==}
+
astral-regex@2.0.0:
resolution: {integrity: sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==}
engines: {node: '>=8'}
@@ -2047,6 +2118,10 @@ packages:
ccount@2.0.1:
resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==}
+ chai@6.2.2:
+ resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
+ engines: {node: '>=18'}
+
chalk-template@1.1.2:
resolution: {integrity: sha512-2bxTP2yUH7AJj/VAXfcA+4IcWGdQ87HwBANLt5XxGTeomo8yG0y95N1um9i5StvhT/Bl0/2cARA5v1PpPXUxUA==}
engines: {node: '>=14.16'}
@@ -2229,6 +2304,9 @@ packages:
convert-source-map@1.9.0:
resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
+ convert-source-map@2.0.0:
+ resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
+
cookie-es@1.2.2:
resolution: {integrity: sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg==}
@@ -2710,6 +2788,10 @@ packages:
resolution: {integrity: sha512-XYfuKMvj4O35f/pOXLObndIRvyQ+/+6AhODh+OKWj9S9498pHHn/IMszH+gt0fBCRWMNfk1ZSp5x3AifmnI2vg==}
engines: {node: '>=6'}
+ expect-type@1.3.0:
+ resolution: {integrity: sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==}
+ engines: {node: '>=12.0.0'}
+
expressive-code@0.41.7:
resolution: {integrity: sha512-2wZjC8OQ3TaVEMcBtYY4Va3lo6J+Ai9jf3d4dbhURMJcU4Pbqe6EcHe424MIZI0VHUA1bR6xdpoHYi3yxokWqA==}
@@ -3035,6 +3117,9 @@ packages:
resolution: {integrity: sha512-puUZAUKT5m8Zzvs72XWy3HtvVbTWljRE66cP60bxJzAqf2DgICo7lYTY2IHUmLnNpjYvw5bvmoHvPc0QO2a62w==}
engines: {node: ^16.14.0 || >=18.0.0}
+ html-escaper@2.0.2:
+ resolution: {integrity: sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==}
+
html-escaper@3.0.3:
resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
@@ -3270,6 +3355,18 @@ packages:
isexe@2.0.0:
resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
+ istanbul-lib-coverage@3.2.2:
+ resolution: {integrity: sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==}
+ engines: {node: '>=8'}
+
+ istanbul-lib-report@3.0.1:
+ resolution: {integrity: sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==}
+ engines: {node: '>=10'}
+
+ istanbul-reports@3.2.0:
+ resolution: {integrity: sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA==}
+ engines: {node: '>=8'}
+
istextorbinary@9.5.0:
resolution: {integrity: sha512-5mbUj3SiZXCuRf9fT3ibzbSSEWiy63gFfksmGfdOzujPjW3k+z8WvIBxcJHBoQNlaZaiyB25deviif2+osLmLw==}
engines: {node: '>=4'}
@@ -3285,6 +3382,9 @@ packages:
jose@5.9.6:
resolution: {integrity: sha512-AMlnetc9+CV9asI19zHmrgS/WYsWUwCn2R7RzlbJWD7F9eWYUTGyBmU9o6PxngtLGOiDGPRu+Uc4fhKzbpteZQ==}
+ js-tokens@10.0.0:
+ resolution: {integrity: sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q==}
+
js-tokens@3.0.2:
resolution: {integrity: sha512-RjTcuD4xjtthQkaWH7dFlH85L+QaVtSoOyGdZ3g6HFhS9dFNDfLyqgm2NFe2X6cQpeFmt0452FJjFG5UameExg==}
@@ -3490,6 +3590,10 @@ packages:
magicast@0.5.2:
resolution: {integrity: sha512-E3ZJh4J3S9KfwdjZhe2afj6R9lGIN5Pher1pF39UGrXRqq/VDaGVIGN13BjHd2u8B61hArAGOnso7nBOouW3TQ==}
+ make-dir@4.0.0:
+ resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==}
+ engines: {node: '>=10'}
+
make-error@1.3.6:
resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==}
@@ -4002,6 +4106,9 @@ packages:
resolution: {integrity: sha512-Vj7sf++t5pBD637NSfkxpHSMfWaeig5+DKWLhcqIYx6mWQz5hdJTGDVMQiJcw1ZYkhs7AazKDGpRVji1LJCZUQ==}
engines: {node: '>=18'}
+ pathe@2.0.3:
+ resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==}
+
pend@1.2.0:
resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==}
@@ -4413,6 +4520,9 @@ packages:
resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
engines: {node: '>= 0.4'}
+ siginfo@2.0.0:
+ resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
+
signal-exit@4.1.0:
resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
engines: {node: '>=14'}
@@ -4519,6 +4629,12 @@ packages:
sprintf-js@1.0.3:
resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
+ stackback@0.0.2:
+ resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
+
+ std-env@4.0.0:
+ resolution: {integrity: sha512-zUMPtQ/HBY3/50VbpkupYHbRroTRZJPRLvreamgErJVys0ceuzMkD44J/QjqhHjOzK42GQ3QZIeFG1OYfOtKqQ==}
+
stream-replace-string@2.0.0:
resolution: {integrity: sha512-TlnjJ1C0QrmxRNrON00JvaFFlNh5TTG00APw23j74ET7gkQpTASi6/L2fuiav8pzK715HXtUeClpBTw2NPSn6w==}
@@ -4655,6 +4771,9 @@ packages:
tiny-inflate@1.0.3:
resolution: {integrity: sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==}
+ tinybench@2.9.0:
+ resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
+
tinyclip@0.1.12:
resolution: {integrity: sha512-Ae3OVUqifDw0wBriIBS7yVaW44Dp6eSHQcyq4Igc7eN2TJH/2YsicswaW+J/OuMvhpDPOKEgpAZCjkb4hpoyeA==}
engines: {node: ^16.14.0 || >= 17.3.0}
@@ -4667,6 +4786,10 @@ packages:
resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
engines: {node: '>=12.0.0'}
+ tinyrainbow@3.1.0:
+ resolution: {integrity: sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==}
+ engines: {node: '>=14.0.0'}
+
tmp@0.2.5:
resolution: {integrity: sha512-voyz6MApa1rQGUxT3E+BK7/ROe8itEx7vD8/HEvt4xwXucvQ5G5oeEiHkmHZJuBO21RpOf+YYm9MOivj709jow==}
engines: {node: '>=14.14'}
@@ -4952,6 +5075,41 @@ packages:
vite:
optional: true
+ vitest@4.1.2:
+ resolution: {integrity: sha512-xjR1dMTVHlFLh98JE3i/f/WePqJsah4A0FK9cc8Ehp9Udk0AZk6ccpIZhh1qJ/yxVWRZ+Q54ocnD8TXmkhspGg==}
+ engines: {node: ^20.0.0 || ^22.0.0 || >=24.0.0}
+ hasBin: true
+ peerDependencies:
+ '@edge-runtime/vm': '*'
+ '@opentelemetry/api': ^1.9.0
+ '@types/node': ^20.0.0 || ^22.0.0 || >=24.0.0
+ '@vitest/browser-playwright': 4.1.2
+ '@vitest/browser-preview': 4.1.2
+ '@vitest/browser-webdriverio': 4.1.2
+ '@vitest/ui': 4.1.2
+ happy-dom: '*'
+ jsdom: '*'
+ vite: ^6.0.0 || ^7.0.0 || ^8.0.0
+ peerDependenciesMeta:
+ '@edge-runtime/vm':
+ optional: true
+ '@opentelemetry/api':
+ optional: true
+ '@types/node':
+ optional: true
+ '@vitest/browser-playwright':
+ optional: true
+ '@vitest/browser-preview':
+ optional: true
+ '@vitest/browser-webdriverio':
+ optional: true
+ '@vitest/ui':
+ optional: true
+ happy-dom:
+ optional: true
+ jsdom:
+ optional: true
+
vscode-languageserver-textdocument@1.0.12:
resolution: {integrity: sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==}
@@ -5005,6 +5163,11 @@ packages:
engines: {node: '>= 8'}
hasBin: true
+ why-is-node-running@2.3.0:
+ resolution: {integrity: sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==}
+ engines: {node: '>=8'}
+ hasBin: true
+
widest-line@5.0.0:
resolution: {integrity: sha512-c9bZp7b5YtRj2wOe6dlj32MK+Bx/M/d+9VB2SHM1OtsUHR0aV0tdP6DWh/iMt0kWi1t5g1Iudu6hQRNd1A4PVA==}
engines: {node: '>=18'}
@@ -5335,6 +5498,8 @@ snapshots:
'@babel/helper-string-parser': 7.27.1
'@babel/helper-validator-identifier': 7.28.5
+ '@bcoe/v8-coverage@1.0.2': {}
+
'@capsizecss/unpack@4.0.0':
dependencies:
fontkitten: 1.0.3
@@ -6125,8 +6290,15 @@ snapshots:
'@isaacs/cliui@9.0.0': {}
+ '@jridgewell/resolve-uri@3.1.2': {}
+
'@jridgewell/sourcemap-codec@1.5.5': {}
+ '@jridgewell/trace-mapping@0.3.31':
+ dependencies:
+ '@jridgewell/resolve-uri': 3.1.2
+ '@jridgewell/sourcemap-codec': 1.5.5
+
'@manypkg/find-root@1.1.0':
dependencies:
'@babel/runtime': 7.28.6
@@ -6523,6 +6695,8 @@ snapshots:
'@sindresorhus/merge-streams@2.3.0': {}
+ '@standard-schema/spec@1.1.0': {}
+
'@textlint/ast-node-types@15.5.2': {}
'@textlint/linter-formatter@15.5.2':
@@ -6557,10 +6731,17 @@ snapshots:
tslib: 2.8.1
optional: true
+ '@types/chai@5.2.3':
+ dependencies:
+ '@types/deep-eql': 4.0.2
+ assertion-error: 2.0.1
+
'@types/debug@4.1.13':
dependencies:
'@types/ms': 2.1.0
+ '@types/deep-eql@4.0.2': {}
+
'@types/estree-jsx@1.0.5':
dependencies:
'@types/estree': 1.0.8
@@ -6625,6 +6806,61 @@ snapshots:
'@ungap/structured-clone@1.3.0': {}
+ '@vitest/coverage-v8@4.1.2(vitest@4.1.2(@types/node@25.3.3)(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)))':
+ dependencies:
+ '@bcoe/v8-coverage': 1.0.2
+ '@vitest/utils': 4.1.2
+ ast-v8-to-istanbul: 1.0.0
+ istanbul-lib-coverage: 3.2.2
+ istanbul-lib-report: 3.0.1
+ istanbul-reports: 3.2.0
+ magicast: 0.5.2
+ obug: 2.1.1
+ std-env: 4.0.0
+ tinyrainbow: 3.1.0
+ vitest: 4.1.2(@types/node@25.3.3)(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2))
+
+ '@vitest/expect@4.1.2':
+ dependencies:
+ '@standard-schema/spec': 1.1.0
+ '@types/chai': 5.2.3
+ '@vitest/spy': 4.1.2
+ '@vitest/utils': 4.1.2
+ chai: 6.2.2
+ tinyrainbow: 3.1.0
+
+ '@vitest/mocker@4.1.2(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2))':
+ dependencies:
+ '@vitest/spy': 4.1.2
+ estree-walker: 3.0.3
+ magic-string: 0.30.21
+ optionalDependencies:
+ vite: 7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)
+
+ '@vitest/pretty-format@4.1.2':
+ dependencies:
+ tinyrainbow: 3.1.0
+
+ '@vitest/runner@4.1.2':
+ dependencies:
+ '@vitest/utils': 4.1.2
+ pathe: 2.0.3
+
+ '@vitest/snapshot@4.1.2':
+ dependencies:
+ '@vitest/pretty-format': 4.1.2
+ '@vitest/utils': 4.1.2
+ magic-string: 0.30.21
+ pathe: 2.0.3
+
+ '@vitest/spy@4.1.2': {}
+
+ '@vitest/utils@4.1.2':
+ dependencies:
+ '@vitest/pretty-format': 4.1.2
+ convert-source-map: 2.0.0
+ tinyrainbow: 3.1.0
+
'@vscode/vsce-sign-alpine-arm64@2.0.6':
optional: true
@@ -6830,6 +7066,14 @@ snapshots:
array-union@3.0.1: {}
+ assertion-error@2.0.1: {}
+
+ ast-v8-to-istanbul@1.0.0:
+ dependencies:
+ '@jridgewell/trace-mapping': 0.3.31
+ estree-walker: 3.0.3
+ js-tokens: 10.0.0
+
astral-regex@2.0.0: {}
astring@1.9.0: {}
@@ -7578,6 +7822,8 @@ snapshots:
ccount@2.0.1: {}
+ chai@6.2.2: {}
+
chalk-template@1.1.2:
dependencies:
chalk: 5.6.2
@@ -7763,6 +8009,8 @@ snapshots:
convert-source-map@1.9.0: {}
+ convert-source-map@2.0.0: {}
+
cookie-es@1.2.2: {}
cookie@1.1.1: {}
@@ -8312,6 +8560,8 @@ snapshots:
expand-template@2.0.3:
optional: true
+ expect-type@1.3.0: {}
+
expressive-code@0.41.7:
dependencies:
'@expressive-code/core': 0.41.7
@@ -8783,6 +9033,8 @@ snapshots:
dependencies:
lru-cache: 10.4.3
+ html-escaper@2.0.2: {}
+
html-escaper@3.0.3: {}
html-void-elements@3.0.0: {}
@@ -8960,6 +9212,19 @@ snapshots:
isexe@2.0.0: {}
+ istanbul-lib-coverage@3.2.2: {}
+
+ istanbul-lib-report@3.0.1:
+ dependencies:
+ istanbul-lib-coverage: 3.2.2
+ make-dir: 4.0.0
+ supports-color: 7.2.0
+
+ istanbul-reports@3.2.0:
+ dependencies:
+ html-escaper: 2.0.2
+ istanbul-lib-report: 3.0.1
+
istextorbinary@9.5.0:
dependencies:
binaryextensions: 6.11.0
@@ -8974,6 +9239,8 @@ snapshots:
jose@5.9.6: {}
+ js-tokens@10.0.0: {}
+
js-tokens@3.0.2: {}
js-tokens@4.0.0: {}
@@ -9189,6 +9456,10 @@ snapshots:
'@babel/types': 7.29.0
source-map-js: 1.2.1
+ make-dir@4.0.0:
+ dependencies:
+ semver: 7.7.4
+
make-error@1.3.6: {}
markdown-extensions@2.0.0: {}
@@ -9999,6 +10270,8 @@ snapshots:
path-type@6.0.0: {}
+ pathe@2.0.3: {}
+
pend@1.2.0: {}
piccolore@0.1.3: {}
@@ -10572,6 +10845,8 @@ snapshots:
side-channel-map: 1.0.1
side-channel-weakmap: 1.0.2
+ siginfo@2.0.0: {}
+
signal-exit@4.1.0: {}
simple-concat@1.0.1:
@@ -10674,6 +10949,10 @@ snapshots:
sprintf-js@1.0.3: {}
+ stackback@0.0.2: {}
+
+ std-env@4.0.0: {}
+
stream-replace-string@2.0.0: {}
string-argv@0.3.2: {}
@@ -10825,6 +11104,8 @@ snapshots:
tiny-inflate@1.0.3: {}
+ tinybench@2.9.0: {}
+
tinyclip@0.1.12: {}
tinyexec@1.0.2: {}
@@ -10834,6 +11115,8 @@ snapshots:
fdir: 6.5.0(picomatch@4.0.3)
picomatch: 4.0.3
+ tinyrainbow@3.1.0: {}
+
tmp@0.2.5: {}
to-fast-properties@1.0.3: {}
@@ -11041,6 +11324,33 @@ snapshots:
optionalDependencies:
vite: 7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)
+ vitest@4.1.2(@types/node@25.3.3)(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)):
+ dependencies:
+ '@vitest/expect': 4.1.2
+ '@vitest/mocker': 4.1.2(vite@7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2))
+ '@vitest/pretty-format': 4.1.2
+ '@vitest/runner': 4.1.2
+ '@vitest/snapshot': 4.1.2
+ '@vitest/spy': 4.1.2
+ '@vitest/utils': 4.1.2
+ es-module-lexer: 2.0.0
+ expect-type: 1.3.0
+ magic-string: 0.30.21
+ obug: 2.1.1
+ pathe: 2.0.3
+ picomatch: 4.0.3
+ std-env: 4.0.0
+ tinybench: 2.9.0
+ tinyexec: 1.0.2
+ tinyglobby: 0.2.15
+ tinyrainbow: 3.1.0
+ vite: 7.3.1(@types/node@25.3.3)(jiti@2.6.1)(yaml@2.8.2)
+ why-is-node-running: 2.3.0
+ optionalDependencies:
+ '@types/node': 25.3.3
+ transitivePeerDependencies:
+ - msw
+
vscode-languageserver-textdocument@1.0.12: {}
vscode-uri@3.1.0: {}
@@ -11118,6 +11428,11 @@ snapshots:
dependencies:
isexe: 2.0.0
+ why-is-node-running@2.3.0:
+ dependencies:
+ siginfo: 2.0.0
+ stackback: 0.0.2
+
widest-line@5.0.0:
dependencies:
string-width: 7.2.0
diff --git a/website/package.json b/website/package.json
index 662a4d5..9aa76e2 100644
--- a/website/package.json
+++ b/website/package.json
@@ -7,7 +7,10 @@
"dev": "astro dev",
"build": "astro build",
"preview": "astro preview",
- "astro": "astro"
+ "astro": "astro",
+ "test": "vitest",
+ "test:coverage": "vitest run --coverage",
+ "test:watch": "vitest watch"
},
"dependencies": {
"@astrojs/starlight": "^0.38.2",
@@ -15,6 +18,8 @@
"sharp": "^0.34.2"
},
"devDependencies": {
- "typescript": "^5.9.3"
+ "@vitest/coverage-v8": "^4.1.2",
+ "typescript": "^5.9.3",
+ "vitest": "^4.1.2"
}
}
diff --git a/website/src/components/Swatch.astro b/website/src/components/Swatch.astro
new file mode 100644
index 0000000..93c9551
--- /dev/null
+++ b/website/src/components/Swatch.astro
@@ -0,0 +1,73 @@
+---
+import type { VariantKey } from "../types/tokens";
+import { PALETTE } from "../utils/constants";
+
+type ColdarkToken = keyof typeof PALETTE;
+type SwatchEntry = {
+ token: ColdarkToken;
+ hex: string;
+ variant?: VariantKey;
+};
+
+type Props = {
+ color: ColdarkToken | ColdarkToken[];
+ variant?: VariantKey;
+ decorative?: boolean;
+};
+
+const { color, variant, decorative = false } = Astro.props;
+const tokens = Array.isArray(color) ? color : [color];
+const swatches: SwatchEntry[] = tokens.flatMap((token) => {
+ const entries = PALETTE[token];
+ const filteredEntries =
+ variant === undefined
+ ? entries
+ : entries.filter(
+ (entry) => "variant" in entry && entry.variant === variant
+ );
+
+ return filteredEntries.map((entry) => ({ ...entry, token }));
+});
+
+const describeSwatch = ({ token, hex, variant }: SwatchEntry) =>
+ variant ? `${token} ${variant} ${hex}` : `${token} ${hex}`;
+
+const label =
+ swatches.length === 1
+ ? `Color swatch: ${describeSwatch(swatches[0])}.`
+ : `Color swatches: ${swatches.map(describeSwatch).join("; ")}.`;
+---
+
+
+ {
+ swatches.map(({ hex }) => (
+
+ ))
+ }
+
+
+
diff --git a/website/src/components/Swatch.test.ts b/website/src/components/Swatch.test.ts
new file mode 100644
index 0000000..eb6a4f3
--- /dev/null
+++ b/website/src/components/Swatch.test.ts
@@ -0,0 +1,56 @@
+import { experimental_AstroContainer as AstroContainer } from "astro/container";
+import { describe, expect, it } from "vitest";
+
+import Swatch from "./Swatch.astro";
+
+describe("Swatch", () => {
+ it("renders an accessible label for a shared swatch", async () => {
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(Swatch, {
+ props: { color: "coldark01" },
+ });
+
+ expect(result).toContain('role="img"');
+ expect(result).toContain('aria-label="Color swatch: coldark01 #e3eaf2."');
+ expect(result).toContain('style="--swatch: #e3eaf2;"');
+ });
+
+ it("renders multiple swatches when color is an array", async () => {
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(Swatch, {
+ props: { color: ["coldark01", "coldark06"] },
+ });
+
+ expect(result).toContain('role="img"');
+ expect(result).toContain(
+ 'aria-label="Color swatches: coldark01 #e3eaf2; coldark06 #111b27."'
+ );
+ expect(result).toContain('style="--swatch: #e3eaf2;"');
+ expect(result).toContain('style="--swatch: #111b27;"');
+ });
+
+ it("renders only the requested variant for accent swatches", async () => {
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(Swatch, {
+ props: { color: "coldark13", variant: "dark" },
+ });
+
+ expect(result).toContain(
+ 'aria-label="Color swatch: coldark13 dark #6cb8e6."'
+ );
+ expect(result).toContain('style="--swatch: #6cb8e6;"');
+ expect(result).not.toContain("#005a8e");
+ });
+
+ it("hides decorative swatches from assistive technology", async () => {
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(Swatch, {
+ props: { color: "coldark08", variant: "cold", decorative: true },
+ });
+
+ expect(result).toContain('aria-hidden="true"');
+ expect(result).not.toContain('role="img"');
+ expect(result).not.toContain("aria-label=");
+ expect(result).toContain('style="--swatch: #c22f2e;"');
+ });
+});
diff --git a/website/src/types/tokens.ts b/website/src/types/tokens.ts
new file mode 100644
index 0000000..f98fbaf
--- /dev/null
+++ b/website/src/types/tokens.ts
@@ -0,0 +1 @@
+export type VariantKey = "cold" | "dark";
diff --git a/website/src/utils/constants.ts b/website/src/utils/constants.ts
new file mode 100644
index 0000000..8aea5b6
--- /dev/null
+++ b/website/src/utils/constants.ts
@@ -0,0 +1,42 @@
+export const PALETTE = {
+ coldark00: [{ hex: "#f0f4f8" }],
+ coldark01: [{ hex: "#e3eaf2" }],
+ coldark02: [{ hex: "#d0dae7" }],
+ coldark03: [{ hex: "#8da1b9" }],
+ coldark04: [{ hex: "#3c526d" }],
+ coldark05: [{ hex: "#213043" }],
+ coldark06: [{ hex: "#111b27" }],
+ coldark07: [{ hex: "#0b121b" }],
+ coldark08: [
+ { hex: "#c22f2e", variant: "cold" },
+ { hex: "#cd6660", variant: "dark" },
+ ],
+ coldark09: [
+ { hex: "#a04900", variant: "cold" },
+ { hex: "#e9ae7e", variant: "dark" },
+ ],
+ coldark10: [
+ { hex: "#755f00", variant: "cold" },
+ { hex: "#e6d37a", variant: "dark" },
+ ],
+ coldark11: [
+ { hex: "#116b00", variant: "cold" },
+ { hex: "#91d076", variant: "dark" },
+ ],
+ coldark12: [
+ { hex: "#006d6d", variant: "cold" },
+ { hex: "#66cccc", variant: "dark" },
+ ],
+ coldark13: [
+ { hex: "#005a8e", variant: "cold" },
+ { hex: "#6cb8e6", variant: "dark" },
+ ],
+ coldark14: [
+ { hex: "#7c00aa", variant: "cold" },
+ { hex: "#c699e3", variant: "dark" },
+ ],
+ coldark15: [
+ { hex: "#af00af", variant: "cold" },
+ { hex: "#f4adf4", variant: "dark" },
+ ],
+} as const;
diff --git a/website/vitest.config.ts b/website/vitest.config.ts
new file mode 100644
index 0000000..7328d66
--- /dev/null
+++ b/website/vitest.config.ts
@@ -0,0 +1,11 @@
+///
+import { getViteConfig } from "astro/config";
+
+export default getViteConfig({
+ test: {
+ environment: "node",
+ globals: false,
+ include: ["src/**/*.test.ts"],
+ watch: false,
+ },
+});
From 11664440cb89f472a1ebee08839d9f3dd6af1c0f Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 5 Apr 2026 23:29:55 +0200
Subject: [PATCH 17/23] docs: rewrite bat port docs
---
website/src/content/docs/ports/coldark-bat.md | 72 -----------------
.../src/content/docs/ports/coldark-bat.mdx | 79 +++++++++++++++++++
2 files changed, 79 insertions(+), 72 deletions(-)
delete mode 100644 website/src/content/docs/ports/coldark-bat.md
create mode 100644 website/src/content/docs/ports/coldark-bat.mdx
diff --git a/website/src/content/docs/ports/coldark-bat.md b/website/src/content/docs/ports/coldark-bat.md
deleted file mode 100644
index e1299a9..0000000
--- a/website/src/content/docs/ports/coldark-bat.md
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: bat
-description: Coldark syntax highlighting themes for bat.
----
-
-Coldark for bat brings the project to the terminal with two syntax themes that match the Cold and Dark variants.
-
-## Highlights
-
-- Designed for [bat](https://github.com/sharkdp/bat).
-- Ships `Coldark-Cold` and `Coldark-Dark`.
-- Great fit for terminals that already use other Coldark ports.
-
-## Colors
-
-The bat port reuses the shared Coldark syntax palette rather than defining package-specific UI colors. It keeps the core foreground and accent colors used for code tokens and leaves out most of the editor-specific surface colors documented on the main [Colors](../../colors/) page.
-
-### Coldark Cold
-
-| Hex | Typical role |
-| --- | --- |
-| `#e3eaf2` | Background contrast and bright text support |
-| `#d0dae7` | Secondary background surfaces |
-| `#111b27` | Main foreground |
-| `#3c526d` | Comments and subdued text |
-| `#005a8e` | Classes, variables, headings, and prominent syntax |
-| `#006d6d` | Parameters, tags, and embedded punctuation |
-| `#116b00` | Strings and additions |
-| `#755f00` | Numbers, booleans, hints, and modified states |
-| `#af00af` | Regex, escapes, and value-like tokens |
-| `#7c00aa` | Functions and selectors |
-| `#a04900` | Keywords and warnings |
-| `#c22f2e` | Errors and invalid tokens |
-
-### Coldark Dark
-
-| Hex | Typical role |
-| --- | --- |
-| `#111b27` | Main background |
-| `#213043` | Secondary background |
-| `#e3eaf2` | Main foreground |
-| `#8da1b9` | Comments and subdued text |
-| `#0b121b` | Deep background accents |
-| `#6cb8e6` | Classes, variables, headings, and prominent syntax |
-| `#66cccc` | Parameters, tags, and embedded punctuation |
-| `#91d076` | Strings and additions |
-| `#e6d37a` | Numbers, booleans, hints, and modified states |
-| `#f4adf4` | Regex, escapes, and value-like tokens |
-| `#c699e3` | Functions and selectors |
-| `#e9ae7e` | Keywords and warnings |
-| `#cd6660` | Errors and invalid tokens |
-
-## Installation
-
-1. Create the bat themes directory with `mkdir -p "$(bat --config-dir)/themes"`.
-2. Copy the package contents into that folder.
-3. Rebuild the bat cache with `bat cache --build`.
-4. Verify the themes are available with `bat --list-themes`.
-
-## Activation
-
-Use one of the themes on demand:
-
-```sh
-bat --theme="Coldark-Cold"
-```
-
-Or make it the default in your shell config:
-
-```sh
-export BAT_THEME="Coldark-Dark"
-```
diff --git a/website/src/content/docs/ports/coldark-bat.mdx b/website/src/content/docs/ports/coldark-bat.mdx
new file mode 100644
index 0000000..557104c
--- /dev/null
+++ b/website/src/content/docs/ports/coldark-bat.mdx
@@ -0,0 +1,79 @@
+---
+title: bat
+description: Coldark syntax highlighting themes for bat.
+---
+
+import Swatch from "../../../components/Swatch.astro";
+
+Coldark is also available for bat, a modern alternative to `cat` with syntax highlighting.
+
+## Installation
+
+1. Create the bat themes directory with the following command:
+ ```sh
+ mkdir -p "$(bat --config-dir)/themes"
+ ```
+2. Copy the package contents into that folder. You can do this using Git:
+ ```sh
+ git clone -n --depth=1 --filter=tree:0 https://github.com/ArmandPhilippot/coldark
+ cd coldark
+ git sparse-checkout set --no-cone /packages/coldark-bat
+ git checkout
+ ```
+3. Rebuild the bat cache:
+ ```sh
+ bat cache --build
+ ```
+4. Verify the themes are available:
+ ```sh
+ bat --list-themes
+ ```
+
+## Activation
+
+Use one of the themes on demand:
+
+```sh
+bat --theme="Coldark-Cold"
+```
+
+Or make it the default in your shell config:
+
+```sh
+export BAT_THEME="Coldark-Dark"
+```
+
+Alternatively, you can use [bat's configuration file](https://github.com/sharkdp/bat#configuration-file).
+
+```sh
+bat --generate-config-file
+nano $(bat --config-file)
+```
+
+Then, update the theme by uncommenting the line and replacing the value:
+```diff del={3} ins={4}
+# Specify desired highlighting theme (e.g. "TwoDark"). Run `bat --list-themes`
+# for a list of all available themes
+#--theme="TwoDark"
+--theme="Coldark-Dark"
+```
+
+## Colors
+
+The bat port reuses [Coldark colors](/coldark/colors/) to provide a consistent syntax highlighting experience across editors despite the different token scopes.
+
+| Coldark Cold | Coldark Dark | Role |
+| :----------: | :----------: | ------------ |
+| `#e3eaf2` | `#111b27` | Main background |
+| `#d0dae7` | `#213043` | Line highlight and selection surfaces |
+| `#d0dae7` | `#0b121b` | Gutter background |
+| `#111b27` | `#e3eaf2` | Primary foreground, caret, and punctuation |
+| `#3c526d` | `#8da1b9` | Comments, invisibles, and gutter text |
+| `#005a8e` | `#6cb8e6` | Types, namespaces, variables, headings, and find highlights |
+| `#006d6d` | `#66cccc` | Tags, parameters, object keys, raw markup, and shebang punctuation |
+| `#116b00` | `#91d076` | Strings, inserted text, color literals, and Markdown link labels |
+| `#755f00` | `#e6d37a` | Numbers, language constants, attribute names, changed text, and links |
+| `#af00af` | `#f4adf4` | Regex, escapes, modifiers, list markers, and support symbols |
+| `#7c00aa` | `#c699e3` | Functions, call sites, and CSS class or ID selectors |
+| `#a04900` | `#e9ae7e` | Keywords, storage types, and pseudo-classes or pseudo-elements |
+| `#c22f2e` | `#cd6660` | Invalid tokens and deleted markup |
From aaa41b8b6c50fa957cfd7ae9eb456937c8f220e5 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Sun, 5 Apr 2026 23:44:40 +0200
Subject: [PATCH 18/23] ci: add a GitHub workflow for tests
---
.github/workflows/tests.yml | 44 +++++++++++++++++++++++++++++++++++++
package.json | 5 ++++-
2 files changed, 48 insertions(+), 1 deletion(-)
create mode 100644 .github/workflows/tests.yml
diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
new file mode 100644
index 0000000..0e0ada0
--- /dev/null
+++ b/.github/workflows/tests.yml
@@ -0,0 +1,44 @@
+name: Tests
+permissions: {}
+
+on:
+ push:
+ branches:
+ - main
+ pull_request:
+
+defaults:
+ run:
+ shell: bash
+
+env:
+ CI: true
+ FORCE_COLOR: true
+
+concurrency:
+ group: ${{ github.workflow }}-${{ github.event_name == 'pull_request_target' && github.head_ref || github.ref }}
+ cancel-in-progress: true
+
+jobs:
+ test:
+ name: Tests
+ timeout-minutes: 15
+ runs-on: ubuntu-latest
+ steps:
+ - name: Checkout Repo
+ uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+ - name: Setup pnpm
+ uses: pnpm/action-setup@41ff72655975bd51cab0327fa583b6e92b6d3061 # v4.2.0
+
+ - name: Install Node.js
+ uses: actions/setup-node@53b83947a5a98c8d113130e565377fae1a50d02f # v6.3.0
+ with:
+ cache: pnpm
+ node-version: 24.14.0
+
+ - name: Install dependencies
+ run: pnpm i --frozen-lockfile
+
+ - name: Run tests
+ run: pnpm test
diff --git a/package.json b/package.json
index 4b951ca..ca72a70 100644
--- a/package.json
+++ b/package.json
@@ -28,9 +28,12 @@
"lint:formatting": "prettier . --check",
"lint:spelling": "cspell \"**\" --no-progress",
"prepare": "husky",
+ "test": "pnpm -r --if-present test",
+ "test:coverage": "pnpm -r --if-present test:coverage",
"website:build": "pnpm --filter coldark-website build",
"website:dev": "pnpm --filter coldark-website dev",
- "website:test": "pnpm --filter coldark-website test"
+ "website:test": "pnpm --filter coldark-website test",
+ "website:test:coverage": "pnpm --filter coldark-website test:coverage"
},
"devDependencies": {
"@arphi/commitlint-config": "^1.0.7",
From c28aae4baf8e0fed614e46bab8fa5e4d659c080e Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 7 Apr 2026 21:45:03 +0200
Subject: [PATCH 19/23] fix: use Starlight Steps component
---
.../src/content/docs/ports/coldark-bat.mdx | 33 ++++++++++---------
1 file changed, 18 insertions(+), 15 deletions(-)
diff --git a/website/src/content/docs/ports/coldark-bat.mdx b/website/src/content/docs/ports/coldark-bat.mdx
index 557104c..74a75a4 100644
--- a/website/src/content/docs/ports/coldark-bat.mdx
+++ b/website/src/content/docs/ports/coldark-bat.mdx
@@ -3,31 +3,34 @@ title: bat
description: Coldark syntax highlighting themes for bat.
---
+import { Steps } from "@astrojs/starlight/components";
import Swatch from "../../../components/Swatch.astro";
Coldark is also available for bat, a modern alternative to `cat` with syntax highlighting.
## Installation
+
1. Create the bat themes directory with the following command:
- ```sh
- mkdir -p "$(bat --config-dir)/themes"
- ```
+ ```sh
+ mkdir -p "$(bat --config-dir)/themes"
+ ```
2. Copy the package contents into that folder. You can do this using Git:
- ```sh
- git clone -n --depth=1 --filter=tree:0 https://github.com/ArmandPhilippot/coldark
- cd coldark
- git sparse-checkout set --no-cone /packages/coldark-bat
- git checkout
- ```
+ ```sh
+ git clone -n --depth=1 --filter=tree:0 https://github.com/ArmandPhilippot/coldark
+ cd coldark
+ git sparse-checkout set --no-cone /packages/coldark-bat
+ git checkout
+ ```
3. Rebuild the bat cache:
- ```sh
- bat cache --build
- ```
+ ```sh
+ bat cache --build
+ ```
4. Verify the themes are available:
- ```sh
- bat --list-themes
- ```
+ ```sh
+ bat --list-themes
+ ```
+
## Activation
From 270884078f9811c1a30daccd6d548e5a74b255f7 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 7 Apr 2026 22:58:56 +0200
Subject: [PATCH 20/23] feat: introduce a new ColdarkHex component
---
website/src/components/ColdarkHex.astro | 29 +++++
website/src/components/ColdarkHex.test.ts | 34 ++++++
website/src/components/Swatch.astro | 41 ++-----
website/src/components/Swatch.test.ts | 50 +++++----
website/src/content/docs/colors.mdx | 106 +++++++-----------
.../src/content/docs/ports/coldark-bat.mdx | 28 ++---
website/src/styles/custom/palettes.css | 17 +--
website/src/utils/palette.test.ts | 26 +++++
website/src/utils/palette.ts | 28 +++++
9 files changed, 212 insertions(+), 147 deletions(-)
create mode 100644 website/src/components/ColdarkHex.astro
create mode 100644 website/src/components/ColdarkHex.test.ts
create mode 100644 website/src/utils/palette.test.ts
create mode 100644 website/src/utils/palette.ts
diff --git a/website/src/components/ColdarkHex.astro b/website/src/components/ColdarkHex.astro
new file mode 100644
index 0000000..cb5d1f9
--- /dev/null
+++ b/website/src/components/ColdarkHex.astro
@@ -0,0 +1,29 @@
+---
+import type { VariantKey } from "../types/tokens";
+import type { ColdarkToken } from "../utils/palette";
+import { getPaletteHex } from "../utils/palette";
+import Swatch from "./Swatch.astro";
+
+type Props = {
+ token: ColdarkToken;
+ variant?: VariantKey;
+};
+
+const { token, variant } = Astro.props;
+const hex = getPaletteHex(token, variant);
+---
+
+
+
+ {hex}
+
+
+
diff --git a/website/src/components/ColdarkHex.test.ts b/website/src/components/ColdarkHex.test.ts
new file mode 100644
index 0000000..aa6fbfe
--- /dev/null
+++ b/website/src/components/ColdarkHex.test.ts
@@ -0,0 +1,34 @@
+import { experimental_AstroContainer as AstroContainer } from "astro/container";
+import { describe, expect, it } from "vitest";
+
+import ColdarkHex from "./ColdarkHex.astro";
+
+describe("ColdarkHex", () => {
+ it("renders the hex value for a shared palette token", async () => {
+ // eslint-disable-next-line no-magic-numbers -- Self-explanatory.
+ expect.assertions(3);
+
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(ColdarkHex, {
+ props: { token: "coldark01" },
+ });
+
+ expect(result).toContain(">#e3eaf2");
+ expect(result).toContain('style="--swatch: #e3eaf2;"');
+ expect(result).toContain('aria-hidden="true"');
+ });
+
+ it("renders the requested variant for an accent token", async () => {
+ // eslint-disable-next-line no-magic-numbers -- Self-explanatory.
+ expect.assertions(3);
+
+ const container = await AstroContainer.create();
+ const result = await container.renderToString(ColdarkHex, {
+ props: { token: "coldark13", variant: "dark" },
+ });
+
+ expect(result).toContain(">#6cb8e6");
+ expect(result).toContain('style="--swatch: #6cb8e6;"');
+ expect(result).not.toContain("#005a8e");
+ });
+});
diff --git a/website/src/components/Swatch.astro b/website/src/components/Swatch.astro
index 93c9551..5b89186 100644
--- a/website/src/components/Swatch.astro
+++ b/website/src/components/Swatch.astro
@@ -1,41 +1,20 @@
---
-import type { VariantKey } from "../types/tokens";
-import { PALETTE } from "../utils/constants";
-
-type ColdarkToken = keyof typeof PALETTE;
-type SwatchEntry = {
- token: ColdarkToken;
- hex: string;
- variant?: VariantKey;
-};
-
type Props = {
- color: ColdarkToken | ColdarkToken[];
- variant?: VariantKey;
+ hex: string | string[];
decorative?: boolean;
};
-const { color, variant, decorative = false } = Astro.props;
-const tokens = Array.isArray(color) ? color : [color];
-const swatches: SwatchEntry[] = tokens.flatMap((token) => {
- const entries = PALETTE[token];
- const filteredEntries =
- variant === undefined
- ? entries
- : entries.filter(
- (entry) => "variant" in entry && entry.variant === variant
- );
-
- return filteredEntries.map((entry) => ({ ...entry, token }));
-});
+const { hex, decorative = false } = Astro.props;
+const swatches = Array.isArray(hex) ? hex : [hex];
-const describeSwatch = ({ token, hex, variant }: SwatchEntry) =>
- variant ? `${token} ${variant} ${hex}` : `${token} ${hex}`;
+if (swatches.length === 0) {
+ throw new Error("The `Swatch` component could not resolve any colors.");
+}
const label =
swatches.length === 1
- ? `Color swatch: ${describeSwatch(swatches[0])}.`
- : `Color swatches: ${swatches.map(describeSwatch).join("; ")}.`;
+ ? `Color swatch: ${swatches[0]}.`
+ : `Color swatches: ${swatches.join("; ")}.`;
---
{
- swatches.map(({ hex }) => (
-
+ swatches.map((value) => (
+
))
}
diff --git a/website/src/components/Swatch.test.ts b/website/src/components/Swatch.test.ts
index eb6a4f3..22a4112 100644
--- a/website/src/components/Swatch.test.ts
+++ b/website/src/components/Swatch.test.ts
@@ -4,48 +4,42 @@ import { describe, expect, it } from "vitest";
import Swatch from "./Swatch.astro";
describe("Swatch", () => {
- it("renders an accessible label for a shared swatch", async () => {
+ it("renders an accessible label for a single hex color", async () => {
+ // eslint-disable-next-line no-magic-numbers -- Self-explanatory.
+ expect.assertions(3);
+
const container = await AstroContainer.create();
const result = await container.renderToString(Swatch, {
- props: { color: "coldark01" },
+ props: { hex: "#e3eaf2" },
});
expect(result).toContain('role="img"');
- expect(result).toContain('aria-label="Color swatch: coldark01 #e3eaf2."');
+ expect(result).toContain('aria-label="Color swatch: #e3eaf2."');
expect(result).toContain('style="--swatch: #e3eaf2;"');
});
- it("renders multiple swatches when color is an array", async () => {
+ it("renders multiple swatches when hex is an array", async () => {
+ // eslint-disable-next-line no-magic-numbers -- Self-explanatory.
+ expect.assertions(4);
+
const container = await AstroContainer.create();
const result = await container.renderToString(Swatch, {
- props: { color: ["coldark01", "coldark06"] },
+ props: { hex: ["#e3eaf2", "#111b27"] },
});
expect(result).toContain('role="img"');
- expect(result).toContain(
- 'aria-label="Color swatches: coldark01 #e3eaf2; coldark06 #111b27."'
- );
+ expect(result).toContain('aria-label="Color swatches: #e3eaf2; #111b27."');
expect(result).toContain('style="--swatch: #e3eaf2;"');
expect(result).toContain('style="--swatch: #111b27;"');
});
- it("renders only the requested variant for accent swatches", async () => {
- const container = await AstroContainer.create();
- const result = await container.renderToString(Swatch, {
- props: { color: "coldark13", variant: "dark" },
- });
-
- expect(result).toContain(
- 'aria-label="Color swatch: coldark13 dark #6cb8e6."'
- );
- expect(result).toContain('style="--swatch: #6cb8e6;"');
- expect(result).not.toContain("#005a8e");
- });
-
it("hides decorative swatches from assistive technology", async () => {
+ // eslint-disable-next-line no-magic-numbers -- Self-explanatory.
+ expect.assertions(4);
+
const container = await AstroContainer.create();
const result = await container.renderToString(Swatch, {
- props: { color: "coldark08", variant: "cold", decorative: true },
+ props: { hex: "#c22f2e", decorative: true },
});
expect(result).toContain('aria-hidden="true"');
@@ -53,4 +47,16 @@ describe("Swatch", () => {
expect(result).not.toContain("aria-label=");
expect(result).toContain('style="--swatch: #c22f2e;"');
});
+
+ it("throws when no hex values are provided", async () => {
+ expect.assertions(1);
+
+ const container = await AstroContainer.create();
+
+ await expect(
+ container.renderToString(Swatch, {
+ props: { hex: [] },
+ })
+ ).rejects.toThrow("The `Swatch` component could not resolve any colors.");
+ });
});
diff --git a/website/src/content/docs/colors.mdx b/website/src/content/docs/colors.mdx
index 410c503..c148dae 100644
--- a/website/src/content/docs/colors.mdx
+++ b/website/src/content/docs/colors.mdx
@@ -5,6 +5,8 @@ sidebar:
order: 3
---
+import ColdarkHex from "../../components/ColdarkHex.astro";
+
## Palette structure
Coldark uses three palettes:
@@ -22,36 +24,28 @@ Coldark uses three palettes:
-
- #f0f4f8 coldark00
+ coldark00
-
- #e3eaf2 coldark01
+ coldark01
-
- #d0dae7 coldark02
+ coldark02
-
- #8da1b9 coldark03
+ coldark03
-
- #3c526d coldark04
+ coldark04
-
- #213043 coldark05
+ coldark05
-
- #111b27 coldark06
+ coldark06
-
- #0b121b coldark07
+ coldark07
@@ -59,36 +53,28 @@ Coldark uses three palettes:
Coldark Cold accents
-
- #c22f2e coldark08
+ coldark08
-
- #a04900 coldark09
+ coldark09
-
- #755f00 coldark10
+ coldark10
-
- #116b00 coldark11
+ coldark11
-
- #006d6d coldark12
+ coldark12
-
- #005a8e coldark13
+ coldark13
-
- #7c00aa coldark14
+ coldark14
-
- #af00af coldark15
+ coldark15
@@ -96,36 +82,28 @@ Coldark uses three palettes:
Coldark Dark accents
-
- #cd6660 coldark08
+ coldark08
-
- #e9ae7e coldark09
+ coldark09
-
- #e6d37a coldark10
+ coldark10
-
- #91d076 coldark11
+ coldark11
-
- #66cccc coldark12
+ coldark12
-
- #6cb8e6 coldark13
+ coldark13
-
- #c699e3 coldark14
+ coldark14
-
- #f4adf4 coldark15
+ coldark15
@@ -135,27 +113,27 @@ Coldark uses three palettes:
| Token | Hex | Role |
| ----------- | --------- | ---------------------------------------------------------------------- |
-| `coldark00` | `#f0f4f8` | Lightest background for elevated panels, widgets, and active surfaces. |
-| `coldark01` | `#e3eaf2` | Soft bright surface and bright foreground support. |
-| `coldark02` | `#d0dae7` | Secondary surface and light foreground support. |
-| `coldark03` | `#8da1b9` | Selections, borders, and muted emphasis. |
-| `coldark04` | `#3c526d` | Comments, placeholders, and subdued text. |
-| `coldark05` | `#213043` | Strong surface for widgets, highlights, and embedded panels. |
-| `coldark06` | `#111b27` | Main dark foreground or background, depending on the variant. |
-| `coldark07` | `#0b121b` | Deepest structural background for heavy UI chrome. |
+| `coldark00` | | Lightest background for elevated panels, widgets, and active surfaces. |
+| `coldark01` | | Soft bright surface and bright foreground support. |
+| `coldark02` | | Secondary surface and light foreground support. |
+| `coldark03` | | Selections, borders, and muted emphasis. |
+| `coldark04` | | Comments, placeholders, and subdued text. |
+| `coldark05` | | Strong surface for widgets, highlights, and embedded panels. |
+| `coldark06` | | Main dark foreground or background, depending on the variant. |
+| `coldark07` | | Deepest structural background for heavy UI chrome. |
## Accent slots
| Token | Coldark Cold | Coldark Dark | Role |
| ----------- | ------------ | ------------ | ------------------------------------------------------------------- |
-| `coldark08` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items. |
-| `coldark09` | `#a04900` | `#e9ae7e` | Orange for warnings, keywords, storage, and pseudo-elements. |
-| `coldark10` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, booleans, and attribute names. |
-| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, and link text. |
-| `coldark12` | `#006d6d` | `#66cccc` | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
-| `coldark13` | `#005a8e` | `#6cb8e6` | Blue for buttons, badges, info, classes, variables, and headings. |
-| `coldark14` | `#7c00aa` | `#c699e3` | Purple for functions and CSS classes or IDs. |
-| `coldark15` | `#af00af` | `#f4adf4` | Magenta for untracked states, regex, escapes, and CSS values. |
+| `coldark08` | | | Red for errors, deletions, invalid states, and deprecated items. |
+| `coldark09` | | | Orange for warnings, keywords, storage, and pseudo-elements. |
+| `coldark10` | | | Yellow for modified states, hints, booleans, and attribute names. |
+| `coldark11` | | | Green for additions, strings, CSS colors, and link text. |
+| `coldark12` | | | Cyan for parameters, tags, CSS variables, and embedded punctuation. |
+| `coldark13` | | | Blue for buttons, badges, info, classes, variables, and headings. |
+| `coldark14` | | | Purple for functions and CSS classes or IDs. |
+| `coldark15` | | | Magenta for untracked states, regex, escapes, and CSS values. |
## Source of truth
diff --git a/website/src/content/docs/ports/coldark-bat.mdx b/website/src/content/docs/ports/coldark-bat.mdx
index 74a75a4..2634e7d 100644
--- a/website/src/content/docs/ports/coldark-bat.mdx
+++ b/website/src/content/docs/ports/coldark-bat.mdx
@@ -4,7 +4,7 @@ description: Coldark syntax highlighting themes for bat.
---
import { Steps } from "@astrojs/starlight/components";
-import Swatch from "../../../components/Swatch.astro";
+import ColdarkHex from "../../../components/ColdarkHex.astro";
Coldark is also available for bat, a modern alternative to `cat` with syntax highlighting.
@@ -67,16 +67,16 @@ The bat port reuses [Coldark colors](/coldark/colors/) to provide a consistent s
| Coldark Cold | Coldark Dark | Role |
| :----------: | :----------: | ------------ |
-| `#e3eaf2` | `#111b27` | Main background |
-| `#d0dae7` | `#213043` | Line highlight and selection surfaces |
-| `#d0dae7` | `#0b121b` | Gutter background |
-| `#111b27` | `#e3eaf2` | Primary foreground, caret, and punctuation |
-| `#3c526d` | `#8da1b9` | Comments, invisibles, and gutter text |
-| `#005a8e` | `#6cb8e6` | Types, namespaces, variables, headings, and find highlights |
-| `#006d6d` | `#66cccc` | Tags, parameters, object keys, raw markup, and shebang punctuation |
-| `#116b00` | `#91d076` | Strings, inserted text, color literals, and Markdown link labels |
-| `#755f00` | `#e6d37a` | Numbers, language constants, attribute names, changed text, and links |
-| `#af00af` | `#f4adf4` | Regex, escapes, modifiers, list markers, and support symbols |
-| `#7c00aa` | `#c699e3` | Functions, call sites, and CSS class or ID selectors |
-| `#a04900` | `#e9ae7e` | Keywords, storage types, and pseudo-classes or pseudo-elements |
-| `#c22f2e` | `#cd6660` | Invalid tokens and deleted markup |
+| | | Main background |
+| | | Line highlight and selection surfaces |
+| | | Gutter background |
+| | | Primary foreground, caret, and punctuation |
+| | | Comments, invisibles, and gutter text |
+| | | Types, namespaces, variables, headings, and find highlights |
+| | | Tags, parameters, object keys, raw markup, and shebang punctuation |
+| | | Strings, inserted text, color literals, and Markdown link labels |
+| | | Numbers, language constants, attribute names, changed text, and links |
+| | | Regex, escapes, modifiers, list markers, and support symbols |
+| | | Functions, call sites, and CSS class or ID selectors |
+| | | Keywords, storage types, and pseudo-classes or pseudo-elements |
+| | | Invalid tokens and deleted markup |
diff --git a/website/src/styles/custom/palettes.css b/website/src/styles/custom/palettes.css
index 5227932..7c84f4f 100644
--- a/website/src/styles/custom/palettes.css
+++ b/website/src/styles/custom/palettes.css
@@ -9,13 +9,7 @@
padding: 1rem;
border: 1px solid var(--sl-color-hairline-light);
border-radius: 0.5rem;
- background:
- linear-gradient(
- 180deg,
- color-mix(in srgb, var(--coldark13) 8%, transparent),
- transparent 45%
- ),
- var(--sl-color-bg-nav);
+ background: var(--coldark05);
box-shadow: var(--sl-shadow-sm);
}
@@ -51,12 +45,3 @@
.swatch-list p {
margin: 0;
}
-
-.swatch {
- width: 1.2rem;
- height: 1.2rem;
- border-radius: 999px;
- background: var(--swatch);
- box-shadow: inset 0 0 0 1px
- color-mix(in srgb, var(--coldark07) 18%, transparent);
-}
diff --git a/website/src/utils/palette.test.ts b/website/src/utils/palette.test.ts
new file mode 100644
index 0000000..63660cd
--- /dev/null
+++ b/website/src/utils/palette.test.ts
@@ -0,0 +1,26 @@
+import { describe, expect, it } from "vitest";
+
+import { getPaletteHex } from "./palette";
+
+describe("getPaletteHex", () => {
+ it("returns the shared hex for common shades", () => {
+ expect(getPaletteHex("coldark01")).toBe("#e3eaf2");
+ });
+
+ it("returns the requested variant for accent shades", () => {
+ expect(getPaletteHex("coldark13", "cold")).toBe("#005a8e");
+ expect(getPaletteHex("coldark13", "dark")).toBe("#6cb8e6");
+ });
+
+ it("throws when a variant is missing for a multi-variant token", () => {
+ expect(() => getPaletteHex("coldark13")).toThrow(
+ 'Multiple hex values found for "coldark13". Pass a variant to select one.'
+ );
+ });
+
+ it("throws when a shared token is requested with a variant", () => {
+ expect(() => getPaletteHex("coldark01", "cold")).toThrow(
+ 'No hex value found for "coldark01" (cold).'
+ );
+ });
+});
diff --git a/website/src/utils/palette.ts b/website/src/utils/palette.ts
new file mode 100644
index 0000000..ff3e942
--- /dev/null
+++ b/website/src/utils/palette.ts
@@ -0,0 +1,28 @@
+import type { VariantKey } from "../types/tokens";
+import { PALETTE } from "./constants";
+
+export type ColdarkToken = keyof typeof PALETTE;
+
+export const getPaletteHex = (token: ColdarkToken, variant?: VariantKey) => {
+ const entries = PALETTE[token];
+
+ if (variant === undefined) {
+ if (entries.length === 1) {
+ return entries[0].hex;
+ }
+
+ throw new Error(
+ `Multiple hex values found for "${token}". Pass a variant to select one.`
+ );
+ }
+
+ const entry = entries.find(
+ (candidate) => "variant" in candidate && candidate.variant === variant
+ );
+
+ if (!entry) {
+ throw new Error(`No hex value found for "${token}" (${variant}).`);
+ }
+
+ return entry.hex;
+};
From 42454bc96d88dad53f5eced8bf6d4b8ffb9b48ee Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 7 Apr 2026 23:13:46 +0200
Subject: [PATCH 21/23] fix: small adjustements
---
website/src/content/docs/index.mdx | 8 ++------
website/src/styles/tokens/colors.css | 1 +
2 files changed, 3 insertions(+), 6 deletions(-)
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 9b4a452..6fd2dfd 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -12,16 +12,12 @@ hero:
- text: Discover Coldark
link: /coldark/about/
icon: right-arrow
- - text: Explore the colors
+ - text: Colors
link: /coldark/colors/
icon: right-arrow
- - text: Browse ports
+ - text: Ports
link: /coldark/ports/coldark-vscode/
icon: right-arrow
- - text: View on GitHub
- link: https://github.com/ArmandPhilippot/coldark
- icon: external
- variant: minimal
---
import { Card, CardGrid } from "@astrojs/starlight/components";
diff --git a/website/src/styles/tokens/colors.css b/website/src/styles/tokens/colors.css
index 722287c..5598123 100644
--- a/website/src/styles/tokens/colors.css
+++ b/website/src/styles/tokens/colors.css
@@ -66,6 +66,7 @@
--sl-color-bg-nav: var(--coldark07);
--sl-color-bg-sidebar: var(--sl-color-bg);
--sl-color-hairline-shade: var(--sl-color-gray-6);
+ --sl-color-text: var(--sl-color-white);
--sl-color-text-invert: var(--sl-color-black);
}
From 7c9a2067343d509087ff14605ad21085a4181c49 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Tue, 7 Apr 2026 23:30:29 +0200
Subject: [PATCH 22/23] feat: add an overview page for ports
---
website/src/content/docs/index.mdx | 2 +-
website/src/content/docs/ports/index.mdx | 49 ++++++++++++++++++++++++
2 files changed, 50 insertions(+), 1 deletion(-)
create mode 100644 website/src/content/docs/ports/index.mdx
diff --git a/website/src/content/docs/index.mdx b/website/src/content/docs/index.mdx
index 6fd2dfd..b4944d5 100644
--- a/website/src/content/docs/index.mdx
+++ b/website/src/content/docs/index.mdx
@@ -16,7 +16,7 @@ hero:
link: /coldark/colors/
icon: right-arrow
- text: Ports
- link: /coldark/ports/coldark-vscode/
+ link: /coldark/ports/
icon: right-arrow
---
diff --git a/website/src/content/docs/ports/index.mdx b/website/src/content/docs/ports/index.mdx
new file mode 100644
index 0000000..bc4527f
--- /dev/null
+++ b/website/src/content/docs/ports/index.mdx
@@ -0,0 +1,49 @@
+---
+title: Ports
+description: Overview of available Coldark ports.
+sidebar:
+ label: Overview
+---
+
+import { CardGrid, LinkCard } from "@astrojs/starlight/components";
+
+Coldark is available across editors, terminals, browsers, and web tooling. Use
+this page to jump to the port that matches your environment.
+
+
+
+
+
+
+
+
+
+
From 3dfb2c3bbd8b8f99487faf2cc0129a8be9468598 Mon Sep 17 00:00:00 2001
From: Armand Philippot
Date: Wed, 8 Apr 2026 22:25:45 +0200
Subject: [PATCH 23/23] fix: convert ports to MDX and use Steps/ColdarkHex
components
---
...ark-dircolors.md => coldark-dircolors.mdx} | 0
.../src/content/docs/ports/coldark-firefox.md | 41 ------------
.../content/docs/ports/coldark-firefox.mdx | 60 +++++++++++++++++
...ourceview.md => coldark-gtksourceview.mdx} | 10 ++-
.../src/content/docs/ports/coldark-prism.md | 62 -----------------
.../src/content/docs/ports/coldark-prism.mdx | 67 +++++++++++++++++++
.../{coldark-vscode.md => coldark-vscode.mdx} | 34 +++++-----
...terminal.md => coldark-xfce4-terminal.mdx} | 6 ++
8 files changed, 159 insertions(+), 121 deletions(-)
rename website/src/content/docs/ports/{coldark-dircolors.md => coldark-dircolors.mdx} (100%)
delete mode 100644 website/src/content/docs/ports/coldark-firefox.md
create mode 100644 website/src/content/docs/ports/coldark-firefox.mdx
rename website/src/content/docs/ports/{coldark-gtksourceview.md => coldark-gtksourceview.mdx} (93%)
delete mode 100644 website/src/content/docs/ports/coldark-prism.md
create mode 100644 website/src/content/docs/ports/coldark-prism.mdx
rename website/src/content/docs/ports/{coldark-vscode.md => coldark-vscode.mdx} (53%)
rename website/src/content/docs/ports/{coldark-xfce4-terminal.md => coldark-xfce4-terminal.mdx} (94%)
diff --git a/website/src/content/docs/ports/coldark-dircolors.md b/website/src/content/docs/ports/coldark-dircolors.mdx
similarity index 100%
rename from website/src/content/docs/ports/coldark-dircolors.md
rename to website/src/content/docs/ports/coldark-dircolors.mdx
diff --git a/website/src/content/docs/ports/coldark-firefox.md b/website/src/content/docs/ports/coldark-firefox.md
deleted file mode 100644
index e6bdae0..0000000
--- a/website/src/content/docs/ports/coldark-firefox.md
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: Firefox
-description: Coldark for Firefox, with automatic dark preference detection and manual switching.
----
-
-Coldark for Firefox adapts the palette to browser chrome and focuses on the parts of Firefox that are themeable today.
-
-## Highlights
-
-- Detects the user's preferred dark mode and applies the matching variant automatically.
-- Lets users switch between variants from a toolbar icon.
-- Supports a keyboard shortcut to toggle the theme.
-
-## Palette scope
-
-Firefox only exposes a smaller theming surface than editors like VS Code, so this port uses a reduced subset of the full Coldark palette. It focuses on frames, toolbars, selected tabs, fields, icons, and highlight states.
-
-## Colors
-
-| Token | Coldark Cold | Coldark Dark | Role |
-| --- | --- | --- | --- |
-| `coldark00` | `#f0f4f8` | `#f0f4f8` | Popup, focused field, and elevated button background in Coldark Cold |
-| `coldark01` | `#e3eaf2` | `#e3eaf2` | Bright frame/background support in Coldark Cold and default selected-tab foreground in Coldark Dark |
-| `coldark02` | `#d0dae7` | `#d0dae7` | Supporting foreground in Coldark Dark |
-| `coldark03` | `#8da1b9` | `#8da1b9` | Unused by the current Firefox package |
-| `coldark04` | `#3c526d` | `#3c526d` | Popup, focused field, and button-state background in Coldark Dark |
-| `coldark05` | `#213043` | `#213043` | Selected tab, toolbar, and sidebar background in Coldark Dark |
-| `coldark06` | `#111b27` | `#111b27` | Main foreground in Coldark Cold and main frame background in Coldark Dark |
-| `coldark07` | `#0b121b` | `#0b121b` | Inactive frame, highlight, and border background in Coldark Dark |
-| `coldark13` | `#005a8e` | `#6cb8e6` | Blue accent for special icons, focus border, selected tab border, tab loading, and field highlight |
-
-## Installation
-
-1. Download the latest `.xpi` from the `web-ext-artifacts` directory in this package.
-2. Open `about:addons` in Firefox.
-3. Use the add-ons gear menu and choose **Install Add-on From File...**
-4. Select the downloaded Coldark package.
-
-## Notes
-
-Some browser surfaces, such as a few hover states or parts of the new tab page, are not fully customizable in Firefox themes.
diff --git a/website/src/content/docs/ports/coldark-firefox.mdx b/website/src/content/docs/ports/coldark-firefox.mdx
new file mode 100644
index 0000000..ef8be35
--- /dev/null
+++ b/website/src/content/docs/ports/coldark-firefox.mdx
@@ -0,0 +1,60 @@
+---
+title: Firefox
+description: Coldark for Firefox, with automatic dark preference detection and manual switching.
+---
+
+import { Steps } from "@astrojs/starlight/components";
+import ColdarkHex from "../../../components/ColdarkHex.astro";
+
+Coldark is also available for Firefox's browser chrome, with automatic dark preference detection and manual switching.
+
+## Features
+
+In addition to the color schemes, the extension also provides the following features:
+
+- Detects the user's preferred dark mode and applies the matching variant automatically.
+- Lets users switch between variants from a toolbar icon.
+- Supports a keyboard shortcut to toggle the theme.
+
+## Installation
+
+
+1. Download the latest `.xpi` from the `web-ext-artifacts` directory in this package.
+2. Open `about:addons` in Firefox.
+3. Use the add-ons gear menu and choose **Install Add-on From File...**
+4. Select the downloaded Coldark package.
+
+
+## Colors
+
+The Firefox port of Coldark reuses [Coldark colors](/coldark/colors/) to provide a consistent experience across applications despite the different theming capabilities.
+
+Firefox only exposes a smaller theming surface than editors like VS Code, so this port uses a reduced subset of the full Coldark palette.
+
+### Coldark Cold
+
+| Token | Preview | Role |
+| --- | --- | --- |
+| `coldark00` | | Popup and focused toolbar field background, plus translucent hover and pressed button backgrounds |
+| `coldark01` | | Frame, new tab page, and default toolbar field background |
+| `coldark02` | | Toolbar, selected tab, sidebar, and inactive frame background |
+| `coldark03` | | Popup and sidebar borders, toolbar separators, and translucent popup or sidebar row highlights |
+| `coldark04` | | Toolbar icons plus popup, sidebar, new tab page, and toolbar field text |
+| `coldark05` | | Not used directly |
+| `coldark06` | | Selected tab, toolbar, and bookmark or find bar text |
+| `coldark07` | | Not used directly |
+| `coldark13` | | Attention icons, selected tab line, tab loading indicator, focused field border, and translucent toolbar field highlight |
+
+### Coldark Dark
+
+| Token | Preview | Role |
+| --- | --- | --- |
+| `coldark00` | | Not used directly |
+| `coldark01` | | Selected tab, toolbar, bookmark or find bar, and focused toolbar field text |
+| `coldark02` | | Toolbar icons plus inactive tab, new tab page, popup, sidebar, and unfocused toolbar field text |
+| `coldark03` | | Not used directly |
+| `coldark04` | | Toolbar, selected tab, and sidebar background |
+| `coldark05` | | Popup and focused toolbar field background, plus translucent hover and pressed button backgrounds |
+| `coldark06` | | Frame, new tab page, and default toolbar field background |
+| `coldark07` | | Inactive frame, popup and sidebar borders, toolbar separators, and translucent popup or sidebar row highlights |
+| `coldark13` | | Attention icons, selected tab line, tab loading indicator, focused field border, and translucent toolbar field highlight |
diff --git a/website/src/content/docs/ports/coldark-gtksourceview.md b/website/src/content/docs/ports/coldark-gtksourceview.mdx
similarity index 93%
rename from website/src/content/docs/ports/coldark-gtksourceview.md
rename to website/src/content/docs/ports/coldark-gtksourceview.mdx
index 503d6aa..c4faf64 100644
--- a/website/src/content/docs/ports/coldark-gtksourceview.md
+++ b/website/src/content/docs/ports/coldark-gtksourceview.mdx
@@ -3,6 +3,8 @@ title: GTKSourceView
description: Coldark themes for GTKSourceView-based editors such as Mousepad and Gedit.
---
+import { Steps } from "@astrojs/starlight/components";
+
This port adapts Coldark to GTKSourceView and targets editors such as Mousepad and Gedit.
## Highlights
@@ -25,17 +27,21 @@ This theme uses the common shades `#f0f4f8`, `#e3eaf2`, `#d0dae7`, `#8da1b9`, `#
## Installation
-For Mousepad:
+### Mousepad
+
1. Create `~/.local/share/gtksourceview-4/styles/` if needed.
2. Copy the Coldark XML styles into that directory.
3. Reopen Mousepad and select the theme from the color scheme menu.
+
-For Gedit:
+### Gedit
+
1. Create `~/.local/share/gedit/styles/` if needed.
2. Copy the Coldark XML styles into that directory.
3. Reopen Gedit and select the scheme in **Preferences**.
+
## Notes
diff --git a/website/src/content/docs/ports/coldark-prism.md b/website/src/content/docs/ports/coldark-prism.md
deleted file mode 100644
index 985bff4..0000000
--- a/website/src/content/docs/ports/coldark-prism.md
+++ /dev/null
@@ -1,62 +0,0 @@
----
-title: Prism
-description: Coldark syntax highlighting for Prism.js.
----
-
-Coldark Prism brings the same blue-grey language to Prism.js with a cold and a dark stylesheet.
-
-## Highlights
-
-- Built for [Prism.js](https://prismjs.com/).
-- Offers both `prism-coldark-cold.css` and `prism-coldark-dark.css`.
-- Stays visually close to the VS Code port while adapting to Prism's token set.
-
-## Colors
-
-Prism uses a syntax-focused subset of the Coldark palettes. It keeps the main foreground, comment, and accent colors, while skipping many interface-specific colors that only exist in editors.
-
-### Coldark Cold
-
-| Hex | Typical role |
-| --- | --- |
-| `#e3eaf2` | Background contrast and bright text support |
-| `#d0dae7` | Secondary surfaces |
-| `#111b27` | Main code foreground |
-| `#8da1b9` | Secondary emphasis and soft highlights |
-| `#3c526d` | Comments |
-| `#005a8e` | Names, classes, and strong accents |
-| `#006d6d` | Tags and embedded punctuation |
-| `#116b00` | Strings |
-| `#755f00` | Numbers and booleans |
-| `#af00af` | Regex, escapes, and special values |
-| `#7c00aa` | Functions and selectors |
-| `#a04900` | Keywords |
-| `#c22f2e` | Errors and invalid tokens |
-
-### Coldark Dark
-
-| Hex | Typical role |
-| --- | --- |
-| `#111b27` | Background |
-| `#0b121b` | Deeper surface contrast |
-| `#e3eaf2` | Main code foreground |
-| `#8da1b9` | Comments and subdued text |
-| `#3c526d` | Secondary surfaces and soft highlights |
-| `#6cb8e6` | Names, classes, and strong accents |
-| `#66cccc` | Tags and embedded punctuation |
-| `#91d076` | Strings |
-| `#e6d37a` | Numbers and booleans |
-| `#f4adf4` | Regex, escapes, and special values |
-| `#c699e3` | Functions and selectors |
-| `#e9ae7e` | Keywords |
-| `#cd6660` | Errors and invalid tokens |
-
-## Installation
-
-1. Download Prism from the [official website](https://prismjs.com/) with the languages and plugins you need.
-2. Copy `prism-coldark-cold.css` and/or `prism-coldark-dark.css` from this package into your project.
-3. Include the Prism JavaScript file and the selected Coldark stylesheet in your page.
-
-## Notes
-
-The Prism token model is less comprehensive than VS Code's, so some mappings are necessarily approximate.
diff --git a/website/src/content/docs/ports/coldark-prism.mdx b/website/src/content/docs/ports/coldark-prism.mdx
new file mode 100644
index 0000000..12786fd
--- /dev/null
+++ b/website/src/content/docs/ports/coldark-prism.mdx
@@ -0,0 +1,67 @@
+---
+title: Prism
+description: Coldark syntax highlighting for Prism.js.
+---
+
+import { Steps } from "@astrojs/starlight/components";
+import ColdarkHex from "../../../components/ColdarkHex.astro";
+
+Coldark Prism brings the same blue-grey language to Prism.js with a cold and a dark stylesheet.
+
+## Highlights
+
+- Built for [Prism.js](https://prismjs.com/).
+- Offers both `prism-coldark-cold.css` and `prism-coldark-dark.css`.
+- Stays visually close to the VS Code port while adapting to Prism's token set.
+
+## Colors
+
+Prism uses a syntax-focused subset of the Coldark palettes. It keeps the main foreground, comment, and accent colors, while skipping many interface-specific colors that only exist in editors.
+
+### Coldark Cold
+
+| Hex | Typical role |
+| --- | --- |
+| | Background contrast and bright text support |
+| | Secondary surfaces |
+| | Main code foreground |
+| | Secondary emphasis and soft highlights |
+| | Comments |
+| | Names, classes, and strong accents |
+| | Tags and embedded punctuation |
+| | Strings |
+| | Numbers and booleans |
+| | Regex, escapes, and special values |
+| | Functions and selectors |
+| | Keywords |
+| | Errors and invalid tokens |
+
+### Coldark Dark
+
+| Hex | Typical role |
+| --- | --- |
+| | Background |
+| | Deeper surface contrast |
+| | Main code foreground |
+| | Comments and subdued text |
+| | Secondary surfaces and soft highlights |
+| | Names, classes, and strong accents |
+| | Tags and embedded punctuation |
+| | Strings |
+| | Numbers and booleans |
+| | Regex, escapes, and special values |
+| | Functions and selectors |
+| | Keywords |
+| | Errors and invalid tokens |
+
+## Installation
+
+
+1. Download Prism from the [official website](https://prismjs.com/) with the languages and plugins you need.
+2. Copy `prism-coldark-cold.css` and/or `prism-coldark-dark.css` from this package into your project.
+3. Include the Prism JavaScript file and the selected Coldark stylesheet in your page.
+
+
+## Notes
+
+The Prism token model is less comprehensive than VS Code's, so some mappings are necessarily approximate.
diff --git a/website/src/content/docs/ports/coldark-vscode.md b/website/src/content/docs/ports/coldark-vscode.mdx
similarity index 53%
rename from website/src/content/docs/ports/coldark-vscode.md
rename to website/src/content/docs/ports/coldark-vscode.mdx
index ba08953..2269de8 100644
--- a/website/src/content/docs/ports/coldark-vscode.md
+++ b/website/src/content/docs/ports/coldark-vscode.mdx
@@ -3,6 +3,8 @@ title: VS Code
description: The reference Coldark implementation for Visual Studio Code.
---
+import ColdarkHex from "../../../components/ColdarkHex.astro";
+
Coldark for VS Code is the reference implementation of the theme. It defines the shared semantic palette used across the rest of the project and ships both **Coldark Cold** and **Coldark Dark**.
## Highlights
@@ -24,27 +26,27 @@ This package is the reference implementation for Coldark. The main [Colors](../.
| Token | Hex | Role |
| --- | --- | --- |
-| `coldark00` | `#f0f4f8` | Lightest surface for active tabs, widgets, and elevated panels |
-| `coldark01` | `#e3eaf2` | Bright surface in Coldark Cold and default foreground in Coldark Dark |
-| `coldark02` | `#d0dae7` | Secondary surface and supporting foreground |
-| `coldark03` | `#8da1b9` | Selection background, borders, comments, and muted emphasis |
-| `coldark04` | `#3c526d` | Subdued text and softer highlights |
-| `coldark05` | `#213043` | Strong surface for widgets, line highlight, and embedded panels |
-| `coldark06` | `#111b27` | Main dark foreground in Coldark Cold and main editor background in Coldark Dark |
-| `coldark07` | `#0b121b` | Deep background for activity bar, gutters, borders, and heavy chrome |
+| `coldark00` | | Lightest surface for active tabs, widgets, and elevated panels |
+| `coldark01` | | Bright surface in Coldark Cold and default foreground in Coldark Dark |
+| `coldark02` | | Secondary surface and supporting foreground |
+| `coldark03` | | Selection background, borders, comments, and muted emphasis |
+| `coldark04` | | Subdued text and softer highlights |
+| `coldark05` | | Strong surface for widgets, line highlight, and embedded panels |
+| `coldark06` | | Main dark foreground in Coldark Cold and main editor background in Coldark Dark |
+| `coldark07` | | Deep background for activity bar, gutters, borders, and heavy chrome |
### Accent slots
| Token | Coldark Cold | Coldark Dark | Role |
| --- | --- | --- | --- |
-| `coldark08` | `#c22f2e` | `#cd6660` | Red for errors, deletions, invalid states, and deprecated items |
-| `coldark09` | `#a04900` | `#e9ae7e` | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
-| `coldark10` | `#755f00` | `#e6d37a` | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
-| `coldark11` | `#116b00` | `#91d076` | Green for additions, strings, CSS colors, CSS font names, and link text |
-| `coldark12` | `#006d6d` | `#66cccc` | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
-| `coldark13` | `#005a8e` | `#6cb8e6` | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
-| `coldark14` | `#7c00aa` | `#c699e3` | Purple for unverified states, functions, and CSS classes or IDs |
-| `coldark15` | `#af00af` | `#f4adf4` | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
+| `coldark08` | | | Red for errors, deletions, invalid states, and deprecated items |
+| `coldark09` | | | Orange for warnings, debugging status bar, keywords, storage, and CSS pseudo-elements |
+| `coldark10` | | | Yellow for modified states, hints, integers, booleans, language constants, attribute names, shell case patterns, and link URLs |
+| `coldark11` | | | Green for additions, strings, CSS colors, CSS font names, and link text |
+| `coldark12` | | | Cyan for merge incoming content, parameters, tags, CSS variables, inline raw markup, and embedded section punctuation |
+| `coldark13` | | | Blue for badges, buttons, find match, info states, merge current content, selection outside editor, open-folder status bar, namespaces, classes, variables, other constants, headings, and property names |
+| `coldark14` | | | Purple for unverified states, functions, and CSS classes or IDs |
+| `coldark15` | | | Magenta for untracked states, token expression values, regex, escapes, character constants, storage modifiers, instances, list punctuation, and CSS values |
## Implementation notes
diff --git a/website/src/content/docs/ports/coldark-xfce4-terminal.md b/website/src/content/docs/ports/coldark-xfce4-terminal.mdx
similarity index 94%
rename from website/src/content/docs/ports/coldark-xfce4-terminal.md
rename to website/src/content/docs/ports/coldark-xfce4-terminal.mdx
index 42b9e06..50c5fbf 100644
--- a/website/src/content/docs/ports/coldark-xfce4-terminal.md
+++ b/website/src/content/docs/ports/coldark-xfce4-terminal.mdx
@@ -3,6 +3,8 @@ title: XFCE4 Terminal
description: Coldark terminal presets for XFCE4 Terminal.
---
+import { Steps } from "@astrojs/starlight/components";
+
Coldark for XFCE4 Terminal brings the palette to terminal surfaces with dedicated presets for both main variants.
## Highlights
@@ -25,12 +27,16 @@ This preset uses `#111b27`, `#e3eaf2`, `#f0f4f8`, `#8da1b9`, and `#3c526d` for t
## Installation
+
1. Create `~/.local/share/xfce4/terminal/colorschemes/` if needed.
2. Copy `coldark-cold.theme` and/or `coldark-dark.theme` into that directory.
+
## Activation
+
1. Open XFCE4 Terminal.
2. Go to **Edit** > **Preferences**.
3. Open the **Colors** tab.
4. Load either **Coldark - Cold** or **Coldark - Dark** from the presets menu.
+