A cute gothic pastel theme inspired by Poku's visual identity.
💡 While Poku Test Runner makes testing easier, Poku's theme makes it easy to read your code.
It's not just about combining colors, but establishing consistency between different language syntaxes.
This is a monorepo to organize all the themes. For samples, compatible syntaxes, etc., see the package:
| Name | Package | |
|---|---|---|
 |
Visual Studio Code | ./packages/vscode |
- If your favorite editor isn't here, how about contributing? 🙌
This section describes the theme’s core color palette. It serves as a guide for developers who want to adapt the Poku Theme to other editors, variations or tools beyond VSCode.
| Purpose | HEX | 🎨 | Notes |
|---|---|---|---|
| Editor / Code | #2c313b |
 |
Primary background where the code is displayed. |
| Title Bar / Inactive Tabs | #22242c |
 |
Background for the window title bar and inactive tabs. |
| Sidebar / Explorer | #1b1f25 |
 |
Background for the sidebar and the file explorer. |
| Status Bar (normal) | #443ca7 |
 |
Bottom status bar (normal mode). |
| Status Bar (debugging) | #8b34be |
 |
Bottom status bar (debugging mode). |
| Purpose | HEX | 🎨 | Notes |
|---|---|---|---|
| Primary Text | #babcc4 |
 |
Main text color inside the editor. |
| Secondary Text | #96a3b6 |
 |
Used in the sidebar items, breadcrumb, etc. |
| Strings / Insertions | #98aec9 |
 |
Strings, template strings, inserted code blocks. |
| Comments | #596170 |
 |
Used for code comments, docblocks, etc. |
| Purpose | HEX | 🎨 | Notes |
|---|---|---|---|
| Logical Operators | #9294ff |
 |
Logical / comparison operators (&&, ==, etc.). |
| Keywords | #a29bfe |
 |
keyword and control resources (if, for, etc.) |
| Functions / Methods | #c5bfff |
 |
Function names, methods, etc. |
| Variables | #8dc0ff |
 |
Local/global variables, placeholders in strings. |
| Native properties and values | #38a2ff |
 |
Built-in properties (this, lenght, null, etc.). |
| Classes | #0fb9b1 |
 |
Classes, including JSX, Vue, Svelte, and Astro components. |
| Types | #0fb9b0d1 |
 |
Types, annotations, etc. (often italic). |
| Numbers / Units | #80cc8f |
 |
Numeric constants, CSS units, etc. (often bold). |
These colors appear throughout syntax highlighting, driving legibility and consistent emphasis.
| Purpose | HEX | 🎨 | Notes |
|---|---|---|---|
| Pink Accent / Decoration | #fd9fff |
 |
Used in special characters and other prominent decorations. |
| Errors / Invalid | #ff6e97 |
 |
Used for invalid or illegal syntaxes, lint errors, etc. |
| Search Highlight | #5100ffdc |
 |
Background for find match highlighting. |
| Active Links | #688eff |
 |
By focusing links in strings. |
These vibrant shades intensify the visual experience, highlighting errors, selections, links, etc.
| Purpose | HEX | 🎨 |
|---|---|---|
| Line Numbers (Inactive) | #51647d |
 |
| Line Numbers (Active) | #948ef9 |
 |
| Notifications (BG) | #ffd3ed |
 |
| Notifications (FG) | #821469 |
 |
| Diff Editor (Removed) | #e323902d |
 |
| Diff Editor (Inserted) | #45cf962d |
 |
Dark Poku's theme is defined by:
- Dark background with light text.
- Soft comments in a subtle blue-gray.
- Lavender/purple keywords.
- Strings / functions in bluish-lilac tones.
- Selections and errors highlighted in vibrant purple/pink.
- Occasional accents in magenta and bright blues.
Feel free to contribute improvements, new variations, languages and even editors.