✨ Add Chrome theme integration support

Add comprehensive Chrome browser theming with SilkCircuit colors

- Add manifest.json with neon purple frame and electric cyan accents
- Create chrome-pages.css for styling internal Chrome pages
- Add devtools-theme.css for developer tools integration
- Add detailed README with installation methods and customization
- Update extras documentation with Chrome theme section
- Configure toolbar, tabs, and new tab page styling
- Support both developer mode and direct installation methods
- Include advanced theming for DevTools and internal pages

Provides complete browser integration with SilkCircuit color scheme
for consistent neon aesthetics across development environment.

Author: hyperb1iss

extras/README.md

@@ -66,6 +66,28 @@ cp extras/warp.yaml ~/.warp/themes/silkcircuit.yaml
 # Windows Terminal - import JSON manually in settings
 ```
 
+### 🌐 Chrome Theme (`chrome-theme/`)
+
+Bring SilkCircuit's vibrant colors to your browser:
+
+- **Neon purple** frame and toolbar
+- **Electric cyan** links and accents
+- **Pure magenta** highlights
+- **Dark theme** optimized for developer tools
+
+**Setup:**
+
+```bash
+# Method 1: Developer Mode
+# 1. Open chrome://extensions/
+# 2. Enable "Developer mode"
+# 3. Click "Load unpacked"
+# 4. Select the chrome-theme directory
+
+# Method 2: Direct drag & drop
+# Drag the chrome-theme folder onto chrome://extensions/
+```
+
 ### 🎨 Enhanced Tools
 
 Additional tool configurations for the complete experience:

extras/chrome-theme/Cached Theme.pak

@@ -0,0 +1,81 @@
+# SilkCircuit Chrome Theme
+
+A vibrant Chrome theme featuring neon purples, electric pinks, and glowing cyan accents to match your SilkCircuit Neovim experience.
+
+## Installation
+
+### Method 1: Developer Mode (Recommended)
+
+1. Open Chrome and navigate to `chrome://extensions/`
+2. Enable "Developer mode" in the top right
+3. Click "Load unpacked"
+4. Select the `silkcircuit-nvim/extras/chrome-theme` directory
+5. The theme will be applied immediately
+
+### Method 2: Direct Installation
+
+1. Open Chrome and navigate to `chrome://extensions/`
+2. Drag and drop the `chrome-theme` folder onto the page
+3. Click "Add theme" when prompted
+
+## Color Scheme
+
+The theme uses SilkCircuit's signature neon palette:
+
+- **Frame**: Deep purple background (#12101a)
+- **Toolbar**: Matching dark purple
+- **Tabs**: Light text on dark background
+- **Accents**: Electric purple tints
+- **Links**: Glowing cyan (#80ffea)
+- **Headers**: Pure magenta (#ff00ff)
+
+## Customization
+
+To modify the colors, edit `manifest.json`:
+
+- `frame`: Browser frame background
+- `toolbar`: Toolbar and bookmark bar
+- `tab_text`: Active tab text color
+- `ntp_background`: New tab page background
+- `ntp_link`: New tab page link colors
+
+## Compatibility
+
+- Chrome 88+
+- Chromium-based browsers (Edge, Brave, etc.)
+
+## Advanced Theming
+
+### DevTools Theme
+
+To theme Chrome DevTools with SilkCircuit colors:
+
+1. Install a DevTools theme extension like [DevTools Theme: Zero Dark Matrix](https://chrome.google.com/webstore/detail/devtools-theme-zero-dark/bomhdjeadceaggdgfoefmpeafkjhegbo)
+2. Open DevTools → Settings → Experiments
+3. Enable "Allow extensions to load custom stylesheets"
+4. Load the `devtools-theme.css` file through the extension
+
+### Chrome Internal Pages
+
+To theme Chrome's settings, extensions, and other internal pages:
+
+1. Install [Stylus](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) extension
+2. Click the Stylus icon → "Manage"
+3. Create new style → Import the `chrome-pages.css` file
+4. Add URL patterns:
+   - `chrome://*`
+   - `chrome-extension://*`
+
+### Complete Integration
+
+For the full SilkCircuit experience across Chrome:
+
+1. **Base theme**: Load via chrome://extensions/
+2. **DevTools**: Apply via DevTools theme extension
+3. **Internal pages**: Apply via Stylus or similar
+
+This gives you consistent neon aesthetics throughout your entire browser!
+
+## License
+
+MIT - Same as SilkCircuit Neovim theme

extras/chrome-theme/README.md

@@ -0,0 +1,156 @@
+/* SilkCircuit Chrome Internal Pages Theme
+ * Use with Stylus or similar extension to theme chrome:// pages
+ * Add URL patterns: chrome://*, chrome-extension://*
+ */
+
+@-moz-document regexp("chrome://.*"), regexp("chrome-extension://.*") {
+  :root {
+    /* Override Chrome's color variables */
+    --cr-primary-text-color: #f8f8f2 !important;
+    --cr-secondary-text-color: #9580ff !important;
+    --cr-card-background-color: #1a162a !important;
+    --cr-card-shadow-color-ambient: rgba(225, 53, 255, 0.1) !important;
+    --cr-card-shadow-color-key: rgba(225, 53, 255, 0.2) !important;
+    --cr-checked-color: #e135ff !important;
+    --cr-focused-item-color: rgba(225, 53, 255, 0.2) !important;
+    --cr-form-field-label-color: #80ffea !important;
+    --cr-link-color: #80ffea !important;
+    --cr-menu-background-color: #12101a !important;
+    --cr-menu-background-focus-color: #1a162a !important;
+    --cr-menu-shadow-color-ambient: rgba(225, 53, 255, 0.15) !important;
+    --cr-menu-shadow-color-key: rgba(225, 53, 255, 0.3) !important;
+    --cr-separator-color: rgba(225, 53, 255, 0.3) !important;
+    --cr-title-text-color: #ff00ff !important;
+    --cr-toolbar-background-color: #0a0812 !important;
+
+    /* Toggle/Switch colors */
+    --cr-toggle-color: #9580ff !important;
+    --cr-toggle-checked-bar-color: #e135ff !important;
+    --cr-toggle-checked-button-color: #ff00ff !important;
+    --cr-toggle-checked-ripple-color: rgba(255, 0, 255, 0.3) !important;
+
+    /* Button colors */
+    --cr-button-background-color: #1a162a !important;
+    --cr-button-border-color: #e135ff !important;
+    --cr-button-text-color: #f8f8f2 !important;
+    --cr-button-hover-background-color: #2a264a !important;
+
+    /* Input fields */
+    --cr-input-background-color: #1a162a !important;
+    --cr-input-border-color: #637777 !important;
+    --cr-input-border-color-focus: #e135ff !important;
+    --cr-input-border-color-hover: #80ffea !important;
+    --cr-input-error-color: #ff6363 !important;
+    --cr-input-focus-color: rgba(225, 53, 255, 0.3) !important;
+
+    /* Selection colors */
+    --cr-active-background-color: #e135ff !important;
+    --cr-focus-outline-color: #80ffea !important;
+    --cr-hover-background-color: rgba(225, 53, 255, 0.1) !important;
+    --cr-selected-background-color: rgba(225, 53, 255, 0.2) !important;
+  }
+
+  /* Background for all chrome pages */
+  body {
+    background-color: #12101a !important;
+    color: #f8f8f2 !important;
+  }
+
+  /* Settings page specific */
+  settings-ui::part(container) {
+    background-color: #12101a !important;
+  }
+
+  /* Extensions page */
+  extensions-manager {
+    --cr-toolbar-height: 56px;
+    background-color: #12101a !important;
+  }
+
+  /* Cards */
+  .cr-card,
+  extensions-item {
+    background-color: #1a162a !important;
+    border: 1px solid rgba(225, 53, 255, 0.2) !important;
+  }
+
+  /* Hover effects */
+  .cr-button:hover,
+  .cr-icon-button:hover,
+  .cr-link-button:hover {
+    background-color: rgba(225, 53, 255, 0.1) !important;
+  }
+
+  /* Downloads page */
+  downloads-manager {
+    background-color: #12101a !important;
+  }
+
+  downloads-item {
+    background-color: #1a162a !important;
+    border-bottom: 1px solid rgba(225, 53, 255, 0.2) !important;
+  }
+
+  /* History page */
+  history-app {
+    background-color: #12101a !important;
+  }
+
+  /* Bookmarks */
+  bookmarks-folder-node,
+  bookmarks-item {
+    background-color: #1a162a !important;
+  }
+
+  /* Search boxes */
+  cr-toolbar-search-field {
+    background-color: #1a162a !important;
+    border-color: #637777 !important;
+  }
+
+  cr-toolbar-search-field:focus-within {
+    border-color: #e135ff !important;
+  }
+
+  /* Scrollbars */
+  ::-webkit-scrollbar {
+    width: 12px;
+    height: 12px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: #0a0812 !important;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: #9580ff !important;
+    border-radius: 6px;
+  }
+
+  ::-webkit-scrollbar-thumb:hover {
+    background: #e135ff !important;
+  }
+
+  /* Selection */
+  ::selection {
+    background-color: #e135ff !important;
+    color: #12101a !important;
+  }
+
+  /* Links */
+  a {
+    color: #80ffea !important;
+  }
+
+  a:hover {
+    color: #5fffff !important;
+  }
+
+  /* Code blocks */
+  code,
+  pre {
+    background-color: #0a0812 !important;
+    color: #ff99ff !important;
+    border: 1px solid rgba(225, 53, 255, 0.3) !important;
+  }
+}