https://github.com/glastor-dev/svg-visor
Extension para visualizar SVG en Visual Studio Code
https://github.com/glastor-dev/svg-visor
Last synced: 16 days ago
JSON representation
Extension para visualizar SVG en Visual Studio Code
- Host: GitHub
- URL: https://github.com/glastor-dev/svg-visor
- Owner: glastor-dev
- License: mit
- Created: 2025-12-21T11:17:03.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2025-12-21T12:51:44.000Z (about 2 months ago)
- Last Synced: 2025-12-23T03:58:59.266Z (about 2 months ago)
- Language: JavaScript
- Size: 58.6 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🌌 SVG Visor (VS Code Extension)
[](https://github.com/glastor-dev/svg-visor/actions/workflows/ci.yml)
[](https://github.com/glastor-dev/svg-visor/releases)
[](https://opensource.org/licenses/MIT)
**SVG Visor** es un visualizador premium, rápido y moderno de archivos `.svg` diseñado específicamente para Visual Studio Code, Insiders y entornos compatibles como Antigravity.
---
## ✨ Características Principales
### 🎨 Interfaz Premium
- **Glassmorphism UI**: Una barra de herramientas moderna con efectos de desenfresque y diseño transparente.
- **Codicons nativos**: Integración total con la iconografía de VS Code para una experiencia nativa.
- **Micro-animaciones**: Transiciones suaves al hacer zoom o ajustar la vista.
### 🖱️ Interacciones Avanzadas
- **Zoom Natural**: Zoom inteligente hacia el cursor (Ctrl + Rueda).
- **Control de Pan**: Arrastre fluido con clic izquierdo o botón central del ratón.
- **Fit To Screen**: Ajuste automático del SVG al área de visión con un solo clic.
### 🛠️ Herramientas de Productividad
- **Exportación PNG**: Generación de archivos PNG de alta resolución (2x).
- **Copiado al Portapapeles**: Copia el código SVG optimizado instantáneamente.
- **Optimización SVGO**: Limpieza y reducción de tamaño de tus SVG con un solo botón.
- **Live Reload**: Previsualización en tiempo real mientras editas el código o cuando el archivo cambia en disco.
---
## 🚀 Desarrollo e Instalación
### Requisitos
- VS Code / Insiders ^1.75.0
- Node.js & npm
### Configuración Local
```bash
# Instalar dependencias
npm install
# Compilar el proyecto
npm run compile
```
### Depuración
Abre la carpeta en VS Code y presiona `F5` para lanzar una instancia de desarrollo de la extensión.
---
## 🛠️ Uso
- **Apertura automática**: Abre cualquier archivo `.svg` y se mostrará con **SVG Visor** por defecto.
- **Menú Contextual**: Clic derecho sobre un `.svg` → **Abrir con...** → **SVG Visor**.
- **Comando**: Ejecuta `SVG Visor: Abrir previsualización` desde la paleta de comandos para abrir el preview al lado del código.
---
## 🏛️ Gobernanza y Contribución
Valoramos la excelencia técnica. Si deseas contribuir, por favor revisa nuestros documentos de gobernanza:
- [CONTRIBUTING.md](.github/CONTRIBUTING.md)
- [CODE_OF_CONDUCT.md](.github/CODE_OF_CONDUCT.md)
- [CHANGELOG.md](CHANGELOG.md)
---
© 2010-2026 Andrés Antonio Cardoso — Ingeniería de Software de Alto Rendimiento