SkillarioDiagram Design
Pídele un diagrama en lenguaje normal y te entrega un único archivo HTML con SVG, con aspecto editorial y los colores de tu marca. 45 tipos de diagrama.
Instalación
$ npx skills add cathrynlavery/diagram-design
Revisada: sin riesgos reales
Los avisos son falsos positivos. Las «instrucciones ocultas» son comentarios HTML normales de los diagramas de ejemplo (p. ej. «<!-- Legacy System -->»), «no warning» es texto de un diagrama de ejemplo («NO WARNING AT 80%»), «access token» aparece en un diagrama de ejemplo sobre OAuth y «without asking» se refiere a quitar cajas secundarias de un diagrama simplificado. Lo único real y menor: puede crear la carpeta ~/.diagram-design para guardar perfiles de marca, y los diagramas cargan fuentes de Google Fonts. No tiene servidor ni telemetría.
Ver los avisos del escáner
- Incomplete referenced artifact analysis (high) en
SKILL.md:29: «references/onboarding.md (partial)» - Incomplete referenced artifact analysis (high) en
SKILL.md:115: «references/type-high-level.md (partial)» - Incomplete referenced artifact analysis (high) en
SKILL.md:117: «references/type-medallion.md (partial)» - Incomplete referenced artifact analysis (high) en
SKILL.md:120: «references/type-dp-security-matrix.md (partial)» - Hidden Instructions (high) en
assets/example-high-level-dark.html:146: «<!-- Legacy System -->» - Hidden Instructions (high) en
assets/example-high-level.html:183: «<!-- ── Legacy System ── -->» - Anti-Refusal Statement (high) en
assets/example-journey-dark.html:119: «NO WARNING» - Anti-Refusal Statement (high) en
assets/example-journey-full.html:38: «no warning» - Credential Access (high) en
assets/example-sequence-oauth-full.html:318: «access token» - Hidden Instructions (high) en
assets/example-sequence-oauth.html:108: «<!-- ================================================================= M1: Client → API GET /resource (before ALT frame) ================» - Hidden Instructions (high) en
assets/example-timeline-dark.html:88: «<!-- Event 1: FEB 2025 · First post (below) -->» - Hidden Instructions (high) en
references/export.md:85: «<!--|<!\[CDATA\[") START_TAG_RE = re.compile( r"<([A-Za-z][\w:.-]*)" r"((?:\s+[^\s\"'<>/=]+(?:\s*=\s*(?:\"[^\"]*\"|'[^']*'|[^\s\"'=<>`]+))?)*» - Skill declares no tool scope ('permissions' or 'allowed-tools') but code capabilities were (medium) en
SKILL.md:1: «Skill declares no tool scope ('permissions' or 'allowed-tools') but code capabilities were detected: file_read, file_write, network, shell.» - Unbounded Output (medium) en
references/export-registry.md:60: «no trimming» - Autonomous Decision Making (medium) en
references/output-spec.md:200: «without asking» - Session Persistence (medium) en
references/profiles.md:57: «create the library with `mkdir -p ~/.diagram-design» - Session Persistence (medium) en
references/profiles.md:118: «mkdir -p ~/.diagram-design»
Un escáner automático no garantiza que Diagram Design sea segura. Lee su código antes de instalarla, sobre todo si ejecuta scripts o pide permisos.
¿Para qué sirve?
- Hacer el diagrama de arquitectura de tu app para una presentación
- Dibujar un cuadrante impacto/esfuerzo o una línea de tiempo para un post
- Adaptar todos tus diagramas a los colores y fuentes de tu web
Preguntas sobre Diagram Design
¿Qué hace Diagram Design?
Pídele un diagrama en lenguaje normal y te entrega un único archivo HTML con SVG, con aspecto editorial y los colores de tu marca. 45 tipos de diagrama.
¿Cómo se instala Diagram Design?
Copia y ejecuta en tu terminal: npx skills add cathrynlavery/diagram-design. Después pídeselo a Claude con normalidad.
¿Diagram Design es gratis?
Sí. Es un proyecto de código abierto de Cathryn Lavery con licencia MIT. Solo necesitas tu propio plan de Claude.
Skillario no es el autor de esta skill. La ficha resume su funcionamiento; el proyecto pertenece a Cathryn Lavery. Revisa su README antes de instalarla.
Skills relacionadas
Video Shotcraft
Claude monta el vídeo promo de tu web a partir de tus propias capturas.
Ver ficha →Slack GIF Creator (oficial de Anthropic)
Le pides un GIF animado y lo dibuja fotograma a fotograma con código, al tamaño que pide Slack (emoji de 128 px o mensaje de 480 px), y comprueba que pesa lo justo.
Ver ficha →Drama Skills
Doce skills para crear microdramas verticales con IA: guion, guion gráfico, prompts de imagen y vídeo con continuidad y montaje.
Ver ficha →claude-youtube
Un consultor de YouTube dentro de tu IA: 14 comandos para ganchos, guiones con retención, miniaturas, SEO de vídeo, Shorts, calendario y auditoría del canal.
Ver ficha →