·visual-explainer
{}

visual-explainer

Genere páginas HTML independientes que expliquen visualmente sistemas, historias de datos, investigaciones, flujos de trabajo editoriales y cambios de código. Úselo cuando el usuario solicite diagramas, vistas de arquitectura, diferencias visuales, tablas de datos, líneas de tiempo, mapas de origen o cualquier visualización estructurada que sería difícil de leer como salida de terminal. También se activa para tablas con más de 4 filas o 3+ columnas. Adaptado de nicobailon/visual-explainer con sensibilidades de periodismo, redacción y diseño académico.

15Instalaciones·0Tendencia·@jamditis

Instalación

$npx skills add https://github.com/jamditis/claude-skills-journalism --skill visual-explainer

Cómo instalar visual-explainer

Instala rápidamente el skill de IA visual-explainer en tu entorno de desarrollo mediante línea de comandos

  1. Abrir Terminal: Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.)
  2. Ejecutar comando de instalación: Copia y ejecuta este comando: npx skills add https://github.com/jamditis/claude-skills-journalism --skill visual-explainer
  3. Verificar instalación: Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

Fuente: jamditis/claude-skills-journalism.

SKILL.md

Ver original

Generate self-contained HTML files for technical diagrams and data visualizations. Always open the result in the browser. Never fall back to ASCII art when this skill is loaded.

Proactive table rendering: When about to output a table with 4+ rows or 3+ columns, render it as styled HTML instead of ASCII. Open in browser.

The swap test: If you replaced your styling with a generic dark theme and nobody would notice the difference, you haven't designed anything. Push further.

Genere páginas HTML independientes que expliquen visualmente sistemas, historias de datos, investigaciones, flujos de trabajo editoriales y cambios de código. Úselo cuando el usuario solicite diagramas, vistas de arquitectura, diferencias visuales, tablas de datos, líneas de tiempo, mapas de origen o cualquier visualización estructurada que sería difícil de leer como salida de terminal. También se activa para tablas con más de 4 filas o 3+ columnas. Adaptado de nicobailon/visual-explainer con sensibilidades de periodismo, redacción y diseño académico. Fuente: jamditis/claude-skills-journalism.

Datos (listos para citar)

Campos y comandos estables para citas de IA/búsqueda.

Comando de instalación
npx skills add https://github.com/jamditis/claude-skills-journalism --skill visual-explainer
Categoría
{}Análisis de Datos
Verificado
Primera vez visto
2026-02-26
Actualizado
2026-03-10

Browse more skills from jamditis/claude-skills-journalism

Respuestas rápidas

¿Qué es visual-explainer?

Genere páginas HTML independientes que expliquen visualmente sistemas, historias de datos, investigaciones, flujos de trabajo editoriales y cambios de código. Úselo cuando el usuario solicite diagramas, vistas de arquitectura, diferencias visuales, tablas de datos, líneas de tiempo, mapas de origen o cualquier visualización estructurada que sería difícil de leer como salida de terminal. También se activa para tablas con más de 4 filas o 3+ columnas. Adaptado de nicobailon/visual-explainer con sensibilidades de periodismo, redacción y diseño académico. Fuente: jamditis/claude-skills-journalism.

¿Cómo instalo visual-explainer?

Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/jamditis/claude-skills-journalism --skill visual-explainer Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

¿Dónde está el repositorio de origen?

https://github.com/jamditis/claude-skills-journalism