architecture-diagram

Name: architecture-diagram
Availability: InStock
Author: plaidmustache

Generate standalone HTML architecture diagrams with inline SVG from component lists.

Updated May 4, 2026

Search Tags:#architecture #html #offline #infrastructure #svg #design-system #diagram

Ready to run

npx skills add https://github.com/Plaidmustache/hermes-nulab --skill architecture-diagram-plaidmustache

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: architecture-diagram
Source: https://github.com/Plaidmustache/hermes-nulab/tree/main/skills/creative/architecture-diagram
Command: npx skills add https://github.com/Plaidmustache/hermes-nulab --skill architecture-diagram-plaidmustache

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Generate professional, dark-themed architecture diagrams as standalone HTML files using inline SVG, eliminating the need for external diagram tools or dependencies.

Core Features & Use Cases

Generate offline, self-contained diagrams that render in any modern browser.
Visualize software stacks, cloud topologies, and deployment maps with a consistent dark theme and grid-based design.
Use cases include documenting microservice architectures, cloud architectures, and infrastructure relationships for teams and docs.

Quick Start

Describe your system's components and relationships to generate a ready-to-share architecture diagram HTML.

Frequently Asked Questions about architecture-diagram

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate an architecture diagram as an offline HTML file?▼

To generate an architecture diagram as an offline HTML file, provide your system's components and relationships. The tool outputs a standalone HTML file with inline SVG that renders in any browser without external dependencies.

Can I create a dark-themed SVG diagram without external dependencies?▼

Yes, you can create a dark-themed SVG diagram without external dependencies. The generated HTML file is fully self-contained, using inline SVG to ensure it works offline in any modern browser.

How do I document a microservices architecture for my team docs?▼

To document a microservices architecture, describe your software stacks and component relationships. This generates a professional, dark-themed infrastructure map suitable for team documentation.

What is the best way to map a cloud infrastructure topology offline?▼

The best way to map a cloud infrastructure topology offline is by inputting your cloud environment components. It produces a grid-based, self-contained HTML deployment diagram with a consistent dark visual design system.

Does this diagram generator support drawing complex infrastructure relationships?▼

Yes, this diagram generator supports drawing complex infrastructure relationships. You define the software stacks and cloud topologies, and it visualizes the deployment maps using inline SVG within a single HTML file.