Russian Hacker Theme
Tema oscuro para Visual Studio Code inspirado en la estética hacker rusa, disponible en cuatro variantes de color con el mismo efecto glass, la misma tipografía y los mismos colores de terminal.
Características
- Cuatro paletas intercambiables: púrpura/magenta, verde fósforo, azul noche y ámbar CRT
- Paleta oscura: fondos muy oscuros que reducen la fatiga visual
- Acentos vibrantes: magenta, verde neón, cian o naranja según la variante
- Terminal integrada: los 16 colores ANSI de cada variante, coherentes con el tema
- Alto contraste: cada paleta está verificada contra el fondo del editor
- Tipografía JetBrains Mono: fuente empaquetada (licencia OFL) para editor y terminal
- Efecto glass integrado: transparencia de ventana nativa (Windows/Linux) sin extensiones extra
Instalación
Desde el archivo VSIX
- Abre Visual Studio Code
- Ve a Extensiones (Ctrl+Shift+X)
- Selecciona los tres puntos (...) → Instalar desde VSIX...
- Selecciona
russianhacker-theme-0.0.1.vsix
Desde el código fuente
git clone https://github.com/MartinAlejandroOviedo/russianhacker-theme.git
cd russianhacker-theme
npm install
npm run compile
code .
Presiona F5 para abrir una ventana de VS Code con el tema en modo desarrollo.
Para generar el .vsix instalable:
npx vsce package
Activación
- Abre la paleta de comandos (
Ctrl+Shift+P)
- Escribe "Tema de color" y selecciona la opción
- Elige una de las variantes:
- Russian Hacker — púrpura profundo + magenta + verde neón
- Russian Hacker Green — verde fósforo, estilo matriz
- Russian Hacker Blue — azul noche + cian
- Russian Hacker Amber — ámbar/naranja, terminal vintage
También puedes fijarla en settings.json con cualquiera de esos nombres:
{
"workbench.colorTheme": "Russian Hacker Green"
}
Paletas disponibles
| Variante |
Fondo |
Texto |
Keywords |
Strings |
Constantes |
Comentarios |
Selección |
| Russian Hacker |
#0b0711 |
#e2ae84 |
#fa42ae |
#9fc08f |
#d67568 |
#a281cf |
#39145d |
| Russian Hacker Green |
#030a05 |
#c8ffd0 |
#00ff66 |
#7ee787 |
#ffd866 |
#569f68 |
#08301d |
| Russian Hacker Blue |
#04101f |
#cfe6ff |
#4d9fff |
#00d4c7 |
#ffb454 |
#7497b4 |
#072d50 |
| Russian Hacker Amber |
#120a03 |
#ffc066 |
#ff8c1a |
#d8c070 |
#ff5f5f |
#ab8d63 |
#462202 |
Contraste
Ratio de cada token contra cuatro superficies del editor: fondo, selección activa, selección inactiva y resaltado de selección. El mínimo de WCAG AA es 4.5:1.
| Variante |
Texto |
Comentarios |
Keywords |
Strings |
Constantes |
| Russian Hacker |
10.1 / 7.4 / 8.8 / 8.8 |
6.3 / 4.6 / 5.5 / 5.5 |
6.1 / 4.5 / 5.4 / 5.4 |
9.9 / 7.3 / 8.6 / 8.6 |
6.3 / 4.6 / 5.5 / 5.5 |
| Russian Hacker Green |
17.8 / 12.9 / 15.3 / 15.3 |
6.3 / 4.5 / 5.4 / 5.4 |
14.8 / 10.7 / 12.7 / 12.7 |
13.0 / 9.4 / 11.2 / 11.2 |
14.6 / 10.5 / 12.5 / 12.5 |
| Russian Hacker Blue |
14.9 / 10.9 / 13.2 / 13.2 |
6.2 / 4.6 / 5.5 / 5.5 |
7.0 / 5.2 / 6.2 / 6.2 |
10.2 / 7.5 / 9.0 / 9.0 |
10.8 / 7.9 / 9.6 / 9.6 |
| Russian Hacker Amber |
12.1 / 8.7 / 10.5 / 10.5 |
6.3 / 4.5 / 5.4 / 5.4 |
8.4 / 6.1 / 7.3 / 7.3 |
10.9 / 7.9 / 9.4 / 9.4 |
6.6 / 4.7 / 5.7 / 5.7 |
Las cuatro paletas cumplen AA en las 80 combinaciones comprobadas. Los colores de selección se eligieron con un barrido numérico sobre el hue de cada acento, buscando que el token más apagado (el comentario) siga legible sobre la selección sin volverla invisible contra el fondo.
Iconos
Hasta que no creemos nuestro propio set de iconos, recomendamos usar Catppuccin Perfect Icons (thang-nm.catppuccin-perfect-icons), cuyos tonos pastel combinan bien con la paleta del tema.
- Instala la extensión Catppuccin Perfect Icons desde el marketplace de VS Code.
- Abre la paleta de comandos (
Ctrl+Shift+P) → "Iconos de archivo" → selecciona "Catppuccin Perfect Icons" (variante Mocha para encajar con el tema oscuro).
Próximamente planeamos empaquetar nuestra propia colección de iconos para el tema.
Tipografía
El tema empaqueta JetBrains Mono (SIL Open Font License) en la carpeta fonts/. Para activarla:
- Activa la configuración
russianhacker.applyFont en true. La extensión aplicará JetBrains Mono a editor.fontFamily y terminal.integrated.fontFamily automáticamente (solo si no tienes ya una fuente configurada).
- Opcional: si usas una extensión de CSS personalizado (p. ej. Custom UI Style), inyecta
neon-border.active.css para que el @font-face de JetBrains Mono y el borde RGB animado se apliquen al workbench. Ese archivo lo genera la extensión a partir de la paleta activa; ver Borde neón.
{
"russianhacker.applyFont": true,
"russianhacker.fontFamily": "JetBrains Mono"
}
Transparencia de la ventana
El tema incluye un efecto glass que aplica transparencia a toda la ventana de VS Code de forma nativa (sin necesidad de instalar GlassIt).
- Windows: usa la API Win32 (ventana layered) vía PowerShell.
- Linux: usa
xprop (o swaymsg con russianhacker.forceSway).
Configuración:
| Opción |
Default |
Descripción |
russianhacker.alpha |
235 |
Nivel de transparencia (1 = transparente, 255 = opaco). |
russianhacker.step |
5 |
Incremento por atajo. |
russianhacker.forceSway |
false |
Usar swaymsg en Linux. |
russianhacker.applyFont |
false |
Aplicar JetBrains Mono a editor y terminal. |
russianhacker.fontFamily |
JetBrains Mono |
Familia tipográfica empaquetada. |
russianhacker.syncNeonBorder |
true |
Regenerar el CSS del borde neón al cambiar de paleta. |
russianhacker.cssPath |
"" |
Ruta de salida del CSS generado. |
Atajos: Ctrl+Alt+Z aumenta la transparencia, Ctrl+Alt+C la disminuye. También están disponibles los comandos Russian Hacker: Aumentar/Disminuir transparencia de la ventana en la paleta de comandos.
{
"russianhacker.alpha": 235,
"russianhacker.step": 5
}
Borde neón
neon-border.css es una plantilla: sus colores están marcados con {{A1}}..{{A4}}. La extensión la resuelve y escribe el resultado en neon-border.active.css usando los acentos de la paleta activa, así que el borde neón sigue a la variante que tengas puesta en vez de quedarse fijo en violeta/cian.
- Instala la extensión Custom UI Style (VS Code ya no permite CSS personalizado de forma nativa).
- Apúntala a
neon-border.active.css, dentro de la carpeta de la extensión Russian Hacker.
- Listo: al cambiar de paleta, la extensión rehace el archivo y el borde se recolorea solo.
Para cambiar el color manualmente, Russian Hacker: Regenerar borde neón para el tema activo. Si prefieres otra ubicación, apunta russianhacker.cssPath a una ruta absoluta.
Personalización
Para ajustar configuraciones, edita settings.json:
{
"workbench.colorTheme": "Russian Hacker",
"editor.fontSize": 14,
"terminal.integrated.fontSize": 13
}
Licencia
MIT — Copyright (c) 2026 Martín Alejandro Oviedo.
