[Feature Request] Please Add "Material Gruvbox" (Dark Theme) - CSS Included

**Feature Description** I would like to request the addition of a **Material Gruvbox** color scheme option to the list of available Dark Themes within the Anupuchin "Style Settings" configuration. I have personally customized the Anupuchin theme to use the Material Gruvbox palette. Since Anupuchin already supports multiple preset color schemes, adding this would provide users with a popular, retro-inspired high-contrast option without needing manual snippet management. **Implementation Note:** I am not a developer, so my implementation currently works by applying the CSS snippet below **on top of the "Rose Pine" (or Rosebox)** preset in Style Settings. I used that as a base to ensure any un-styled variables (like borders or specific interactive elements) maintained a cohesive look. * *Note to Dev:* My snippet directly overrides the standard Obsidian variables (e.g., `--background-primary`, `--text-normal`). I noticed your `extended-colorschemes.css` typically uses internal mappings (like `--ctp-ext-rosewater`). You may need to adapt the RGB/Hex values below to fit your specific `ctp-ext` mapping system. **Code Snippets** *1. Material Gruvbox Color Scheme CSS:* ```css :root { /* DEFAULTS */ --dark0-hard-x: 29,32,33; --dark0-hard: rgb(var(--dark0-hard-x)); --dark0-x: 40,40,40; --dark0: rgb(var(--dark0-x)); --dark0-soft-x: 50,48,47; --dark0-soft: rgb(var(--dark0-soft-x)); --dark1-x: 60,56,54; --dark1: rgb(var(--dark1-x)); --dark2-x: 80,73,69; --dark2: rgb(var(--dark2-x)); --dark3-x: 102,92,84; --dark3: rgb(var(--dark3-x)); --dark4-x: 124,111,100; --dark4: rgb(var(--dark4-x)); --gray-x: 146,131,116; --gray: rgb(var(--gray-x)); --dark-text-x: 101,71,53; --dark-text: rgb(var(--dark-text-x)); --dark-text-faint-x: 179,126,93; --dark-text-faint: rgb(var(--dark-text-faint-x)); --dark-text-muted-x: 115,81,69; --dark-text-muted: rgb(var(--dark-text-muted-x)); --light0-hard-x: 249,245,215; --light0-hard: rgb(var(--light0-hard-x)); --light0-x: 251,241,199; --light0: rgb(var(--light0-x)); --light0-soft-x: 242,229,188; --light0-soft: rgb(var(--light0-soft-x)); --light1-x: 235,219,178; --light1: rgb(var(--light1-x)); --light2-x: 213,196,161; --light2: rgb(var(--light2-x)); --light3-x: 189,174,147; --light3: rgb(var(--light3-x)); --light4-x: 168,153,132; --light4: rgb(var(--light4-x)); --light-text-x: 212,190,152; --light-text: rgb(var(--light-text-x)); --neutral-red-x: 234,105,98; --neutral-red: rgb(var(--neutral-red-x)); --neutral-green-x: 169,182,101; --neutral-green: rgb(var(--neutral-green-x)); --neutral-yellow-x: 231,138,78; --neutral-yellow: rgb(var(--neutral-yellow-x)); --neutral-blue-x: 125,174,163; --neutral-blue: rgb(var(--neutral-blue-x)); --neutral-purple-x: 211,134,155; --neutral-purple: rgb(var(--neutral-purple-x)); --neutral-aqua-x: 137,180,130; --neutral-aqua: rgb(var(--neutral-aqua-x)); --faded-red-x: 193,74,74; --faded-red: rgb(var(--faded-red-x)); --faded-green-x: 108,120,46; --faded-green: rgb(var(--faded-green-x)); --faded-yellow-x: 195,94,10; --faded-yellow: rgb(var(--faded-yellow-x)); --faded-blue-x: 69,112,122; --faded-blue: rgb(var(--faded-blue-x)); --faded-purple-x: 148,94,128; --faded-purple: rgb(var(--faded-purple-x)); --faded-aqua-x: 76,122,93; --faded-aqua: rgb(var(--faded-aqua-x)); } body { --accent-h: 166; /* --neutral-blue #7daea3 */ --accent-s: 23%; --accent-l: 58%; --embed-border-left: 6px double var(--interactive-accent); } .theme-dark { --color-red-rgb: var(--neutral-red-x); --color-red: var(--neutral-red); --color-purple-rgb: var(--neutral-purple-x); --color-purple: var(--neutral-purple); --color-green-rgb: var(--neutral-green-x); --color-green: var(--neutral-green); --color-cyan-rgb: var(--neutral-blue-x); --color-cyan: var(--neutral-blue); --color-blue-rgb: var(--faded-blue-x); --color-blue: var(--faded-blue); --color-yellow-rgb: var(--neutral-yellow-x); --color-yellow: var(--neutral-yellow); --color-orange-rgb: var(--faded-yellow-x); --color-orange: var(--faded-yellow); --color-pink-rgb: var(--neutral-purple-x); --color-pink: var(--neutral-purple); --background-primary: var(--dark0); --background-primary-alt: var(--dark0-soft); --background-secondary: var(--dark0-hard); --background-secondary-alt: var(--dark1); --background-modifier-border: var(--dark1); --background-accent: var(--dark0-soft); --cursor-line-background: rgba(var(--dark1-x), 0.5); --text-normal: var(--light-text); --text-faint: var(--light1); --text-muted: var(--light2); --h1-color: var(--neutral-red); --h2-color: var(--neutral-yellow); --h3-color: var(--neutral-green); --h4-color: var(--neutral-aqua); --h5-color: var(--neutral-blue); --h6-color: var(--neutral-purple); --text-highlight-bg: var(--neutral-yellow); --text-highlight-fg: var(--dark0-hard); --text-accent: var(--neutral-yellow); --text-accent-hover: var(--faded-yellow); --tag-color: var(--neutral-aqua); --tag-background: var(--dark2); --tag-background-hover: var(--dark1); --inline-title-color: var(--neutral-yellow); --bold-color: var(--neutral-yellow); --italic-color: var(--neutral-yellow); --checkbox-color: var(--light4); --checkbox-color-hover: var(--light4); --checkbox-border-color: var(--light4); --checkbox-border-color-hover: var(--light4); --checklist-done-color: rgba(var(--light2-x), 0.5); --table-header-background: rgba(var(--dark0-x), 0.2); --table-header-background-hover: var(--dark2); --table-row-even-background: rgba(var(--dark2-x), 0.2); --table-row-odd-background: rgba(var(--dark2-x), 0.4); --table-row-background-hover: var(--dark2); --text-selection: rgba(var(--neutral-red-x), 0.6); --flashing-background: rgba(var(--neutral-red-x), 0.3); --code-normal: var(--neutral-blue); --code-background: var(--dark1); --mermaid-note: var(--neutral-blue); --mermaid-actor: var(--dark2); --mermaid-loopline: var(--neutral-blue); --icon-color-hover: var(--neutral-red); --icon-color-focused: var(--neutral-blue); --nav-item-color-hover: var(--neutral-red); --nav-item-color-active: var(--neutral-aqua); --nav-file-tag: rgba(var(--neutral-yellow-x), 0.9); --graph-line: var(--dark2); --graph-node: var(--light3); --graph-node-tag: var(--neutral-red); --graph-node-attachment: var(--neutral-green); --calendar-hover: var(--neutral-red); --calendar-background-hover: var(--dark1); --calendar-week: var(--neutral-orange); --calendar-today: var(--neutral-orange); --dataview-key: var(--text-faint); --dataview-key-background: rgba(var(--faded-red-x), 0.5); --dataview-value: var(--text-faint); --dataview-value-background: rgba(var(--neutral-green-x), 0.3); --tab-text-color-focused-active: var(--neutral-yellow); --tab-text-color-focused-active-current: var(--neutral-red); } ``` **Miscellaneous Features** I have also created a specific fix for the **Title Bar** to ensure it blends seamlessly with the Gruvbox background colors. *Title Bar Fix CSS:* ```css /* Force window control background to match main title bar */ body { /* Common variable for title bar backgrounds in AnuPpuccin layouts */ --titlebar-background-focused: var(--tab-container-background, var(--background-secondary)); --titlebar-background: var(--tab-container-background, var(--background-secondary)); } /* Target the specific container for the buttons */ .titlebar-button-container { background-color: var(--titlebar-background-focused); } /* Ensure buttons themselves are transparent */ .titlebar-button { background-color: transparent !important; } .titlebar-button:hover { background-color: rgba(var(--ctp-text), 0.075) !important; } ``` **Preview** <img width="1920" height="1032" alt="Image" src="https://github.com/user-attachments/assets/b54e7635-b57e-4369-b93a-855812abc5d2" />