vscode

Poku Theme ✨

A cute gothic pastel theme inspired by Poku's visual identity for Visual Studio Code.

💡 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.

---

💡 Some samples

---

🔬 Languages Tried

	Language / Syntax	Libraries, Frameworksa and derivatives
	HTML
	CSS	SCSS, Sass, and Less.
	JavaScript	ReactJS and React Native, Svelte, Vue, and Astro.
	TypeScript	Same as JavaScript.
	JSON	JSONC.
	SQL	MySQL, PostgreSQL, etc.
	Shell	Bash, Zsh, etc.
	Markdown	MDX.
	YAML
	Dart	Flutter.
	Java
	Kotlin
	PHP
	C
	C++
	Rust
	Go
	Python
	Ruby
	Scala
	Erlang
	Elixir

Although it probably works with most languages, these are the languages and frameworks manually checked.

I'd love your help with:

• ❗️ .NET, C#, and the one you like.

---

Main Color Palette 👨🏻‍🎨

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.

---

🌌 Dark Theme

1. Editor Backgrounds

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).

---

2. Editor Foregrounds

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.

---

3. Syntax Elements

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.

---

4. Accents / Specific Highlights

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.

---

5. Edtior Miscellaneous Colors

Purpose	HEX	🎨
Line Numbers (Inactive)	#51647d
Line Numbers (Active)	#948ef9
Notifications (BG)	#ffd3ed
Notifications (FG)	#821469
Diff Editor (Removed)	#e323902d
Diff Editor (Inserted)	#45cf962d

---

6. Theme Essence

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.