Excalidraw, extensión para dibujar esquemas y diagramas

Esta extensión es una integración no oficial para usar la herramienta de diagramación Excalidraw en VS Code y dibujar directamente dentro del editor.

1. Instalación

1. Abre Visual Studio Code
2. Cambia a Extensiones
3. Busca: Excalidraw (autor: pomdtr)

O puedes abrir su página en el Marketplace y añadirlo:

Excalidraw

Esta extensión integra Excalidraw en VS Code, permite diagramas y dibujar directamente en el editor.

Marketplace

2. Crear archivos para Excalidraw

Para habilitar la pizarra y comenzar a dibujar, solo necesitas crear un archivo con la extensión .excalidraw o .excalidraw.png. Al abrirlo, se mostrará automáticamente la interfaz visual.

3. Guardar y exportar

Puedes guardar los archivos .excalidraw o exportar tus dibujos a imágenes .png o vectoriales .svg.

• Para guardar de forma rápida utiliza el atajo Ctrl + S.
• Para expotar a otro formato utiliza el atajo Ctrl + Shift + E .

4. Configuración adicional

Podemos cambiar la apariencia y el idioma de la interfaz a través de la configuración de VS Code en el archivo setting.json

4.1 Alternar entre tema claro y oscuro

Desde la interfaz, en la parte superior, encontrarás un botón que permite alternar entre tres opciones:

• Claro (predeterminado)
• Oscuro
• Automático (se sincroniza con el tema de VS Code en uso)

También puedes cambiar el tema desde el archivo settings.json:

4.2 Cambiar el idioma de la interfaz

De forma predeterminada, la extensión utiliza la configuración de VS Code, si el editor está en inglés la integración de Excalidraw se configura con ese idioma. Para cambiar el idioma, abrimos nuevamente el archivo settings.json y definir el código regional en excalidrar.languaje. Por ejemplo, cambiar el español:

  "excalidrar.languaje": "es-ES"