# diagrams-js > Draw cloud system architecture diagrams as code in TypeScript - [diagrams-js](/) ## markdown-page - [Markdown page example](/markdown-page): You don't need React to write simple standalone pages. ## playground - [Playground](/playground): Interactive diagrams-js playground ## search - [Search the documentation](/search) ## docs - [AI Guide](/docs/ai-guide): Guide for AI LLMs and agents using diagrams-js - [Credits](/docs/credits): Acknowledgments and credits - [Examples](/docs/getting-started/examples): Real-world architecture examples - [Installation](/docs/getting-started/installation): Installing diagrams-js in your project - [Quick Start](/docs/getting-started/quickstart): Create your first diagram in minutes - [API Reference](/docs/guides/api): Complete API documentation - [Clusters](/docs/guides/clusters): Group nodes together with clusters - [Custom Nodes](/docs/guides/custom-nodes): Use your own icons and images - [Diagrams](/docs/guides/diagram): Understanding the Diagram class - [Edges](/docs/guides/edge): Connecting nodes with customized edges - [Migration from Python diagrams](/docs/guides/migration): Migrate from Python diagrams to TypeScript - [Nodes](/docs/guides/node): Working with nodes and data flow - [Providers](/docs/guides/providers): Available cloud providers - [Rendering](/docs/guides/rendering): Render and export diagrams - [Alibaba Cloud](/docs/nodes/alibabacloud): Node classes for Alibaba Cloud provider - [AWS](/docs/nodes/aws): Node classes for Amazon Web Services provider - [Azure](/docs/nodes/azure): Node classes for Microsoft Azure provider - [C4 Model](/docs/nodes/c4): Visualize software architecture using the C4 model - [DigitalOcean](/docs/nodes/digitalocean): Node classes for DigitalOcean provider - [Elastic](/docs/nodes/elastic): Node classes for Elastic Stack provider - [Firebase](/docs/nodes/firebase): Node classes for Firebase provider - [GCP](/docs/nodes/gcp): Node classes for Google Cloud Platform provider - [Generic](/docs/nodes/generic): Node classes for generic/on-premise resources - [GIS](/docs/nodes/gis): Node classes for GIS (Geographic Information Systems) provider - [IBM](/docs/nodes/ibm): Node classes for IBM Cloud provider - [Kubernetes](/docs/nodes/k8s): Node classes for Kubernetes provider - [OCI](/docs/nodes/oci): Node classes for Oracle Cloud Infrastructure provider - [On-Premises](/docs/nodes/onprem): Node classes for on-premises infrastructure - [OpenStack](/docs/nodes/openstack): Node classes for OpenStack provider - [Outscale](/docs/nodes/outscale): Node classes for Outscale provider - [Programming](/docs/nodes/programming): Node classes for programming languages and frameworks - [SaaS](/docs/nodes/saas): Node classes for Software as a Service providers --- # Full Documentation Content # Markdown page example You don't need React to write simple standalone pages. --- Example: -- Select an example -- Share ## Tips[​](#tips "Direct link to Tips") * Use `Diagram("name")` to create diagrams * Import providers like `diagrams-js/aws/compute` * Call `await diagram.render()` to generate the SVG --- [Skip to main content](#__docusaurus_skipToContent_fallback) [![diagrams-js](/img/logo.svg)![diagrams-js](/img/logo.svg)](/) [**diagrams-js**](/)[Docs](/docs/getting-started/installation)[Examples](/docs/getting-started/examples)[Guides](/docs/guides/diagram)[Providers](/docs/guides/providers)[Playground](/playground) [GitHub](https://github.com/hatemhosny/diagrams-js) Search # Search the documentation Type your search here Powered by[](https://www.algolia.com/) Docs * [Getting Started](/docs/getting-started/quickstart) * [Examples](/docs/getting-started/examples) * [API Reference](/docs/guides/diagram) * [llms.txt](/llms.txt) * [llms-full.txt](/llms-full.txt) Community * [GitHub](https://github.com/hatemhosny/diagrams-js) * [𝕏 / Twitter](https://x.com/hatem_hosny_) * [Credits](/docs/credits) More * [Playground](/playground) * [Sponsor 💚](https://github.com/sponsors/hatemhosny) Copyright © 2026 [Hatem Hosny](https://github.com/hatemhosny). MIT License. --- # AI Guide This guide is specifically designed for AI Large Language Models (LLMs) and autonomous agents to effectively use the diagrams-js library for generating cloud architecture diagrams. ## Quick Reference Files[​](#quick-reference-files "Direct link to Quick Reference Files") LLM-Optimized Documentation For optimal context when working with diagrams-js, use these specially formatted documentation files: **📄 [llms.txt](/llms.txt)** - Concise overview of the library, installation, basic usage, and key concepts **📄 [llms-full.txt](/llms-full.txt)** - Complete documentation including all guides, API reference, and examples These files are specifically structured for AI consumption with: * Clear API signatures and type definitions * Code examples with expected outputs * Provider reference lists * Best practices and common patterns ## Key Concepts for AI Agents[​](#key-concepts-for-ai-agents "Direct link to Key Concepts for AI Agents") ### 1. Diagram Structure[​](#1-diagram-structure "Direct link to 1. Diagram Structure") ``` import { Diagram } from "diagrams-js"; // Always create a diagram instance first const diagram = Diagram("Architecture Name", { direction: "TB", // Top-Bottom (or "LR" for Left-Right) }); ``` ### 2. Adding Nodes[​](#2-adding-nodes "Direct link to 2. Adding Nodes") Nodes can be added using the `add()` method: ``` import { Diagram, Node } from "diagrams-js"; const diagram = Diagram("Example"); // Basic node (no icon) const basicNode = diagram.add(Node("Label")); // Provider nodes (auto-include icons) import { EC2 } from "diagrams-js/aws/compute"; const server = diagram.add(EC2("Web Server")); ``` ### 3. Creating Connections[​](#3-creating-connections "Direct link to 3. Creating Connections") Use method chaining for connections: ``` import { Edge } from "diagrams-js"; // .to() - Forward direction (left to right) nodeA.to(nodeB); // Sequential connections nodeA.to(nodeB).to(nodeC); // Branching connections nodeA.to([nodeB, nodeC]); // Connect multiple nodes to one target const nodes = [nodeB, nodeC, nodeD]; nodes.forEach((n) => n.to(nodeA)); // .from() - Reverse direction (right to left) nodeB.from(nodeA); // .with() - Undirected/bidirectional (no arrows) nodeA.with(nodeB); // With custom styling using Edge nodeA.to(Edge({ color: "red", style: "dashed" }), nodeB); ``` ### 4. Rendering Output[​](#4-rendering-output "Direct link to 4. Rendering Output") Always render and cleanup: ``` // Generate SVG const svg = await diagram.render(); // Use the SVG (save to file, display, etc.) // Clean up resources diagram.destroy(); ``` ## Common Patterns[​](#common-patterns "Direct link to Common Patterns") ### Web Application Architecture[​](#web-application-architecture "Direct link to Web Application Architecture") ``` import { Diagram } from "diagrams-js"; import { ALB } from "diagrams-js/aws/network"; import { EC2, AutoScaling } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { S3 } from "diagrams-js/aws/storage"; const diagram = Diagram("Web App Architecture"); const lb = diagram.add(ALB("Load Balancer")); const web = diagram.add(EC2("Web Servers")); const db = diagram.add(RDS("Database")); const storage = diagram.add(S3("Assets")); lb.to(web); web.to([db, storage]); const svg = await diagram.render(); diagram.destroy(); ``` ### Microservices Pattern[​](#microservices-pattern "Direct link to Microservices Pattern") ``` import { Diagram } from "diagrams-js"; import { ECS } from "diagrams-js/aws/compute"; const diagram = Diagram("Microservices"); // Group related services using clusters const apiCluster = diagram.cluster("API Gateway"); const auth = apiCluster.add(ECS("Auth Service")); const rateLimiter = apiCluster.add(ECS("Rate Limiter")); const servicesCluster = diagram.cluster("Services"); const userSvc = servicesCluster.add(ECS("User Service")); const orderSvc = servicesCluster.add(ECS("Order Service")); const paymentSvc = servicesCluster.add(ECS("Payment Service")); // Connect clusters auth.to([userSvc, orderSvc, paymentSvc]); const svg = await diagram.render(); diagram.destroy(); ``` ## Provider Organization[​](#provider-organization "Direct link to Provider Organization") Cloud providers are organized hierarchically: ``` diagrams-js/ ├── aws/ │ ├── compute/ # EC2, Lambda, etc. │ ├── database/ # RDS, DynamoDB, etc. │ ├── storage/ # S3, EBS, etc. │ └── ... ├── azure/ │ ├── compute/ │ ├── database/ │ └── ... └── gcp/ ├── compute/ ├── database/ └── ... ``` ## Best Practices for AI Generation[​](#best-practices-for-ai-generation "Direct link to Best Practices for AI Generation") 1. **Use descriptive node labels** that explain the component's role 2. **Group related nodes** using `Cluster` for better organization 3. **Set appropriate diagram direction** based on the layout needs 4. **Import only needed providers** to optimize bundle size 5. **Handle async operations** properly with `await diagram.render()` ## Environment Support[​](#environment-support "Direct link to Environment Support") * **Browsers**: Direct usage with ES modules * **Node.js/Deno/Bun**: Save SVG to files using
`await diagram.save("filename.svg", { format: "svg" }); // or "png"/"jpeg"` ## Resources[​](#resources "Direct link to Resources") * 📚 [Full Documentation](/docs/getting-started/installation) * 🔧 [API Reference](/docs/guides/diagram) * 🎨 [Provider List](/docs/guides/providers) * 📄 [llms.txt](/llms.txt) - Quick reference * 📄 [llms-full.txt](/llms-full.txt) - Complete docs --- # Credits diagrams-js is made possible thanks to these amazing projects and communities: ## Original Project[​](#original-project "Direct link to Original Project") **[diagrams](https://github.com/mingrammer/diagrams)** by [mingrammer](https://github.com/mingrammer) This project is a TypeScript port of the original Python diagrams library. We are grateful to mingrammer for creating such an elegant and powerful tool for drawing cloud architecture diagrams as code. ## Rendering Engine[​](#rendering-engine "Direct link to Rendering Engine") **[Graphviz](https://graphviz.org/)** The graph visualization software that powers the layout and rendering of all diagrams. Graphviz provides the sophisticated algorithms for positioning nodes and routing edges. **[viz-js](https://github.com/mdaines/viz-js)** by [mdaines](https://github.com/mdaines) A WebAssembly-based port of Graphviz for JavaScript. This enables diagrams-js to run entirely in the browser without requiring any server-side components. ## Icon Sets[​](#icon-sets "Direct link to Icon Sets") All node icons are from the original [diagrams](https://github.com/mingrammer/diagrams) library, which includes icons from various cloud providers and technology vendors. ## Community[​](#community "Direct link to Community") Thank you to all contributors and users who help improve diagrams-js through bug reports, feature requests, and pull requests. ## License[​](#license "Direct link to License") diagrams-js is released under the MIT License, same as the original diagrams library. --- # Examples Here are comprehensive examples demonstrating the capabilities of diagrams-js. info These examples are reproduced from the original [Python's Diagrams library](https://diagrams.mingrammer.com/docs/getting-started/examples) documentations. Live Demo For interactive examples with live rendered diagrams, check out the [playground](/playground). ## Grouped Workers on AWS[​](#grouped-workers-on-aws "Direct link to Grouped Workers on AWS") ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { ELB } from "diagrams-js/aws/network"; const diagram = Diagram("Grouped Workers", { direction: "TB", }); const lb = diagram.add(ELB("lb")); const workers = [ diagram.add(EC2("worker1")), diagram.add(EC2("worker2")), diagram.add(EC2("worker3")), diagram.add(EC2("worker4")), diagram.add(EC2("worker5")), ]; const events = diagram.add(RDS("events")); lb.to(workers); workers.forEach((w) => w.to(events)); const svg = await diagram.render(); diagram.destroy(); ``` ![Grouped Workers on AWS](/examples/example1-grouped-workers.svg) ## Clustered Web Services[​](#clustered-web-services "Direct link to Clustered Web Services") ``` import { Diagram } from "diagrams-js"; import { ECS } from "diagrams-js/aws/compute"; import { RDS, Elasticache } from "diagrams-js/aws/database"; import { ELB, Route53 } from "diagrams-js/aws/network"; const diagram = Diagram("Clustered Web Services"); const dns = diagram.add(Route53("dns")); const lb = diagram.add(ELB("lb")); const svcCluster = diagram.cluster("Services"); const svcGroup = [ svcCluster.add(ECS("web1")), svcCluster.add(ECS("web2")), svcCluster.add(ECS("web3")), ]; lb.to(svcGroup); const dbCluster = diagram.cluster("DB Cluster"); const dbPrimary = dbCluster.add(RDS("userdb")); const dbReplica = dbCluster.add(RDS("userdb ro")); dbPrimary.with(dbReplica); svcGroup.forEach((s) => s.to(dbPrimary)); const memcached = diagram.add(Elasticache("memcached")); svcGroup.forEach((s) => s.to(memcached)); dns.to(lb); const svg = await diagram.render(); diagram.destroy(); ``` ![Clustered Web Services](/examples/example2-clustered-web-services.svg) ## Event Processing on AWS[​](#event-processing-on-aws "Direct link to Event Processing on AWS") ``` import { Diagram } from "diagrams-js"; import { ECS, EKS, Lambda } from "diagrams-js/aws/compute"; import { Redshift } from "diagrams-js/aws/database"; import { SQS } from "diagrams-js/aws/integration"; import { S3 } from "diagrams-js/aws/storage"; const diagram = Diagram("Event Processing"); const source = diagram.add(EKS("k8s source")); const store = diagram.add(S3("events store")); const dw = diagram.add(Redshift("analytics")); const flowsCluster = diagram.cluster("Event Flows"); const workersCluster = flowsCluster.cluster("Event Workers"); const workerNodes = [ workersCluster.add(ECS("worker1")), workersCluster.add(ECS("worker2")), workersCluster.add(ECS("worker3")), ]; source.to(workerNodes); const queue = flowsCluster.add(SQS("event queue")); workerNodes.forEach((w) => w.to(queue)); const procCluster = flowsCluster.cluster("Processing"); const handlers = [ procCluster.add(Lambda("proc1")), procCluster.add(Lambda("proc2")), procCluster.add(Lambda("proc3")), ]; queue.to(handlers); handlers.forEach((h) => { h.to(store); h.to(dw); }); const svg = await diagram.render(); diagram.destroy(); ``` ![Event Processing on AWS](/examples/example3-event-processing.svg) ## Message Collecting System on GCP[​](#message-collecting-system-on-gcp "Direct link to Message Collecting System on GCP") ``` import { Diagram } from "diagrams-js"; import { BigQuery, Dataflow, PubSub } from "diagrams-js/gcp/analytics"; import { AppEngine, Functions } from "diagrams-js/gcp/compute"; import { Bigtable } from "diagrams-js/gcp/database"; import { IotCore } from "diagrams-js/gcp/iot"; import { Storage } from "diagrams-js/gcp/storage"; const diagram = Diagram("Message Collecting"); const pubsub = diagram.add(PubSub("pubsub")); const sourceCluster = diagram.cluster("Source of Data"); const sources = [ sourceCluster.add(IotCore("core1")), sourceCluster.add(IotCore("core2")), sourceCluster.add(IotCore("core3")), ]; sources.forEach((s) => s.to(pubsub)); const targetsCluster = diagram.cluster("Targets"); const flowCluster = targetsCluster.cluster("Data Flow"); const dataflow = flowCluster.add(Dataflow("data flow")); pubsub.to(dataflow); const lakeCluster = targetsCluster.cluster("Data Lake"); const bq = lakeCluster.add(BigQuery("bq")); const gcs = lakeCluster.add(Storage("storage")); dataflow.to([bq, gcs]); const eventCluster = targetsCluster.cluster("Event Driven"); const procCluster = eventCluster.cluster("Processing"); const engine = procCluster.add(AppEngine("engine")); const bigtable = procCluster.add(Bigtable("bigtable")); dataflow.to(engine).to(bigtable); const serverlessCluster = eventCluster.cluster("Serverless"); const func = serverlessCluster.add(Functions("func")); const appengine = serverlessCluster.add(AppEngine("appengine")); dataflow.to(func).to(appengine); const svg = await diagram.render(); diagram.destroy(); ``` ![Message Collecting System on GCP](/examples/example4-message-collecting.svg) ## Exposed Pod with 3 Replicas on Kubernetes[​](#exposed-pod-with-3-replicas-on-kubernetes "Direct link to Exposed Pod with 3 Replicas on Kubernetes") ``` import { Diagram } from "diagrams-js"; import { HPA } from "diagrams-js/k8s/clusterconfig"; import { Deployment, Pod, ReplicaSet } from "diagrams-js/k8s/compute"; import { Ingress, Service } from "diagrams-js/k8s/network"; const diagram = Diagram("Exposed Pod with 3 Replicas"); const ingress = diagram.add(Ingress("domain.com")); const svc = diagram.add(Service("svc")); const pods = [diagram.add(Pod("pod1")), diagram.add(Pod("pod2")), diagram.add(Pod("pod3"))]; const rs = diagram.add(ReplicaSet("rs")); const dp = diagram.add(Deployment("dp")); const hpa = diagram.add(HPA("hpa")); ingress.to(svc); svc.to(pods); pods.forEach((p) => p.from(rs)); rs.from(dp); dp.from(hpa); const svg = await diagram.render(); diagram.destroy(); ``` ![Exposed Pod with 3 Replicas](/examples/example5-k8s-exposed-pod.svg) ## Stateful Architecture on Kubernetes[​](#stateful-architecture-on-kubernetes "Direct link to Stateful Architecture on Kubernetes") ``` import { Diagram } from "diagrams-js"; import { Pod, StatefulSet } from "diagrams-js/k8s/compute"; import { Service } from "diagrams-js/k8s/network"; import { PV, PVC } from "diagrams-js/k8s/storage"; const diagram = Diagram("Stateful Architecture"); const appsCluster = diagram.cluster("Apps"); const svc = appsCluster.add(Service("svc")); const sts = appsCluster.add(StatefulSet("sts")); const pods = []; const pvcs = []; for (let i = 0; i < 3; i++) { const pod = appsCluster.add(Pod("pod")); const pvc = appsCluster.add(PVC("pvc")); pod.with(sts).with(pvc); svc.to(pod).to(pvc); pods.push(pod); pvcs.push(pvc); } const pv = diagram.add(PV("pv")); const sc = diagram.add(StorageClass("sc")); pvcs.forEach((pvc) => { pvc.from(pv); }); pv.from(sc); const svg = await diagram.render(); diagram.destroy(); ``` ![Stateful Architecture](/examples/example6-k8s-stateful.svg) ## Advanced Web Service with On-Premises[​](#advanced-web-service-with-on-premises "Direct link to Advanced Web Service with On-Premises") ``` import { Diagram } from "diagrams-js"; import { Spark } from "diagrams-js/onprem/analytics"; import { Server } from "diagrams-js/onprem/compute"; import { PostgreSQL } from "diagrams-js/onprem/database"; import { Redis } from "diagrams-js/onprem/inmemory"; import { Fluentd } from "diagrams-js/onprem/aggregator"; import { Grafana, Prometheus } from "diagrams-js/onprem/monitoring"; import { Nginx } from "diagrams-js/onprem/network"; import { Kafka } from "diagrams-js/onprem/queue"; const diagram = Diagram("Advanced Web Service with On-Premises"); const ingress = diagram.add(Nginx("ingress")); const metrics = diagram.add(Prometheus("metric")); const grafana = diagram.add(Grafana("monitoring")); metrics.from(grafana); const serviceCluster = diagram.cluster("Service Cluster"); const grpcsvc = [ serviceCluster.add(Server("grpc1")), serviceCluster.add(Server("grpc2")), serviceCluster.add(Server("grpc3")), ]; const sessionsCluster = diagram.cluster("Sessions HA"); const sessionPrimary = sessionsCluster.add(Redis("session")); const sessionReplica = sessionsCluster.add(Redis("replica")); sessionPrimary.with(sessionReplica); sessionReplica.from(metrics); grpcsvc.forEach((svc) => svc.to(sessionPrimary)); const dbCluster = diagram.cluster("Database HA"); const dbPrimary = dbCluster.add(PostgreSQL("users")); const dbReplica = dbCluster.add(PostgreSQL("replica")); dbPrimary.with(dbReplica); dbReplica.from(metrics); grpcsvc.forEach((svc) => svc.to(dbPrimary)); const aggregator = diagram.add(Fluentd("logging")); const kafka = diagram.add(Kafka("stream")); const spark = diagram.add(Spark("analytics")); aggregator.to(kafka).to(spark); ingress.to(grpcsvc); grpcsvc.forEach((svc) => svc.to(aggregator)); const svg = await diagram.render(); diagram.destroy(); ``` ![Advanced Web Service with On-Premises](/examples/example7-onprem-advanced.svg) ## Advanced Web Service with On-Premises (with colors and labels)[​](#advanced-web-service-with-on-premises-with-colors-and-labels "Direct link to Advanced Web Service with On-Premises (with colors and labels)") ``` import { Diagram, Edge } from "diagrams-js"; import { Spark } from "diagrams-js/onprem/analytics"; import { Server } from "diagrams-js/onprem/compute"; import { PostgreSQL } from "diagrams-js/onprem/database"; import { Redis } from "diagrams-js/onprem/inmemory"; import { Fluentd } from "diagrams-js/onprem/aggregator"; import { Grafana, Prometheus } from "diagrams-js/onprem/monitoring"; import { Nginx } from "diagrams-js/onprem/network"; import { Kafka } from "diagrams-js/onprem/queue"; const diagram = Diagram("Advanced Web Service with On-Premises (colored)"); const ingress = diagram.add(Nginx("ingress")); const metrics = diagram.add(Prometheus("metric")); const grafana = diagram.add(Grafana("monitoring")); grafana.to(Edge({ color: "firebrick", style: "dashed" }), metrics); const serviceCluster = diagram.cluster("Service Cluster"); const grpcsvc = [ serviceCluster.add(Server("grpc1")), serviceCluster.add(Server("grpc2")), serviceCluster.add(Server("grpc3")), ]; const sessionsCluster = diagram.cluster("Sessions HA"); const sessionPrimary = sessionsCluster.add(Redis("session")); const sessionReplica = sessionsCluster.add(Redis("replica")); sessionPrimary.with(Edge({ color: "brown", style: "dashed" }), sessionReplica); sessionReplica.from(Edge({ label: "collect" }), metrics); grpcsvc.forEach((svc) => svc.to(Edge({ color: "brown" }), sessionPrimary)); const dbCluster = diagram.cluster("Database HA"); const dbPrimary = dbCluster.add(PostgreSQL("users")); const dbReplica = dbCluster.add(PostgreSQL("replica")); dbPrimary.with(Edge({ color: "brown", style: "dotted" }), dbReplica); dbReplica.from(Edge({ label: "collect" }), metrics); grpcsvc.forEach((svc) => svc.to(Edge({ color: "black" }), dbPrimary)); const aggregator = diagram.add(Fluentd("logging")); const kafka = diagram.add(Kafka("stream")); const spark = diagram.add(Spark("analytics")); aggregator.to(Edge({ label: "parse" }), kafka); kafka.to(Edge({ color: "black", style: "bold" }), spark); grpcsvc.forEach((svc) => { ingress.to(Edge({ color: "darkgreen", forward: true, reverse: true }), svc); }); grpcsvc.forEach((svc) => svc.to(Edge({ color: "darkorange" }), aggregator)); const svg = await diagram.render(); diagram.destroy(); ``` ![Advanced Web Service with On-Premises (with colors and labels)](/examples/example8-onprem-advanced-colors.svg) ## RabbitMQ Consumers with Custom Nodes[​](#rabbitmq-consumers-with-custom-nodes "Direct link to RabbitMQ Consumers with Custom Nodes") ``` import { Diagram, Custom } from "diagrams-js"; import { Pod } from "diagrams-js/k8s/compute"; import { Aurora } from "diagrams-js/aws/database"; const diagram = Diagram("Broker Consumers"); const consumersCluster = diagram.cluster("Consumers"); const consumers = [ consumersCluster.add(Pod("worker")), consumersCluster.add(Pod("worker")), consumersCluster.add(Pod("worker")), ]; const queue = diagram.add( Custom("Message queue", "https://jpadilla.github.io/rabbitmqapp/assets/img/icon.png", { width: "1.0", }), ); const database = diagram.add(Aurora("Database")); queue.to(consumers); consumers.forEach((consumer) => consumer.to(database)); const svg = await diagram.render(); diagram.destroy(); ``` ![RabbitMQ Consumers with Custom Nodes](/examples/example9-custom-nodes.svg) ## Next Steps[​](#next-steps "Direct link to Next Steps") * Explore [all providers](/docs/guides/providers) and their available nodes * Learn about [custom nodes](/docs/guides/custom-nodes) for external icons * Read the [complete API reference](/docs/guides/diagram) * Try the [playground](/playground) for interactive examples --- # Installation ## Node.js[​](#nodejs "Direct link to Node.js") Install [`diagrams-js`](https://www.npmjs.com/package/diagrams-js) using your preferred package manager: * npm * yarn * pnpm * bun ``` npm install diagrams-js ``` ``` yarn add diagrams-js ``` ``` pnpm add diagrams-js ``` ``` bun add diagrams-js ``` ### Optional Dependencies[​](#optional-dependencies "Direct link to Optional Dependencies") [Rendering](/docs/guides/rendering) SVG does not require any additional packages. However, for PNG and JPG rendering in Node.js, the package `sharp` is required: * npm * yarn * pnpm * bun ``` npm install sharp ``` ``` yarn add sharp ``` ``` pnpm add sharp ``` ``` bun add sharp ``` ## Browser Usage[​](#browser-usage "Direct link to Browser Usage") ### Using a Bundler[​](#using-a-bundler "Direct link to Using a Bundler") Install via npm and import: ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; ``` ### Using CDN[​](#using-cdn "Direct link to Using CDN") ``` ``` ### Using CDN with Import Map[​](#using-cdn-with-import-map "Direct link to Using CDN with Import Map") You can use import maps to enable bare module imports while loading from a CDN: ``` ``` Import Maps Import maps allow you to use bare module specifiers (like `diagrams-js/aws/compute`) instead of full URLs, making your code cleaner and more portable between bundler and CDN environments. ## Next Steps[​](#next-steps "Direct link to Next Steps") * Follow the [Quick Start guide](/docs/getting-started/quickstart) to create your first diagram * Explore the [Examples](/docs/getting-started/examples) for real-world use cases * Check out the [Node Reference](/docs/guides/providers) for all available providers and services --- # Quick Start Get started with diagrams-js in just a few lines of code. ## Basic Diagram[​](#basic-diagram "Direct link to Basic Diagram") Create a simple diagram with nodes and connections: ``` import { Diagram, Node } from "diagrams-js"; // Create a diagram const diagram = Diagram("My First Diagram", { // Diagram options direction: "TB", // Top to Bottom }); // Add nodes const web = diagram.add(Node("Web Server")); const app = diagram.add(Node("App Server")); const db = diagram.add(Node("Database")); // Connect them web.to(app).to(db); // Render to SVG const svg = await diagram.render(); // Clean up diagram.destroy(); ``` ![Basic Diagram](/examples/quickstart-basic.svg) ## Using Cloud Providers[​](#using-cloud-providers "Direct link to Using Cloud Providers") Import nodes from cloud providers to get automatic icons: ``` import { Diagram } from "diagrams-js"; import { EC2, Lambda } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { S3 } from "diagrams-js/aws/storage"; import { ALB } from "diagrams-js/aws/network"; const diagram = Diagram("AWS Architecture", { direction: "TB" }); // Create nodes with icons const lb = diagram.add(ALB("Load Balancer")); const web = diagram.add(EC2("Web Server")); const api = diagram.add(Lambda("API")); const db = diagram.add(RDS("Database")); const storage = diagram.add(S3("Storage")); // Connect them lb.to(web).to(api); api.to([db, storage]); // Render to SVG const svg = await diagram.render(); // Clean up diagram.destroy(); ``` ![AWS Architecture Example](/examples/quickstart-cloud.svg) ## Browser Integration[​](#browser-integration "Direct link to Browser Integration") Display the diagram directly in the browser: ```
``` ## Node.js Usage[​](#nodejs-usage "Direct link to Node.js Usage") Save diagrams to files in Node.js: ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; import { writeFileSync } from "fs"; const diagram = Diagram("My Diagram"); diagram.add(EC2("Server")); const svg = await diagram.render(); writeFileSync("diagram.svg", svg); diagram.destroy(); ``` ## Key Concepts[​](#key-concepts "Direct link to Key Concepts") 1. **Diagram**: The container for your architecture diagram 2. **Nodes**: Components like servers, databases, and services 3. **Connections**: Relationships between nodes using `.to()`, `.from()`, and `.with()` 4. **Providers**: Cloud service categories (AWS, Azure, GCP, etc.) ## Next Steps[​](#next-steps "Direct link to Next Steps") * Learn about [Diagrams](/docs/guides/diagram) in detail * Explore [Nodes](/docs/guides/node) and connections * See [all providers](/docs/guides/providers) and their services * Check out [complete examples](/docs/getting-started/examples) --- # API Reference ## Core Functions[​](#core-functions "Direct link to Core Functions") ### Diagram(name, options?)[​](#diagramname-options "Direct link to Diagram(name, options?)") Creates a new diagram. **Parameters:** * `name` (string): The diagram name (used for labeling and default filename) * `options` (DiagramOptions, optional): Configuration options **Returns:** Diagram instance ``` const diagram = Diagram("My Diagram", { direction: "LR", theme: "neutral", }); ``` **DiagramOptions:** | Property | Type | Default | Description | | ------------ | --------------------------------------------- | ------------------- | ---------------------------------- | | `name` | string | Same as first param | Diagram display name | | `filename` | string | Lowercase name | Output filename | | `direction` | "TB" \| "BT" \| "LR" \| "RL" | "LR" | Layout direction | | `curvestyle` | "ortho" \| "curved" \| "spline" \| "polyline" | "ortho" | Edge curve style | | `theme` | ThemeName | "neutral" | Color theme | | `autolabel` | boolean | false | Auto-prefix labels with class name | | `strict` | boolean | false | Use strict graph mode | | `graphAttr` | Record\ | | Custom graph attributes | | `nodeAttr` | Record\ | | Custom node attributes | | `edgeAttr` | Record\ | | Custom edge attributes | **Methods:** #### diagram.add(node)[​](#diagramaddnode "Direct link to diagram.add(node)") Add a node to the diagram. ``` const server = diagram.add(EC2("Web Server")); ``` #### diagram.cluster(label)[​](#diagramclusterlabel "Direct link to diagram.cluster(label)") Create a cluster (subgraph) for grouping nodes. ``` const cluster = diagram.cluster("Services"); const node = cluster.add(EC2("web")); ``` #### diagram.render(options?)[​](#diagramrenderoptions "Direct link to diagram.render(options?)") Render the diagram to a string or binary format. ``` // SVG (default) const svg = await diagram.render(); // PNG const png = await diagram.render({ format: "png" }); // DOT const dot = await diagram.render({ format: "dot" }); // As data URL (for direct use in browsers) const dataUrl = await diagram.render({ dataUrl: true }); // Returns: data:image/svg+xml;base64,PHN2Zy4uLg== // PNG as data URL const pngDataUrl = await diagram.render({ format: "png", dataUrl: true }); // Returns: data:image/png;base64,iVBORw0KGgo... ``` **RenderOptions:** | Property | Type | Default | Description | | ------------- | -------------------------------- | ------- | ----------------------- | | `format` | "svg" \| "png" \| "jpg" \| "dot" | "svg" | Output format | | `width` | number | Auto | Output width (PNG/JPG) | | `height` | number | Auto | Output height (PNG/JPG) | | `scale` | number | 2 | Scale factor (PNG/JPG) | | `injectIcons` | boolean | true | Auto-inject node icons | | `dataUrl` | boolean | false | Return as data URL | #### diagram.save(filepath?)[​](#diagramsavefilepath "Direct link to diagram.save(filepath?)") Save the diagram to a file. ``` await diagram.save("diagram.svg"); await diagram.save("diagram.png"); ``` #### diagram.destroy()[​](#diagramdestroy "Direct link to diagram.destroy()") Clean up resources. ``` diagram.destroy(); ``` ### Node(label, options?)[​](#nodelabel-options "Direct link to Node(label, options?)") Creates a generic node. Usually you use provider-specific node functions instead. ``` import { Node } from "diagrams-js"; const node = diagram.add(Node("My Node")); ``` **Node Methods:** #### node.to(target)[​](#nodetotarget "Direct link to node.to(target)") Create a forward connection (left to right). ``` web.to(api); web.to([api1, api2]); // Multiple targets ``` #### node.from(source)[​](#nodefromsource "Direct link to node.from(source)") Create a reverse connection (right to left). ``` db.from(api); db.from([api1, api2]); // Multiple sources ``` #### node.with(target)[​](#nodewithtarget "Direct link to node.with(target)") Create an undirected connection (no arrows). ``` primary.with(replica); ``` ### Edge(options?)[​](#edgeoptions "Direct link to Edge(options?)") Creates an edge with custom properties. ``` import { Edge } from "diagrams-js"; // Simple edge web.to(Edge({ color: "red" }), db); // With multiple properties web.to( Edge({ label: "data", color: "blue", style: "dashed", }), db, ); ``` **EdgeOptions:** | Property | Type | Description | | --------------- | ------- | ---------------------------------------- | | `label` | string | Edge label text | | `color` | string | Edge color | | `style` | string | Line style (solid, dashed, dotted, bold) | | `forward` | boolean | Show forward arrow | | `reverse` | boolean | Show reverse arrow | | `[key: string]` | any | Any Graphviz edge attribute | ### Custom(label, iconUrl, options?)[​](#customlabel-iconurl-options "Direct link to Custom(label, iconUrl, options?)") Creates a node with a custom icon. ``` import { Custom } from "diagrams-js"; // From URL const node = diagram.add(Custom("Service", "https://example.com/icon.png")); // From data URL const node2 = diagram.add(Custom("Local", "data:image/png;base64,...")); ``` **Parameters:** * `label` (string): Node label * `iconUrl` (string): Icon URL or data URL * `options` (object, optional): Additional node options ## Provider Imports[​](#provider-imports "Direct link to Provider Imports") ### AWS[​](#aws "Direct link to AWS") ``` import { EC2, Lambda, ECS } from "diagrams-js/aws/compute"; import { RDS, DynamoDB } from "diagrams-js/aws/database"; import { S3 } from "diagrams-js/aws/storage"; import { ALB, Route53 } from "diagrams-js/aws/network"; ``` ### Azure[​](#azure "Direct link to Azure") ``` import { VM } from "diagrams-js/azure/compute"; import { SQLDatabase } from "diagrams-js/azure/databases"; ``` ### GCP[​](#gcp "Direct link to GCP") ``` import { GCE, GKE } from "diagrams-js/gcp/compute"; import { CloudSQL } from "diagrams-js/gcp/database"; import { CloudStorage } from "diagrams-js/gcp/storage"; ``` ### Kubernetes[​](#kubernetes "Direct link to Kubernetes") ``` import { Pod, Deployment } from "diagrams-js/k8s/compute"; import { Service, Ingress } from "diagrams-js/k8s/network"; ``` See [Providers](/docs/guides/providers) for complete list. ## Utility Functions[​](#utility-functions "Direct link to Utility Functions") ### setIconBaseDir(dir)[​](#seticonbasedirdir "Direct link to setIconBaseDir(dir)") Set the base directory for loading icons in Node.js. ``` import { setIconBaseDir } from "diagrams-js"; setIconBaseDir("./icons"); ``` ### getIconBaseDir()[​](#geticonbasedir "Direct link to getIconBaseDir()") Get the current icon base directory. ``` import { getIconBaseDir } from "diagrams-js"; const dir = getIconBaseDir(); ``` ## Type Exports[​](#type-exports "Direct link to Type Exports") ``` import type { DiagramOptions, EdgeOptions, NodeOptions, ThemeName, ThemeConfig } from "diagrams-js"; ``` ## Complete Example[​](#complete-example "Direct link to Complete Example") ``` import { Diagram, Edge, Custom, type DiagramOptions } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; const options: DiagramOptions = { direction: "TB", theme: "pastel", graphAttr: { fontsize: "20", }, }; const diagram = Diagram("Architecture", options); const web = diagram.add(EC2("Web")); const db = diagram.add(RDS("DB")); const cache = diagram.add(Custom("Cache", "https://example.com/redis.png")); web.to(Edge({ color: "blue" }), db); web.to(Edge({ style: "dashed" }), cache); // Render as SVG string const svg = await diagram.render(); // Or render as data URL for direct use const dataUrl = await diagram.render({ dataUrl: true }); // Display in browser const img = document.createElement("img"); img.src = dataUrl; document.body.appendChild(img); await diagram.save("architecture.svg"); diagram.destroy(); ``` --- # Clusters Clusters allow you to group related nodes together visually. ## Creating a Cluster[​](#creating-a-cluster "Direct link to Creating a Cluster") ``` import { Diagram } from "diagrams-js"; import { ECS } from "diagrams-js/aws/compute"; const diagram = Diagram("Clustered Services"); const cluster = diagram.cluster("Services"); const web1 = cluster.add(ECS("web1")); const web2 = cluster.add(ECS("web2")); ``` ## Nested Clusters[​](#nested-clusters "Direct link to Nested Clusters") ``` const outer = diagram.cluster("Production"); const inner = outer.cluster("Services"); const service = inner.add(ECS("API")); ``` ## Cluster with Connections[​](#cluster-with-connections "Direct link to Cluster with Connections") ``` const frontend = diagram.cluster("Frontend"); const backend = diagram.cluster("Backend"); const web = frontend.add(ECS("Web")); const api = backend.add(ECS("API")); web.to(api); ``` ## Full Example[​](#full-example "Direct link to Full Example") ``` import { Diagram } from "diagrams-js"; import { ECS } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { ALB } from "diagrams-js/aws/network"; const diagram = Diagram("Full Architecture"); const lb = diagram.add(ALB("Load Balancer")); const webCluster = diagram.cluster("Web Tier"); const web1 = webCluster.add(ECS("web1")); const web2 = webCluster.add(ECS("web2")); const dbCluster = diagram.cluster("Database Tier"); const primary = dbCluster.add(RDS("Primary")); const replica = dbCluster.add(RDS("Replica")); lb.to([web1, web2]); web1.to(primary); web2.to(primary); primary.with(replica); const svg = await diagram.render(); ``` --- # Custom Nodes Use the `Custom` function to create nodes with your own icons from URLs, local files, or data URLs. ## From Remote URL[​](#from-remote-url "Direct link to From Remote URL") ``` import { Diagram, Custom } from "diagrams-js"; const diagram = Diagram("Custom Icons"); const service = diagram.add(Custom("My Service", "https://example.com/icon.png")); ``` ## From Data URL[​](#from-data-url "Direct link to From Data URL") ``` const iconData = "data:image/png;base64,iVBORw0KGgo..."; const node = diagram.add(Custom("Embedded", iconData)); ``` ## With Clusters[​](#with-clusters "Direct link to With Clusters") ``` const cluster = diagram.cluster("External Services"); const openstack = cluster.add(Custom("OpenStack", "https://example.com/openstack.png")); const elastic = cluster.add(Custom("Elastic", "https://example.com/elastic.png")); openstack.to(elastic); ``` ## Supported Formats[​](#supported-formats "Direct link to Supported Formats") * PNG * JPEG/JPG * GIF * SVG * WebP ## Notes[​](#notes "Direct link to Notes") * In browsers: Icons are fetched from URLs * In Node.js: Icons can be loaded from local files or URLs * Icons are automatically converted to data URLs for embedding --- # Diagrams `Diagram` is the primary object representing a diagram. ## Basic Usage[​](#basic-usage "Direct link to Basic Usage") `Diagram` represents a global diagram context. You create a diagram by calling the `Diagram` function. The first parameter will be used to generate the output filename. ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; const diagram = Diagram("Simple Diagram"); diagram.add(EC2("web")); const svg = await diagram.render(); ``` This generates an SVG diagram with a single `EC2` node. ## Options[​](#options "Direct link to Options") ### Direction[​](#direction "Direct link to Direction") Control the layout direction of the diagram: ``` const diagram = Diagram("My Diagram", { direction: "LR", // Left to Right (default) // direction: "TB" // Top to Bottom // direction: "BT" // Bottom to Top // direction: "RL" // Right to Left }); ``` ### Curve Style[​](#curve-style "Direct link to Curve Style") Control how edges are drawn: ``` const diagram = Diagram("My Diagram", { curvestyle: "ortho", // Orthogonal lines (default) // curvestyle: "curved" // Curved lines // curvestyle: "spline" // Spline curves // curvestyle: "polyline" // Polyline }); ``` See [Graphviz splines documentation](https://graphviz.org/docs/attrs/splines/) for more details. ### Theme[​](#theme "Direct link to Theme") Choose a color theme for clusters: ``` const diagram = Diagram("My Diagram", { theme: "pastel", // Default // theme: "neutral" // theme: "blues" // theme: "greens" // theme: "orange" }); ``` ### Filename[​](#filename "Direct link to Filename") Specify a custom filename for saving: ``` const diagram = Diagram("My Diagram", { filename: "my_custom_name", // Will save as my_custom_name.svg }); ``` ### Custom Attributes[​](#custom-attributes "Direct link to Custom Attributes") Pass custom Graphviz attributes: ``` const diagram = Diagram("My Diagram", { graphAttr: { fontsize: "15", bgcolor: "transparent", }, nodeAttr: { style: "filled", }, edgeAttr: { color: "red", style: "dashed", }, }); ``` See [Graphviz attributes reference](https://graphviz.org/doc/info/attrs.html) for available options including custom attributes for [graphs](https://graphviz.org/docs/graph/), [nodes](https://graphviz.org/docs/nodes/), and [edges](https://graphviz.org/docs/edges/). ## Methods[​](#methods "Direct link to Methods") ### add(node)[​](#addnode "Direct link to add(node)") Add a node to the diagram: ``` const server = diagram.add(EC2("Web Server")); ``` ### cluster(label)[​](#clusterlabel "Direct link to cluster(label)") Create a cluster (group) of nodes: ``` const cluster = diagram.cluster("Services"); const web = cluster.add(EC2("Web")); ``` ### render(options?)[​](#renderoptions "Direct link to render(options?)") Render the diagram to SVG or other formats: ``` // Render as SVG (default) const svg = await diagram.render(); // Render as PNG const png = await diagram.render({ format: "png" }); // Render as DOT const dot = await diagram.render({ format: "dot" }); ``` ### save(filepath?)[​](#savefilepath "Direct link to save(filepath?)") Save the diagram to a file. The behavior differs based on the environment: **Node.js**: Writes the file to disk using the filesystem. **Browsers**: Triggers a file download to the user's device. ``` // Auto-detect format from extension await diagram.save("diagram.svg"); await diagram.save("diagram.png"); // Or use the default filename await diagram.save(); ``` You can also specify render options: ``` // Save as PNG with specific dimensions await diagram.save("diagram.png", { format: "png", width: 1200, height: 800, }); ``` ### destroy()[​](#destroy "Direct link to destroy()") Clean up resources when done: ``` diagram.destroy(); ``` ## Complete Example[​](#complete-example "Direct link to Complete Example") ``` import { Diagram } from "diagrams-js"; import { EC2, Lambda } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { S3 } from "diagrams-js/aws/storage"; const diagram = Diagram("Web Architecture", { direction: "TB", theme: "pastel", graphAttr: { fontsize: "20", }, }); const web = diagram.add(EC2("Web Server")); const api = diagram.add(Lambda("API")); const db = diagram.add(RDS("Database")); const storage = diagram.add(S3("Storage")); web.to(api).to(db); api.to(storage); const svg = await diagram.render(); await diagram.save("web-architecture.svg"); diagram.destroy(); ``` ## Browser Integration[​](#browser-integration "Direct link to Browser Integration") In browsers, you can display the diagram directly: ``` const svg = await diagram.render(); document.getElementById("diagram-container").innerHTML = svg; ``` --- # Edges `Edge` represents a connection between nodes with additional properties. ## Basic Usage[​](#basic-usage "Direct link to Basic Usage") An edge object contains attributes like **label**, **color**, and **style**. These mirror the corresponding [Graphviz edge attributes](https://graphviz.org/docs/edges/). ``` import { Diagram, Edge } from "diagrams-js"; import { Nginx } from "diagrams-js/onprem/network"; import { Grafana, Prometheus } from "diagrams-js/onprem/monitoring"; const diagram = Diagram("Monitoring"); const metrics = diagram.add(Prometheus("metric")); const grafana = diagram.add(Grafana("monitoring")); // Create a colored, dashed edge grafana.to(Edge({ color: "firebrick", style: "dashed" }), metrics); ``` ## Edge Properties[​](#edge-properties "Direct link to Edge Properties") ### Label[​](#label "Direct link to Label") Add text labels to edges: ``` aggregator.to(Edge({ label: "parse" }), kafka); ``` ### Color[​](#color "Direct link to Color") Set edge colors: ``` web.to(Edge({ color: "blue" }), api); api.to(Edge({ color: "green" }), db); ``` ### Style[​](#style "Direct link to Style") Choose from various styles: ``` // Dashed line primary.with(Edge({ style: "dashed" }), replica); // Dotted line primary.with(Edge({ style: "dotted" }), replica); // Bold line primary.with(Edge({ style: "bold" }), replica); // Solid line (default) primary.with(Edge({ style: "solid" }), replica); ``` See [Graphviz style attribute](https://graphviz.org/docs/attrs/style/) for more options. ### Direction[​](#direction "Direct link to Direction") Control arrow direction: ``` // Forward arrow (default) Edge({ forward: true }); // Reverse arrow Edge({ reverse: true }); // Bidirectional Edge({ forward: true, reverse: true }); // No arrows Edge({}); // Neither forward nor reverse ``` ## Combining Properties[​](#combining-properties "Direct link to Combining Properties") Combine multiple properties: ``` import { Redis } from "diagrams-js/onprem/inmemory"; const diagram = Diagram("Database Cluster"); const primary = diagram.add(Redis("session")); const replica = diagram.add(Redis("replica")); // Colored, dashed connection primary.with(Edge({ color: "brown", style: "dashed" }), replica); // With label replica.from(Edge({ label: "collect", color: "blue" }), metrics); ``` ## Edge Chaining[​](#edge-chaining "Direct link to Edge Chaining") Edges can be chained for complex connections: ``` aggregator.to(Edge({ label: "parse" }), kafka).to(Edge({ color: "black", style: "bold" }), spark); ``` ## Multiple Targets with Edges[​](#multiple-targets-with-edges "Direct link to Multiple Targets with Edges") Apply the same edge style to multiple connections: ``` const grpcsvc = [ diagram.add(Server("grpc1")), diagram.add(Server("grpc2")), diagram.add(Server("grpc3")), ]; // All connections use brown color grpcsvc.forEach((svc) => svc.to(Edge({ color: "brown" }), sessionPrimary)); ``` ## Advanced Example[​](#advanced-example "Direct link to Advanced Example") ``` import { Diagram, Edge } from "diagrams-js"; import { Spark } from "diagrams-js/onprem/analytics"; import { Server } from "diagrams-js/onprem/compute"; import { PostgreSQL } from "diagrams-js/onprem/database"; import { Redis } from "diagrams-js/onprem/inmemory"; import { Fluentd } from "diagrams-js/onprem/aggregator"; import { Grafana, Prometheus } from "diagrams-js/onprem/monitoring"; import { Nginx } from "diagrams-js/onprem/network"; import { Kafka } from "diagrams-js/onprem/queue"; const diagram = Diagram("Advanced Web Service with On-Premises (colored)"); const ingress = diagram.add(Nginx("ingress")); const metrics = diagram.add(Prometheus("metric")); const grafana = diagram.add(Grafana("monitoring")); // Red dashed line from Grafana to Prometheus grafana.to(Edge({ color: "firebrick", style: "dashed" }), metrics); const serviceCluster = diagram.cluster("Service Cluster"); const grpcsvc = [ serviceCluster.add(Server("grpc1")), serviceCluster.add(Server("grpc2")), serviceCluster.add(Server("grpc3")), ]; const sessionsCluster = diagram.cluster("Sessions HA"); const sessionPrimary = sessionsCluster.add(Redis("session")); const sessionReplica = sessionsCluster.add(Redis("replica")); // Brown dashed line for session replication sessionPrimary.with(Edge({ color: "brown", style: "dashed" }), sessionReplica); // Labelled edge from replica to metrics sessionReplica.from(Edge({ label: "collect" }), metrics); grpcsvc.forEach((svc) => svc.to(Edge({ color: "brown" }), sessionPrimary)); const dbCluster = diagram.cluster("Database HA"); const dbPrimary = dbCluster.add(PostgreSQL("users")); const dbReplica = dbCluster.add(PostgreSQL("replica")); // Brown dotted line for DB replication dbPrimary.with(Edge({ color: "brown", style: "dotted" }), dbReplica); // Labelled edge from replica to metrics dbReplica.from(Edge({ label: "collect" }), metrics); grpcsvc.forEach((svc) => svc.to(Edge({ color: "black" }), dbPrimary)); const aggregator = diagram.add(Fluentd("logging")); const kafka = diagram.add(Kafka("stream")); const spark = diagram.add(Spark("analytics")); // Labelled and styled edges aggregator.to(Edge({ label: "parse" }), kafka); kafka.to(Edge({ color: "black", style: "bold" }), spark); // Bidirectional edges with color grpcsvc.forEach((svc) => { ingress.to(Edge({ color: "darkgreen", forward: true, reverse: true }), svc); }); grpcsvc.forEach((svc) => svc.to(Edge({ color: "darkorange" }), aggregator)); const svg = await diagram.render(); ``` ## Custom Attributes[​](#custom-attributes "Direct link to Custom Attributes") You can pass any Graphviz edge attribute: ``` Edge({ label: "data", color: "red", style: "dashed", penwidth: "2", // Line thickness arrowhead: "vee", // Arrowhead style arrowsize: "1.5", // Arrow size minlen: "2", // Minimum edge length }); ``` See [Graphviz edge attributes](https://graphviz.org/docs/edges/) for the complete list. --- # Migration from Python diagrams This guide helps you migrate from the Python diagrams library to diagrams-js. ## Syntax Differences[​](#syntax-differences "Direct link to Syntax Differences") ### Creating Diagrams[​](#creating-diagrams "Direct link to Creating Diagrams") **Python:** ``` from diagrams import Diagram from diagrams.aws.compute import EC2 with Diagram("My Diagram", show=False): EC2("web") ``` **TypeScript:** ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; const diagram = Diagram("My Diagram"); diagram.add(EC2("web")); const svg = await diagram.render(); ``` Key differences: * Use function call `Diagram()` instead of context manager `with Diagram()` * Explicitly add nodes with `diagram.add()` * Call `render()` and `destroy()` explicitly ### Creating Nodes[​](#creating-nodes "Direct link to Creating Nodes") **Python:** ``` web = EC2("Web Server") ``` **TypeScript:** ``` const web = diagram.add(EC2("Web Server")); ``` Key differences: * Always add nodes to diagram explicitly * Provider functions return node instances ### Connections[​](#connections "Direct link to Connections") | Python | TypeScript | | ------------------------- | ------------------------------------------ | | `node1 >> node2` | `node1.to(node2)` | | `node1 << node2` | `node1.from(node2)` | | `node1 - node2` | `node1.with(node2)` | | `node1 >> [node2, node3]` | `node1.to([node2, node3])` | | `node1 << [node2, node3]` | `node1.from([node2, node3])` | | `[node1, node2] >> node3` | `[node1, node2].forEach(n => n.to(node3))` | **Python:** ``` web >> api >> database api >> storage ``` **TypeScript:** ``` web.to(api).to(database); api.to(storage); ``` ### Clusters[​](#clusters "Direct link to Clusters") **Python:** ``` from diagrams import Cluster with Diagram("Services"): with Cluster("Web Tier"): web1 = EC2("web1") web2 = EC2("web2") ``` **TypeScript:** ``` import { Diagram } from "diagrams-js"; const diagram = Diagram("Services"); const webTier = diagram.cluster("Web Tier"); const web1 = webTier.add(EC2("web1")); const web2 = webTier.add(EC2("web2")); ``` Key differences: * Call `diagram.cluster()` to create a cluster * Add nodes to cluster with `cluster.add()` ### Nested Clusters[​](#nested-clusters "Direct link to Nested Clusters") **Python:** ``` with Cluster("Production"): with Cluster("Services"): api = ECS("api") ``` **TypeScript:** ``` const production = diagram.cluster("Production"); const services = production.cluster("Services"); const api = services.add(ECS("api")); ``` ### Edges[​](#edges "Direct link to Edges") **Python:** ``` from diagrams import Edge web >> Edge(color="red") >> db ``` **TypeScript:** ``` import { Edge } from "diagrams-js"; web.to(Edge({ color: "red" }), db); ``` Key differences: * Use object notation for options: `Edge({ color: "red" })` * Pass edge as first argument to `to()`, `from()`, or `with()` ### Custom Nodes[​](#custom-nodes "Direct link to Custom Nodes") **Python:** ``` from diagrams.custom import Custom with Diagram("Custom"): prod = Custom("Product", "https://mywebsite.com/icon.png") ``` **TypeScript:** ``` import { Custom } from "diagrams-js"; const diagram = Diagram("Custom"); const prod = diagram.add(Custom("Product", "https://mywebsite.com/icon.png")); ``` ## Import Paths[​](#import-paths "Direct link to Import Paths") Provider import paths follow the same pattern: | Python | TypeScript | | --------------------------------------- | ------------------------------------------------ | | `from diagrams.aws.compute import EC2` | `import { EC2 } from "diagrams-js/aws/compute"` | | `from diagrams.aws.database import RDS` | `import { RDS } from "diagrams-js/aws/database"` | | `from diagrams.gcp.compute import GCE` | `import { GCE } from "diagrams-js/gcp/compute"` | | `from diagrams.k8s.compute import Pod` | `import { Pod } from "diagrams-js/k8s/compute"` | ## Full Migration Example[​](#full-migration-example "Direct link to Full Migration Example") **Python:** ``` from diagrams import Diagram, Cluster, Edge from diagrams.aws.compute import EC2, ECS from diagrams.aws.database import RDS from diagrams.aws.network import ELB with Diagram("Web Services", show=False): lb = ELB("lb") with Cluster("Services"): web1 = ECS("web1") web2 = ECS("web2") db = RDS("database") lb >> [web1, web2] web1 >> Edge(color="red") >> db web2 >> Edge(color="red") >> db ``` **TypeScript:** ``` import { Diagram, Edge } from "diagrams-js"; import { EC2, ECS } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { ELB } from "diagrams-js/aws/network"; const diagram = Diagram("Web Services"); const lb = diagram.add(ELB("lb")); const services = diagram.cluster("Services"); const web1 = services.add(ECS("web1")); const web2 = services.add(ECS("web2")); const db = diagram.add(RDS("database")); lb.to([web1, web2]); web1.to(Edge({ color: "red" }), db); web2.to(Edge({ color: "red" }), db); const svg = await diagram.render(); diagram.destroy(); ``` ## Missing Features[​](#missing-features "Direct link to Missing Features") Some Python features are not implemented: * Automatic file opening (use `save()` instead) * Multiple output formats at once (call `render()` multiple times) ## New Features[​](#new-features "Direct link to New Features") TypeScript version has some unique features: * Browser support - runs directly in browsers * Dependency-free - no extra dependencies needed for browsers and SVG rendering in Node.js * Render as [Data URL](/docs/guides/rendering#render-as-data-url) - returns base64 data URL for easy embedding in HTML * Type safety - full TypeScript support with IDE autocompletion ## Getting Help[​](#getting-help "Direct link to Getting Help") * [Documentation](/docs/getting-started/installation) - Full documentation * [Examples](/docs/getting-started/examples) - More examples * [API Reference](/docs/guides/diagram) - Complete API * [GitHub Issues](https://github.com/hatemhosny/diagrams-js/issues) - Report issues --- # Nodes `Node` is an object representing a node or system component. ## Basic Usage[​](#basic-usage "Direct link to Basic Usage") A node object consists of three parts: **provider**, **resource type**, and **name**. You create nodes by calling provider functions: ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; const diagram = Diagram("Simple Diagram"); const server = diagram.add(EC2("web")); ``` In this example, `EC2` is a node of resource type `compute` provided by `aws`. ## Available Providers[​](#available-providers "Direct link to Available Providers") You can use nodes from any supported [provider](/docs/guides/providers): ``` // AWS resources import { ECS, Lambda } from "diagrams-js/aws/compute"; import { RDS, ElastiCache } from "diagrams-js/aws/database"; import { ELB, Route53, VPC } from "diagrams-js/aws/network"; // Azure resources import { FunctionApps } from "diagrams-js/azure/compute"; import { BlobStorage } from "diagrams-js/azure/storage"; // GCP resources import { AppEngine, GKE } from "diagrams-js/gcp/compute"; import { AutoML } from "diagrams-js/gcp/ml"; // Kubernetes resources import { Pod, StatefulSet } from "diagrams-js/k8s/compute"; import { Service } from "diagrams-js/k8s/network"; import { PV, PVC, StorageClass } from "diagrams-js/k8s/storage"; ``` See the [Providers](/docs/guides/providers) section for a complete list. ## Data Flow[​](#data-flow "Direct link to Data Flow") You can represent data flow by connecting nodes with the methods `to()`, `from()`, and `with()`. ### Forward Direction (to)[​](#forward-direction-to "Direct link to Forward Direction (to)") Connect nodes from left to right: ``` web.to(api).to(database); ``` This creates a chain: web → api → database ### Reverse Direction (from)[​](#reverse-direction-from "Direct link to Reverse Direction (from)") Connect nodes from right to left: ``` database.from(api); // Creates: api → database with reverse arrow database.from([backup1, backup2]); // Multiple sources ``` ### Undirected (with)[​](#undirected-with "Direct link to Undirected (with)") Connect nodes with no direction: ``` primary.with(replica); ``` This creates a connection without arrowheads. ## Multiple Connections[​](#multiple-connections "Direct link to Multiple Connections") Connect one node to multiple targets: ``` loadBalancer.to([server1, server2, server3]); ``` ## Chaining[​](#chaining "Direct link to Chaining") Chain multiple connections together: ``` client .to(loadBalancer) .to([web1, web2]) .forEach((web) => web.to(api)); ``` ## Direction Control[​](#direction-control "Direct link to Direction Control") Change the overall diagram direction: ``` const diagram = Diagram("Workers", { direction: "TB", // Top to Bottom }); const lb = diagram.add(ELB("lb")); const worker1 = diagram.add(EC2("worker1")); const worker2 = diagram.add(EC2("worker2")); const db = diagram.add(RDS("events")); lb.to(worker1).to(db); lb.to(worker2).to(db); ``` ## Complete Example[​](#complete-example "Direct link to Complete Example") ``` import { Diagram } from "diagrams-js"; import { EC2 } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { ELB } from "diagrams-js/aws/network"; import { S3 } from "diagrams-js/aws/storage"; const diagram = Diagram("Web Services", { direction: "LR" }); const lb = diagram.add(ELB("lb")); const web = diagram.add(EC2("web")); const db = diagram.add(RDS("userdb")); const storage = diagram.add(S3("store")); // Forward flow lb.to(web).to(db).to(storage); // Multiple paths const stats = diagram.add(EC2("stat")); web.to(db).from(stats); // stats also connects to db // Bidirectional web.with(db); // Undirected connection const svg = await diagram.render(); ``` ## Notes[​](#notes "Direct link to Notes") * The order of rendered diagrams is not guaranteed * Use `direction` option to control the overall layout * Node connections create directed graph edges --- # Providers diagrams-js includes 17 providers with over 2000 node classes. ## Available Providers[​](#available-providers "Direct link to Available Providers") | Provider | Description | | ---------------------------------------- | ---------------------------------------- | | [AWS](/docs/nodes/aws) | Amazon Web Services nodes | | [Azure](/docs/nodes/azure) | Microsoft Azure nodes | | [GCP](/docs/nodes/gcp) | Google Cloud Platform nodes | | [Kubernetes](/docs/nodes/k8s) | Kubernetes nodes | | [OnPrem](/docs/nodes/onprem) | On-premises infrastructure nodes | | [AlibabaCloud](/docs/nodes/alibabacloud) | Alibaba Cloud nodes | | [DigitalOcean](/docs/nodes/digitalocean) | DigitalOcean nodes | | [Elastic](/docs/nodes/elastic) | Elastic Stack nodes | | [Firebase](/docs/nodes/firebase) | Firebase nodes | | [Generic](/docs/nodes/generic) | Generic computing nodes | | [GIS](/docs/nodes/gis) | GIS nodes | | [IBM](/docs/nodes/ibm) | IBM Cloud nodes | | [OCI](/docs/nodes/oci) | Oracle Cloud Infrastructure nodes | | [OpenStack](/docs/nodes/openstack) | OpenStack nodes | | [Outscale](/docs/nodes/outscale) | Outscale nodes | | [Programming](/docs/nodes/programming) | Programming language and framework nodes | | [SaaS](/docs/nodes/saas) | SaaS application nodes | | [C4 Model](/docs/nodes/c4) | C4 model for software architecture | ## Usage[​](#usage "Direct link to Usage") ``` import { EC2, Lambda } from "diagrams-js/aws/compute"; import { RDS } from "diagrams-js/aws/database"; import { GCE } from "diagrams-js/gcp/compute"; ``` ## Provider Structure[​](#provider-structure "Direct link to Provider Structure") Each provider is organized by service category: ``` providers/aws/ ├── compute.ts # EC2, Lambda, ECS, etc. ├── database.ts # RDS, DynamoDB, etc. ├── storage.ts # S3, EBS, etc. └── ... ``` --- # Rendering ## Render to SVG[​](#render-to-svg "Direct link to Render to SVG") ``` const diagram = Diagram("My Diagram"); // ... add nodes const svg = await diagram.render(); // Returns SVG string ``` ## Render to PNG[​](#render-to-png "Direct link to Render to PNG") ``` const png = await diagram.render({ format: "png" }); // Returns Uint8Array ``` ## Render to JPG[​](#render-to-jpg "Direct link to Render to JPG") ``` const jpg = await diagram.render({ format: "jpg" }); // Returns Uint8Array ``` ## Render as Data URL[​](#render-as-data-url "Direct link to Render as Data URL") Get the diagram as a base64 data URL for direct use in HTML: ``` // SVG as data URL const svgDataUrl = await diagram.render({ dataUrl: true }); // Returns: data:image/svg+xml;base64,... // PNG as data URL const pngDataUrl = await diagram.render({ format: "png", dataUrl: true }); // Returns: data:image/png;base64,... // JPG as data URL const jpgDataUrl = await diagram.render({ format: "jpg", dataUrl: true }); // Returns: data:image/jpeg;base64,... ``` ### Browser Usage with Data URLs[​](#browser-usage-with-data-urls "Direct link to Browser Usage with Data URLs") Use data URLs to display diagrams in `` tags or download them: ``` const dataUrl = await diagram.render({ dataUrl: true }); // Display in an image element const img = document.createElement("img"); img.src = dataUrl; document.body.appendChild(img); // Or create a download link const link = document.createElement("a"); link.href = dataUrl; link.download = "diagram.svg"; link.click(); ``` ## Save to File[​](#save-to-file "Direct link to Save to File") ``` // Auto-detects format from extension await diagram.save("diagram.svg"); await diagram.save("diagram.png"); ``` ## Render Options[​](#render-options "Direct link to Render Options") ``` const svg = await diagram.render({ format: "svg", // 'svg' | 'png' | 'jpg' | 'dot' width: 800, // Output width (for PNG/JPG) height: 600, // Output height (for PNG/JPG) scale: 2, // Scale factor (default: 2 for PNG/JPG) dataUrl: true, // Return as base64 data URL }); ``` ## Browser Usage[​](#browser-usage "Direct link to Browser Usage") ``` // Get SVG string const svg = await diagram.render(); // Insert into DOM document.getElementById("diagram").innerHTML = svg; ``` ## Node.js Usage[​](#nodejs-usage "Direct link to Node.js Usage") ``` import { writeFile } from "fs/promises"; const svg = await diagram.render(); await writeFile("output.svg", svg); const png = await diagram.render({ format: "png" }); await writeFile("output.png", Buffer.from(png)); ``` --- # Alibaba Cloud Node classes list for the Alibaba Cloud provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { AnalyticDb, ClickHouse, DataLakeAnalytics } from "diagrams-js/alibabacloud/analytics"; import { ApiGateway, BeeBot, BlockchainAsAService } from "diagrams-js/alibabacloud/application"; const diagram = Diagram("Alibaba Cloud Architecture", { direction: "TB" }); const node1 = diagram.add(AnalyticDb("Node 1")); const node2 = diagram.add(ApiGateway("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/alibabacloud) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### alibabacloud/analytics[​](#alibabacloudanalytics "Direct link to alibabacloud/analytics") ![AnalyticDb](/resources/alibabacloud/analytics/analytic-db.png) **AnalyticDb** ``` import { AnalyticDb } from "diagrams-js/alibabacloud/analytics"; ``` ![ClickHouse](/resources/alibabacloud/analytics/click-house.png) **ClickHouse** ``` import { ClickHouse } from "diagrams-js/alibabacloud/analytics"; ``` ![DataLakeAnalytics](/resources/alibabacloud/analytics/data-lake-analytics.png) **DataLakeAnalytics** ``` import { DataLakeAnalytics } from "diagrams-js/alibabacloud/analytics"; ``` ![ElaticMapReduce](/resources/alibabacloud/analytics/elatic-map-reduce.png) **ElaticMapReduce** ``` import { ElaticMapReduce } from "diagrams-js/alibabacloud/analytics"; ``` ![OpenSearch](/resources/alibabacloud/analytics/open-search.png) **OpenSearch** ``` import { OpenSearch } from "diagrams-js/alibabacloud/analytics"; ``` ### alibabacloud/application[​](#alibabacloudapplication "Direct link to alibabacloud/application") ![ApiGateway](/resources/alibabacloud/application/api-gateway.png) **ApiGateway** ``` import { ApiGateway } from "diagrams-js/alibabacloud/application"; ``` ![BeeBot](/resources/alibabacloud/application/bee-bot.png) **BeeBot** ``` import { BeeBot } from "diagrams-js/alibabacloud/application"; ``` ![BlockchainAsAService](/resources/alibabacloud/application/blockchain-as-a-service.png) **BlockchainAsAService** ``` import { BlockchainAsAService } from "diagrams-js/alibabacloud/application"; ``` ![CloudCallCenter](/resources/alibabacloud/application/cloud-call-center.png) **CloudCallCenter** ``` import { CloudCallCenter } from "diagrams-js/alibabacloud/application"; ``` ![CodePipeline](/resources/alibabacloud/application/code-pipeline.png) **CodePipeline** ``` import { CodePipeline } from "diagrams-js/alibabacloud/application"; ``` ![DirectMail](/resources/alibabacloud/application/direct-mail.png) **DirectMail** ``` import { DirectMail } from "diagrams-js/alibabacloud/application"; ``` ![LogService](/resources/alibabacloud/application/log-service.png) **LogService** ``` import { LogService } from "diagrams-js/alibabacloud/application"; ``` ![MessageNotificationService](/resources/alibabacloud/application/message-notification-service.png) **MessageNotificationService** ``` import { MessageNotificationService } from "diagrams-js/alibabacloud/application"; ``` ![NodeJsPerformancePlatform](/resources/alibabacloud/application/node-js-performance-platform.png) **NodeJsPerformancePlatform** ``` import { NodeJsPerformancePlatform } from "diagrams-js/alibabacloud/application"; ``` ![OpenSearch](/resources/alibabacloud/application/open-search.png) **OpenSearch** ``` import { OpenSearch } from "diagrams-js/alibabacloud/application"; ``` ![PerformanceTestingService](/resources/alibabacloud/application/performance-testing-service.png) **PerformanceTestingService** ``` import { PerformanceTestingService } from "diagrams-js/alibabacloud/application"; ``` ![RdCloud](/resources/alibabacloud/application/rd-cloud.png) **RdCloud** ``` import { RdCloud } from "diagrams-js/alibabacloud/application"; ``` ![SmartConversationAnalysis](/resources/alibabacloud/application/smart-conversation-analysis.png) **SmartConversationAnalysis** ``` import { SmartConversationAnalysis } from "diagrams-js/alibabacloud/application"; ``` ![Yida](/resources/alibabacloud/application/yida.png) **Yida** ``` import { Yida } from "diagrams-js/alibabacloud/application"; ``` ### alibabacloud/communication[​](#alibabacloudcommunication "Direct link to alibabacloud/communication") ![DirectMail](/resources/alibabacloud/communication/direct-mail.png) **DirectMail** ``` import { DirectMail } from "diagrams-js/alibabacloud/communication"; ``` ![MobilePush](/resources/alibabacloud/communication/mobile-push.png) **MobilePush** ``` import { MobilePush } from "diagrams-js/alibabacloud/communication"; ``` ### alibabacloud/compute[​](#alibabacloudcompute "Direct link to alibabacloud/compute") ![AutoScaling](/resources/alibabacloud/compute/auto-scaling.png) **AutoScaling** ``` import { AutoScaling } from "diagrams-js/alibabacloud/compute"; ``` ![BatchCompute](/resources/alibabacloud/compute/batch-compute.png) **BatchCompute** ``` import { BatchCompute } from "diagrams-js/alibabacloud/compute"; ``` ![ContainerRegistry](/resources/alibabacloud/compute/container-registry.png) **ContainerRegistry** ``` import { ContainerRegistry } from "diagrams-js/alibabacloud/compute"; ``` ![ContainerService](/resources/alibabacloud/compute/container-service.png) **ContainerService** ``` import { ContainerService } from "diagrams-js/alibabacloud/compute"; ``` ![ElasticComputeService](/resources/alibabacloud/compute/elastic-compute-service.png) **ElasticComputeService** ``` import { ElasticComputeService } from "diagrams-js/alibabacloud/compute"; ``` ![ElasticContainerInstance](/resources/alibabacloud/compute/elastic-container-instance.png) **ElasticContainerInstance** ``` import { ElasticContainerInstance } from "diagrams-js/alibabacloud/compute"; ``` ![ElasticHighPerformanceComputing](/resources/alibabacloud/compute/elastic-high-performance-computing.png) **ElasticHighPerformanceComputing** ``` import { ElasticHighPerformanceComputing } from "diagrams-js/alibabacloud/compute"; ``` ![ElasticSearch](/resources/alibabacloud/compute/elastic-search.png) **ElasticSearch** ``` import { ElasticSearch } from "diagrams-js/alibabacloud/compute"; ``` ![FunctionCompute](/resources/alibabacloud/compute/function-compute.png) **FunctionCompute** ``` import { FunctionCompute } from "diagrams-js/alibabacloud/compute"; ``` ![OperationOrchestrationService](/resources/alibabacloud/compute/operation-orchestration-service.png) **OperationOrchestrationService** ``` import { OperationOrchestrationService } from "diagrams-js/alibabacloud/compute"; ``` ![ResourceOrchestrationService](/resources/alibabacloud/compute/resource-orchestration-service.png) **ResourceOrchestrationService** ``` import { ResourceOrchestrationService } from "diagrams-js/alibabacloud/compute"; ``` ![ServerLoadBalancer](/resources/alibabacloud/compute/server-load-balancer.png) **ServerLoadBalancer** ``` import { ServerLoadBalancer } from "diagrams-js/alibabacloud/compute"; ``` ![ServerlessAppEngine](/resources/alibabacloud/compute/serverless-app-engine.png) **ServerlessAppEngine** ``` import { ServerlessAppEngine } from "diagrams-js/alibabacloud/compute"; ``` ![SimpleApplicationServer](/resources/alibabacloud/compute/simple-application-server.png) **SimpleApplicationServer** ``` import { SimpleApplicationServer } from "diagrams-js/alibabacloud/compute"; ``` ![WebAppService](/resources/alibabacloud/compute/web-app-service.png) **WebAppService** ``` import { WebAppService } from "diagrams-js/alibabacloud/compute"; ``` ### alibabacloud/database[​](#alibabaclouddatabase "Direct link to alibabacloud/database") ![ApsaradbCassandra](/resources/alibabacloud/database/apsaradb-cassandra.png) **ApsaradbCassandra** ``` import { ApsaradbCassandra } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbHbase](/resources/alibabacloud/database/apsaradb-hbase.png) **ApsaradbHbase** ``` import { ApsaradbHbase } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbMemcache](/resources/alibabacloud/database/apsaradb-memcache.png) **ApsaradbMemcache** ``` import { ApsaradbMemcache } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbMongodb](/resources/alibabacloud/database/apsaradb-mongodb.png) **ApsaradbMongodb** ``` import { ApsaradbMongodb } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbOceanbase](/resources/alibabacloud/database/apsaradb-oceanbase.png) **ApsaradbOceanbase** ``` import { ApsaradbOceanbase } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbPolardb](/resources/alibabacloud/database/apsaradb-polardb.png) **ApsaradbPolardb** ``` import { ApsaradbPolardb } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbPostgresql](/resources/alibabacloud/database/apsaradb-postgresql.png) **ApsaradbPostgresql** ``` import { ApsaradbPostgresql } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbPpas](/resources/alibabacloud/database/apsaradb-ppas.png) **ApsaradbPpas** ``` import { ApsaradbPpas } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbRedis](/resources/alibabacloud/database/apsaradb-redis.png) **ApsaradbRedis** ``` import { ApsaradbRedis } from "diagrams-js/alibabacloud/database"; ``` ![ApsaradbSqlserver](/resources/alibabacloud/database/apsaradb-sqlserver.png) **ApsaradbSqlserver** ``` import { ApsaradbSqlserver } from "diagrams-js/alibabacloud/database"; ``` ![DataManagementService](/resources/alibabacloud/database/data-management-service.png) **DataManagementService** ``` import { DataManagementService } from "diagrams-js/alibabacloud/database"; ``` ![DataTransmissionService](/resources/alibabacloud/database/data-transmission-service.png) **DataTransmissionService** ``` import { DataTransmissionService } from "diagrams-js/alibabacloud/database"; ``` ![DatabaseBackupService](/resources/alibabacloud/database/database-backup-service.png) **DatabaseBackupService** ``` import { DatabaseBackupService } from "diagrams-js/alibabacloud/database"; ``` ![DisributeRelationalDatabaseService](/resources/alibabacloud/database/disribute-relational-database-service.png) **DisributeRelationalDatabaseService** ``` import { DisributeRelationalDatabaseService } from "diagrams-js/alibabacloud/database"; ``` ![GraphDatabaseService](/resources/alibabacloud/database/graph-database-service.png) **GraphDatabaseService** ``` import { GraphDatabaseService } from "diagrams-js/alibabacloud/database"; ``` ![HybriddbForMysql](/resources/alibabacloud/database/hybriddb-for-mysql.png) **HybriddbForMysql** ``` import { HybriddbForMysql } from "diagrams-js/alibabacloud/database"; ``` ![RelationalDatabaseService](/resources/alibabacloud/database/relational-database-service.png) **RelationalDatabaseService** ``` import { RelationalDatabaseService } from "diagrams-js/alibabacloud/database"; ``` ### alibabacloud/iot[​](#alibabacloudiot "Direct link to alibabacloud/iot") ![IotInternetDeviceId](/resources/alibabacloud/iot/iot-internet-device-id.png) **IotInternetDeviceId** ``` import { IotInternetDeviceId } from "diagrams-js/alibabacloud/iot"; ``` ![IotLinkWan](/resources/alibabacloud/iot/iot-link-wan.png) **IotLinkWan** ``` import { IotLinkWan } from "diagrams-js/alibabacloud/iot"; ``` ![IotMobileConnectionPackage](/resources/alibabacloud/iot/iot-mobile-connection-package.png) **IotMobileConnectionPackage** ``` import { IotMobileConnectionPackage } from "diagrams-js/alibabacloud/iot"; ``` ![IotPlatform](/resources/alibabacloud/iot/iot-platform.png) **IotPlatform** ``` import { IotPlatform } from "diagrams-js/alibabacloud/iot"; ``` ### alibabacloud/network[​](#alibabacloudnetwork "Direct link to alibabacloud/network") ![Cdn](/resources/alibabacloud/network/cdn.png) **Cdn** ``` import { Cdn } from "diagrams-js/alibabacloud/network"; ``` ![CloudEnterpriseNetwork](/resources/alibabacloud/network/cloud-enterprise-network.png) **CloudEnterpriseNetwork** ``` import { CloudEnterpriseNetwork } from "diagrams-js/alibabacloud/network"; ``` ![ElasticIpAddress](/resources/alibabacloud/network/elastic-ip-address.png) **ElasticIpAddress** ``` import { ElasticIpAddress } from "diagrams-js/alibabacloud/network"; ``` ![ExpressConnect](/resources/alibabacloud/network/express-connect.png) **ExpressConnect** ``` import { ExpressConnect } from "diagrams-js/alibabacloud/network"; ``` ![NatGateway](/resources/alibabacloud/network/nat-gateway.png) **NatGateway** ``` import { NatGateway } from "diagrams-js/alibabacloud/network"; ``` ![ServerLoadBalancer](/resources/alibabacloud/network/server-load-balancer.png) **ServerLoadBalancer** ``` import { ServerLoadBalancer } from "diagrams-js/alibabacloud/network"; ``` ![SmartAccessGateway](/resources/alibabacloud/network/smart-access-gateway.png) **SmartAccessGateway** ``` import { SmartAccessGateway } from "diagrams-js/alibabacloud/network"; ``` ![VirtualPrivateCloud](/resources/alibabacloud/network/virtual-private-cloud.png) **VirtualPrivateCloud** ``` import { VirtualPrivateCloud } from "diagrams-js/alibabacloud/network"; ``` ![VpnGateway](/resources/alibabacloud/network/vpn-gateway.png) **VpnGateway** ``` import { VpnGateway } from "diagrams-js/alibabacloud/network"; ``` ### alibabacloud/security[​](#alibabacloudsecurity "Direct link to alibabacloud/security") ![AntiBotService](/resources/alibabacloud/security/anti-bot-service.png) **AntiBotService** ``` import { AntiBotService } from "diagrams-js/alibabacloud/security"; ``` ![AntiDdosBasic](/resources/alibabacloud/security/anti-ddos-basic.png) **AntiDdosBasic** ``` import { AntiDdosBasic } from "diagrams-js/alibabacloud/security"; ``` ![AntiDdosPro](/resources/alibabacloud/security/anti-ddos-pro.png) **AntiDdosPro** ``` import { AntiDdosPro } from "diagrams-js/alibabacloud/security"; ``` ![AntifraudService](/resources/alibabacloud/security/antifraud-service.png) **AntifraudService** ``` import { AntifraudService } from "diagrams-js/alibabacloud/security"; ``` ![BastionHost](/resources/alibabacloud/security/bastion-host.png) **BastionHost** ``` import { BastionHost } from "diagrams-js/alibabacloud/security"; ``` ![CloudFirewall](/resources/alibabacloud/security/cloud-firewall.png) **CloudFirewall** ``` import { CloudFirewall } from "diagrams-js/alibabacloud/security"; ``` ![CloudSecurityScanner](/resources/alibabacloud/security/cloud-security-scanner.png) **CloudSecurityScanner** ``` import { CloudSecurityScanner } from "diagrams-js/alibabacloud/security"; ``` ![ContentModeration](/resources/alibabacloud/security/content-moderation.png) **ContentModeration** ``` import { ContentModeration } from "diagrams-js/alibabacloud/security"; ``` ![CrowdsourcedSecurityTesting](/resources/alibabacloud/security/crowdsourced-security-testing.png) **CrowdsourcedSecurityTesting** ``` import { CrowdsourcedSecurityTesting } from "diagrams-js/alibabacloud/security"; ``` ![DataEncryptionService](/resources/alibabacloud/security/data-encryption-service.png) **DataEncryptionService** ``` import { DataEncryptionService } from "diagrams-js/alibabacloud/security"; ``` ![DbAudit](/resources/alibabacloud/security/db-audit.png) **DbAudit** ``` import { DbAudit } from "diagrams-js/alibabacloud/security"; ``` ![GameShield](/resources/alibabacloud/security/game-shield.png) **GameShield** ``` import { GameShield } from "diagrams-js/alibabacloud/security"; ``` ![IdVerification](/resources/alibabacloud/security/id-verification.png) **IdVerification** ``` import { IdVerification } from "diagrams-js/alibabacloud/security"; ``` ![ManagedSecurityService](/resources/alibabacloud/security/managed-security-service.png) **ManagedSecurityService** ``` import { ManagedSecurityService } from "diagrams-js/alibabacloud/security"; ``` ![SecurityCenter](/resources/alibabacloud/security/security-center.png) **SecurityCenter** ``` import { SecurityCenter } from "diagrams-js/alibabacloud/security"; ``` ![ServerGuard](/resources/alibabacloud/security/server-guard.png) **ServerGuard** ``` import { ServerGuard } from "diagrams-js/alibabacloud/security"; ``` ![SslCertificates](/resources/alibabacloud/security/ssl-certificates.png) **SslCertificates** ``` import { SslCertificates } from "diagrams-js/alibabacloud/security"; ``` ![WebApplicationFirewall](/resources/alibabacloud/security/web-application-firewall.png) **WebApplicationFirewall** ``` import { WebApplicationFirewall } from "diagrams-js/alibabacloud/security"; ``` ### alibabacloud/storage[​](#alibabacloudstorage "Direct link to alibabacloud/storage") ![CloudStorageGateway](/resources/alibabacloud/storage/cloud-storage-gateway.png) **CloudStorageGateway** ``` import { CloudStorageGateway } from "diagrams-js/alibabacloud/storage"; ``` ![FileStorageHdfs](/resources/alibabacloud/storage/file-storage-hdfs.png) **FileStorageHdfs** ``` import { FileStorageHdfs } from "diagrams-js/alibabacloud/storage"; ``` ![FileStorageNas](/resources/alibabacloud/storage/file-storage-nas.png) **FileStorageNas** ``` import { FileStorageNas } from "diagrams-js/alibabacloud/storage"; ``` ![HybridBackupRecovery](/resources/alibabacloud/storage/hybrid-backup-recovery.png) **HybridBackupRecovery** ``` import { HybridBackupRecovery } from "diagrams-js/alibabacloud/storage"; ``` ![HybridCloudDisasterRecovery](/resources/alibabacloud/storage/hybrid-cloud-disaster-recovery.png) **HybridCloudDisasterRecovery** ``` import { HybridCloudDisasterRecovery } from "diagrams-js/alibabacloud/storage"; ``` ![Imm](/resources/alibabacloud/storage/imm.png) **Imm** ``` import { Imm } from "diagrams-js/alibabacloud/storage"; ``` ![ObjectStorageService](/resources/alibabacloud/storage/object-storage-service.png) **ObjectStorageService** ``` import { ObjectStorageService } from "diagrams-js/alibabacloud/storage"; ``` ![ObjectTableStore](/resources/alibabacloud/storage/object-table-store.png) **ObjectTableStore** ``` import { ObjectTableStore } from "diagrams-js/alibabacloud/storage"; ``` ### alibabacloud/web[​](#alibabacloudweb "Direct link to alibabacloud/web") ![Dns](/resources/alibabacloud/web/dns.png) **Dns** ``` import { Dns } from "diagrams-js/alibabacloud/web"; ``` ![Domain](/resources/alibabacloud/web/domain.png) **Domain** ``` import { Domain } from "diagrams-js/alibabacloud/web"; ``` --- # AWS Node classes list for the AWS provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { AmazonOpensearchService, Analytics, Athena } from "diagrams-js/aws/analytics"; import { ArVr, Sumerian } from "diagrams-js/aws/ar"; const diagram = Diagram("AWS Architecture", { direction: "TB" }); const node1 = diagram.add(AmazonOpensearchService("Node 1")); const node2 = diagram.add(ArVr("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/aws) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### aws/analytics[​](#awsanalytics "Direct link to aws/analytics") ![AmazonOpensearchService](/resources/aws/analytics/amazon-opensearch-service.png) **AmazonOpensearchService** ``` import { AmazonOpensearchService } from "diagrams-js/aws/analytics"; ``` ![Analytics](/resources/aws/analytics/analytics.png) **Analytics** ``` import { Analytics } from "diagrams-js/aws/analytics"; ``` ![Athena](/resources/aws/analytics/athena.png) **Athena** ``` import { Athena } from "diagrams-js/aws/analytics"; ``` ![CloudsearchSearchDocuments](/resources/aws/analytics/cloudsearch-search-documents.png) **CloudsearchSearchDocuments** ``` import { CloudsearchSearchDocuments } from "diagrams-js/aws/analytics"; ``` ![Cloudsearch](/resources/aws/analytics/cloudsearch.png) **Cloudsearch** ``` import { Cloudsearch } from "diagrams-js/aws/analytics"; ``` ![DataLakeResource](/resources/aws/analytics/data-lake-resource.png) **DataLakeResource** ``` import { DataLakeResource } from "diagrams-js/aws/analytics"; ``` ![DataPipeline](/resources/aws/analytics/data-pipeline.png) **DataPipeline** ``` import { DataPipeline } from "diagrams-js/aws/analytics"; ``` ![ElasticsearchService](/resources/aws/analytics/elasticsearch-service.png) **ElasticsearchService** ``` import { ElasticsearchService } from "diagrams-js/aws/analytics"; ``` ![EMRCluster](/resources/aws/analytics/emr-cluster.png) **EMRCluster** ``` import { EMRCluster } from "diagrams-js/aws/analytics"; ``` ![EMREngineMaprM3](/resources/aws/analytics/emr-engine-mapr-m3.png) **EMREngineMaprM3** ``` import { EMREngineMaprM3 } from "diagrams-js/aws/analytics"; ``` ![EMREngineMaprM5](/resources/aws/analytics/emr-engine-mapr-m5.png) **EMREngineMaprM5** ``` import { EMREngineMaprM5 } from "diagrams-js/aws/analytics"; ``` ![EMREngineMaprM7](/resources/aws/analytics/emr-engine-mapr-m7.png) **EMREngineMaprM7** ``` import { EMREngineMaprM7 } from "diagrams-js/aws/analytics"; ``` ![EMREngine](/resources/aws/analytics/emr-engine.png) **EMREngine** ``` import { EMREngine } from "diagrams-js/aws/analytics"; ``` ![EMRHdfsCluster](/resources/aws/analytics/emr-hdfs-cluster.png) **EMRHdfsCluster** ``` import { EMRHdfsCluster } from "diagrams-js/aws/analytics"; ``` ![EMR](/resources/aws/analytics/emr.png) **EMR** ``` import { EMR } from "diagrams-js/aws/analytics"; ``` ![GlueCrawlers](/resources/aws/analytics/glue-crawlers.png) **GlueCrawlers** ``` import { GlueCrawlers } from "diagrams-js/aws/analytics"; ``` ![GlueDataCatalog](/resources/aws/analytics/glue-data-catalog.png) **GlueDataCatalog** ``` import { GlueDataCatalog } from "diagrams-js/aws/analytics"; ``` ![Glue](/resources/aws/analytics/glue.png) **Glue** ``` import { Glue } from "diagrams-js/aws/analytics"; ``` ![KinesisDataAnalytics](/resources/aws/analytics/kinesis-data-analytics.png) **KinesisDataAnalytics** ``` import { KinesisDataAnalytics } from "diagrams-js/aws/analytics"; ``` ![KinesisDataFirehose](/resources/aws/analytics/kinesis-data-firehose.png) **KinesisDataFirehose** ``` import { KinesisDataFirehose } from "diagrams-js/aws/analytics"; ``` ![KinesisDataStreams](/resources/aws/analytics/kinesis-data-streams.png) **KinesisDataStreams** ``` import { KinesisDataStreams } from "diagrams-js/aws/analytics"; ``` ![KinesisVideoStreams](/resources/aws/analytics/kinesis-video-streams.png) **KinesisVideoStreams** ``` import { KinesisVideoStreams } from "diagrams-js/aws/analytics"; ``` ![Kinesis](/resources/aws/analytics/kinesis.png) **Kinesis** ``` import { Kinesis } from "diagrams-js/aws/analytics"; ``` ![LakeFormation](/resources/aws/analytics/lake-formation.png) **LakeFormation** ``` import { LakeFormation } from "diagrams-js/aws/analytics"; ``` ![ManagedStreamingForKafka](/resources/aws/analytics/managed-streaming-for-kafka.png) **ManagedStreamingForKafka** ``` import { ManagedStreamingForKafka } from "diagrams-js/aws/analytics"; ``` ![Quicksight](/resources/aws/analytics/quicksight.png) **Quicksight** ``` import { Quicksight } from "diagrams-js/aws/analytics"; ``` ![RedshiftDenseComputeNode](/resources/aws/analytics/redshift-dense-compute-node.png) **RedshiftDenseComputeNode** ``` import { RedshiftDenseComputeNode } from "diagrams-js/aws/analytics"; ``` ![RedshiftDenseStorageNode](/resources/aws/analytics/redshift-dense-storage-node.png) **RedshiftDenseStorageNode** ``` import { RedshiftDenseStorageNode } from "diagrams-js/aws/analytics"; ``` ![Redshift](/resources/aws/analytics/redshift.png) **Redshift** ``` import { Redshift } from "diagrams-js/aws/analytics"; ``` ### aws/ar[​](#awsar "Direct link to aws/ar") ![ArVr](/resources/aws/ar/ar-vr.png) **ArVr** ``` import { ArVr } from "diagrams-js/aws/ar"; ``` ![Sumerian](/resources/aws/ar/sumerian.png) **Sumerian** ``` import { Sumerian } from "diagrams-js/aws/ar"; ``` ### aws/blockchain[​](#awsblockchain "Direct link to aws/blockchain") ![BlockchainResource](/resources/aws/blockchain/blockchain-resource.png) **BlockchainResource** ``` import { BlockchainResource } from "diagrams-js/aws/blockchain"; ``` ![Blockchain](/resources/aws/blockchain/blockchain.png) **Blockchain** ``` import { Blockchain } from "diagrams-js/aws/blockchain"; ``` ![ManagedBlockchain](/resources/aws/blockchain/managed-blockchain.png) **ManagedBlockchain** ``` import { ManagedBlockchain } from "diagrams-js/aws/blockchain"; ``` ![QuantumLedgerDatabaseQldb](/resources/aws/blockchain/quantum-ledger-database-qldb.png) **QuantumLedgerDatabaseQldb** ``` import { QuantumLedgerDatabaseQldb } from "diagrams-js/aws/blockchain"; ``` ### aws/business[​](#awsbusiness "Direct link to aws/business") ![AlexaForBusiness](/resources/aws/business/alexa-for-business.png) **AlexaForBusiness** ``` import { AlexaForBusiness } from "diagrams-js/aws/business"; ``` ![BusinessApplications](/resources/aws/business/business-applications.png) **BusinessApplications** ``` import { BusinessApplications } from "diagrams-js/aws/business"; ``` ![Chime](/resources/aws/business/chime.png) **Chime** ``` import { Chime } from "diagrams-js/aws/business"; ``` ![Workmail](/resources/aws/business/workmail.png) **Workmail** ``` import { Workmail } from "diagrams-js/aws/business"; ``` ### aws/compute[​](#awscompute "Direct link to aws/compute") ![AppRunner](/resources/aws/compute/app-runner.png) **AppRunner** ``` import { AppRunner } from "diagrams-js/aws/compute"; ``` ![ApplicationAutoScaling](/resources/aws/compute/application-auto-scaling.png) **ApplicationAutoScaling** ``` import { ApplicationAutoScaling } from "diagrams-js/aws/compute"; ``` ![Batch](/resources/aws/compute/batch.png) **Batch** ``` import { Batch } from "diagrams-js/aws/compute"; ``` ![ComputeOptimizer](/resources/aws/compute/compute-optimizer.png) **ComputeOptimizer** ``` import { ComputeOptimizer } from "diagrams-js/aws/compute"; ``` ![Compute](/resources/aws/compute/compute.png) **Compute** ``` import { Compute } from "diagrams-js/aws/compute"; ``` ![EC2Ami](/resources/aws/compute/ec2-ami.png) **EC2Ami** ``` import { EC2Ami } from "diagrams-js/aws/compute"; ``` ![EC2AutoScaling](/resources/aws/compute/ec2-auto-scaling.png) **EC2AutoScaling** ``` import { EC2AutoScaling } from "diagrams-js/aws/compute"; ``` ![EC2ContainerRegistryImage](/resources/aws/compute/ec2-container-registry-image.png) **EC2ContainerRegistryImage** ``` import { EC2ContainerRegistryImage } from "diagrams-js/aws/compute"; ``` ![EC2ContainerRegistryRegistry](/resources/aws/compute/ec2-container-registry-registry.png) **EC2ContainerRegistryRegistry** ``` import { EC2ContainerRegistryRegistry } from "diagrams-js/aws/compute"; ``` ![EC2ContainerRegistry](/resources/aws/compute/ec2-container-registry.png) **EC2ContainerRegistry** ``` import { EC2ContainerRegistry } from "diagrams-js/aws/compute"; ``` ![EC2ElasticIpAddress](/resources/aws/compute/ec2-elastic-ip-address.png) **EC2ElasticIpAddress** ``` import { EC2ElasticIpAddress } from "diagrams-js/aws/compute"; ``` ![EC2ImageBuilder](/resources/aws/compute/ec2-image-builder.png) **EC2ImageBuilder** ``` import { EC2ImageBuilder } from "diagrams-js/aws/compute"; ``` ![EC2Instance](/resources/aws/compute/ec2-instance.png) **EC2Instance** ``` import { EC2Instance } from "diagrams-js/aws/compute"; ``` ![EC2Instances](/resources/aws/compute/ec2-instances.png) **EC2Instances** ``` import { EC2Instances } from "diagrams-js/aws/compute"; ``` ![EC2Rescue](/resources/aws/compute/ec2-rescue.png) **EC2Rescue** ``` import { EC2Rescue } from "diagrams-js/aws/compute"; ``` ![EC2SpotInstance](/resources/aws/compute/ec2-spot-instance.png) **EC2SpotInstance** ``` import { EC2SpotInstance } from "diagrams-js/aws/compute"; ``` ![EC2](/resources/aws/compute/ec2.png) **EC2** ``` import { EC2 } from "diagrams-js/aws/compute"; ``` ![ElasticBeanstalkApplication](/resources/aws/compute/elastic-beanstalk-application.png) **ElasticBeanstalkApplication** ``` import { ElasticBeanstalkApplication } from "diagrams-js/aws/compute"; ``` ![ElasticBeanstalkDeployment](/resources/aws/compute/elastic-beanstalk-deployment.png) **ElasticBeanstalkDeployment** ``` import { ElasticBeanstalkDeployment } from "diagrams-js/aws/compute"; ``` ![ElasticBeanstalk](/resources/aws/compute/elastic-beanstalk.png) **ElasticBeanstalk** ``` import { ElasticBeanstalk } from "diagrams-js/aws/compute"; ``` ![ElasticContainerServiceContainer](/resources/aws/compute/elastic-container-service-container.png) **ElasticContainerServiceContainer** ``` import { ElasticContainerServiceContainer } from "diagrams-js/aws/compute"; ``` ![ElasticContainerServiceServiceConnect](/resources/aws/compute/elastic-container-service-service-connect.png) **ElasticContainerServiceServiceConnect** ``` import { ElasticContainerServiceServiceConnect } from "diagrams-js/aws/compute"; ``` ![ElasticContainerServiceService](/resources/aws/compute/elastic-container-service-service.png) **ElasticContainerServiceService** ``` import { ElasticContainerServiceService } from "diagrams-js/aws/compute"; ``` ![ElasticContainerServiceTask](/resources/aws/compute/elastic-container-service-task.png) **ElasticContainerServiceTask** ``` import { ElasticContainerServiceTask } from "diagrams-js/aws/compute"; ``` ![ElasticContainerService](/resources/aws/compute/elastic-container-service.png) **ElasticContainerService** ``` import { ElasticContainerService } from "diagrams-js/aws/compute"; ``` ![ElasticKubernetesService](/resources/aws/compute/elastic-kubernetes-service.png) **ElasticKubernetesService** ``` import { ElasticKubernetesService } from "diagrams-js/aws/compute"; ``` ![Fargate](/resources/aws/compute/fargate.png) **Fargate** ``` import { Fargate } from "diagrams-js/aws/compute"; ``` ![LambdaFunction](/resources/aws/compute/lambda-function.png) **LambdaFunction** ``` import { LambdaFunction } from "diagrams-js/aws/compute"; ``` ![Lambda](/resources/aws/compute/lambda.png) **Lambda** ``` import { Lambda } from "diagrams-js/aws/compute"; ``` ![Lightsail](/resources/aws/compute/lightsail.png) **Lightsail** ``` import { Lightsail } from "diagrams-js/aws/compute"; ``` ![LocalZones](/resources/aws/compute/local-zones.png) **LocalZones** ``` import { LocalZones } from "diagrams-js/aws/compute"; ``` ![Outposts](/resources/aws/compute/outposts.png) **Outposts** ``` import { Outposts } from "diagrams-js/aws/compute"; ``` ![ServerlessApplicationRepository](/resources/aws/compute/serverless-application-repository.png) **ServerlessApplicationRepository** ``` import { ServerlessApplicationRepository } from "diagrams-js/aws/compute"; ``` ![ThinkboxDeadline](/resources/aws/compute/thinkbox-deadline.png) **ThinkboxDeadline** ``` import { ThinkboxDeadline } from "diagrams-js/aws/compute"; ``` ![ThinkboxDraft](/resources/aws/compute/thinkbox-draft.png) **ThinkboxDraft** ``` import { ThinkboxDraft } from "diagrams-js/aws/compute"; ``` ![ThinkboxFrost](/resources/aws/compute/thinkbox-frost.png) **ThinkboxFrost** ``` import { ThinkboxFrost } from "diagrams-js/aws/compute"; ``` ![ThinkboxKrakatoa](/resources/aws/compute/thinkbox-krakatoa.png) **ThinkboxKrakatoa** ``` import { ThinkboxKrakatoa } from "diagrams-js/aws/compute"; ``` ![ThinkboxSequoia](/resources/aws/compute/thinkbox-sequoia.png) **ThinkboxSequoia** ``` import { ThinkboxSequoia } from "diagrams-js/aws/compute"; ``` ![ThinkboxStoke](/resources/aws/compute/thinkbox-stoke.png) **ThinkboxStoke** ``` import { ThinkboxStoke } from "diagrams-js/aws/compute"; ``` ![ThinkboxXmesh](/resources/aws/compute/thinkbox-xmesh.png) **ThinkboxXmesh** ``` import { ThinkboxXmesh } from "diagrams-js/aws/compute"; ``` ![VmwareCloudOnAWS](/resources/aws/compute/vmware-cloud-on-aws.png) **VmwareCloudOnAWS** ``` import { VmwareCloudOnAWS } from "diagrams-js/aws/compute"; ``` ![Wavelength](/resources/aws/compute/wavelength.png) **Wavelength** ``` import { Wavelength } from "diagrams-js/aws/compute"; ``` ### aws/cost[​](#awscost "Direct link to aws/cost") ![Budgets](/resources/aws/cost/budgets.png) **Budgets** ``` import { Budgets } from "diagrams-js/aws/cost"; ``` ![CostAndUsageReport](/resources/aws/cost/cost-and-usage-report.png) **CostAndUsageReport** ``` import { CostAndUsageReport } from "diagrams-js/aws/cost"; ``` ![CostExplorer](/resources/aws/cost/cost-explorer.png) **CostExplorer** ``` import { CostExplorer } from "diagrams-js/aws/cost"; ``` ![CostManagement](/resources/aws/cost/cost-management.png) **CostManagement** ``` import { CostManagement } from "diagrams-js/aws/cost"; ``` ![ReservedInstanceReporting](/resources/aws/cost/reserved-instance-reporting.png) **ReservedInstanceReporting** ``` import { ReservedInstanceReporting } from "diagrams-js/aws/cost"; ``` ![SavingsPlans](/resources/aws/cost/savings-plans.png) **SavingsPlans** ``` import { SavingsPlans } from "diagrams-js/aws/cost"; ``` ### aws/database[​](#awsdatabase "Direct link to aws/database") ![AuroraInstance](/resources/aws/database/aurora-instance.png) **AuroraInstance** ``` import { AuroraInstance } from "diagrams-js/aws/database"; ``` ![Aurora](/resources/aws/database/aurora.png) **Aurora** ``` import { Aurora } from "diagrams-js/aws/database"; ``` ![DatabaseMigrationServiceDatabaseMigrationWorkflow](/resources/aws/database/database-migration-service-database-migration-workflow.png) **DatabaseMigrationServiceDatabaseMigrationWorkflow** ``` import { DatabaseMigrationServiceDatabaseMigrationWorkflow } from "diagrams-js/aws/database"; ``` ![DatabaseMigrationService](/resources/aws/database/database-migration-service.png) **DatabaseMigrationService** ``` import { DatabaseMigrationService } from "diagrams-js/aws/database"; ``` ![Database](/resources/aws/database/database.png) **Database** ``` import { Database } from "diagrams-js/aws/database"; ``` ![DocumentdbMongodbCompatibility](/resources/aws/database/documentdb-mongodb-compatibility.png) **DocumentdbMongodbCompatibility** ``` import { DocumentdbMongodbCompatibility } from "diagrams-js/aws/database"; ``` ![DynamodbAttribute](/resources/aws/database/dynamodb-attribute.png) **DynamodbAttribute** ``` import { DynamodbAttribute } from "diagrams-js/aws/database"; ``` ![DynamodbAttributes](/resources/aws/database/dynamodb-attributes.png) **DynamodbAttributes** ``` import { DynamodbAttributes } from "diagrams-js/aws/database"; ``` ![DynamodbDax](/resources/aws/database/dynamodb-dax.png) **DynamodbDax** ``` import { DynamodbDax } from "diagrams-js/aws/database"; ``` ![DynamodbGlobalSecondaryIndex](/resources/aws/database/dynamodb-global-secondary-index.png) **DynamodbGlobalSecondaryIndex** ``` import { DynamodbGlobalSecondaryIndex } from "diagrams-js/aws/database"; ``` ![DynamodbItem](/resources/aws/database/dynamodb-item.png) **DynamodbItem** ``` import { DynamodbItem } from "diagrams-js/aws/database"; ``` ![DynamodbItems](/resources/aws/database/dynamodb-items.png) **DynamodbItems** ``` import { DynamodbItems } from "diagrams-js/aws/database"; ``` ![DynamodbStreams](/resources/aws/database/dynamodb-streams.png) **DynamodbStreams** ``` import { DynamodbStreams } from "diagrams-js/aws/database"; ``` ![DynamodbTable](/resources/aws/database/dynamodb-table.png) **DynamodbTable** ``` import { DynamodbTable } from "diagrams-js/aws/database"; ``` ![Dynamodb](/resources/aws/database/dynamodb.png) **Dynamodb** ``` import { Dynamodb } from "diagrams-js/aws/database"; ``` ![ElasticacheCacheNode](/resources/aws/database/elasticache-cache-node.png) **ElasticacheCacheNode** ``` import { ElasticacheCacheNode } from "diagrams-js/aws/database"; ``` ![ElasticacheForMemcached](/resources/aws/database/elasticache-for-memcached.png) **ElasticacheForMemcached** ``` import { ElasticacheForMemcached } from "diagrams-js/aws/database"; ``` ![ElasticacheForRedis](/resources/aws/database/elasticache-for-redis.png) **ElasticacheForRedis** ``` import { ElasticacheForRedis } from "diagrams-js/aws/database"; ``` ![Elasticache](/resources/aws/database/elasticache.png) **Elasticache** ``` import { Elasticache } from "diagrams-js/aws/database"; ``` ![KeyspacesManagedApacheCassandraService](/resources/aws/database/keyspaces-managed-apache-cassandra-service.png) **KeyspacesManagedApacheCassandraService** ``` import { KeyspacesManagedApacheCassandraService } from "diagrams-js/aws/database"; ``` ![Neptune](/resources/aws/database/neptune.png) **Neptune** ``` import { Neptune } from "diagrams-js/aws/database"; ``` ![QuantumLedgerDatabaseQldb](/resources/aws/database/quantum-ledger-database-qldb.png) **QuantumLedgerDatabaseQldb** ``` import { QuantumLedgerDatabaseQldb } from "diagrams-js/aws/database"; ``` ![RDSInstance](/resources/aws/database/rds-instance.png) **RDSInstance** ``` import { RDSInstance } from "diagrams-js/aws/database"; ``` ![RDSMariadbInstance](/resources/aws/database/rds-mariadb-instance.png) **RDSMariadbInstance** ``` import { RDSMariadbInstance } from "diagrams-js/aws/database"; ``` ![RDSMysqlInstance](/resources/aws/database/rds-mysql-instance.png) **RDSMysqlInstance** ``` import { RDSMysqlInstance } from "diagrams-js/aws/database"; ``` ![RDSOnVmware](/resources/aws/database/rds-on-vmware.png) **RDSOnVmware** ``` import { RDSOnVmware } from "diagrams-js/aws/database"; ``` ![RDSOracleInstance](/resources/aws/database/rds-oracle-instance.png) **RDSOracleInstance** ``` import { RDSOracleInstance } from "diagrams-js/aws/database"; ``` ![RDSPostgresqlInstance](/resources/aws/database/rds-postgresql-instance.png) **RDSPostgresqlInstance** ``` import { RDSPostgresqlInstance } from "diagrams-js/aws/database"; ``` ![RDSSqlServerInstance](/resources/aws/database/rds-sql-server-instance.png) **RDSSqlServerInstance** ``` import { RDSSqlServerInstance } from "diagrams-js/aws/database"; ``` ![RDS](/resources/aws/database/rds.png) **RDS** ``` import { RDS } from "diagrams-js/aws/database"; ``` ![RedshiftDenseComputeNode](/resources/aws/database/redshift-dense-compute-node.png) **RedshiftDenseComputeNode** ``` import { RedshiftDenseComputeNode } from "diagrams-js/aws/database"; ``` ![RedshiftDenseStorageNode](/resources/aws/database/redshift-dense-storage-node.png) **RedshiftDenseStorageNode** ``` import { RedshiftDenseStorageNode } from "diagrams-js/aws/database"; ``` ![Redshift](/resources/aws/database/redshift.png) **Redshift** ``` import { Redshift } from "diagrams-js/aws/database"; ``` ![Timestream](/resources/aws/database/timestream.png) **Timestream** ``` import { Timestream } from "diagrams-js/aws/database"; ``` ### aws/devtools[​](#awsdevtools "Direct link to aws/devtools") ![CloudDevelopmentKit](/resources/aws/devtools/cloud-development-kit.png) **CloudDevelopmentKit** ``` import { CloudDevelopmentKit } from "diagrams-js/aws/devtools"; ``` ![Cloud9Resource](/resources/aws/devtools/cloud9-resource.png) **Cloud9Resource** ``` import { Cloud9Resource } from "diagrams-js/aws/devtools"; ``` ![Cloud9](/resources/aws/devtools/cloud9.png) **Cloud9** ``` import { Cloud9 } from "diagrams-js/aws/devtools"; ``` ![Cloudshell](/resources/aws/devtools/cloudshell.png) **Cloudshell** ``` import { Cloudshell } from "diagrams-js/aws/devtools"; ``` ![Codeartifact](/resources/aws/devtools/codeartifact.png) **Codeartifact** ``` import { Codeartifact } from "diagrams-js/aws/devtools"; ``` ![Codebuild](/resources/aws/devtools/codebuild.png) **Codebuild** ``` import { Codebuild } from "diagrams-js/aws/devtools"; ``` ![Codecommit](/resources/aws/devtools/codecommit.png) **Codecommit** ``` import { Codecommit } from "diagrams-js/aws/devtools"; ``` ![Codedeploy](/resources/aws/devtools/codedeploy.png) **Codedeploy** ``` import { Codedeploy } from "diagrams-js/aws/devtools"; ``` ![Codepipeline](/resources/aws/devtools/codepipeline.png) **Codepipeline** ``` import { Codepipeline } from "diagrams-js/aws/devtools"; ``` ![Codestar](/resources/aws/devtools/codestar.png) **Codestar** ``` import { Codestar } from "diagrams-js/aws/devtools"; ``` ![CommandLineInterface](/resources/aws/devtools/command-line-interface.png) **CommandLineInterface** ``` import { CommandLineInterface } from "diagrams-js/aws/devtools"; ``` ![DeveloperTools](/resources/aws/devtools/developer-tools.png) **DeveloperTools** ``` import { DeveloperTools } from "diagrams-js/aws/devtools"; ``` ![ToolsAndSdks](/resources/aws/devtools/tools-and-sdks.png) **ToolsAndSdks** ``` import { ToolsAndSdks } from "diagrams-js/aws/devtools"; ``` ![XRay](/resources/aws/devtools/x-ray.png) **XRay** ``` import { XRay } from "diagrams-js/aws/devtools"; ``` ### aws/enablement[​](#awsenablement "Direct link to aws/enablement") ![CustomerEnablement](/resources/aws/enablement/customer-enablement.png) **CustomerEnablement** ``` import { CustomerEnablement } from "diagrams-js/aws/enablement"; ``` ![Iq](/resources/aws/enablement/iq.png) **Iq** ``` import { Iq } from "diagrams-js/aws/enablement"; ``` ![ManagedServices](/resources/aws/enablement/managed-services.png) **ManagedServices** ``` import { ManagedServices } from "diagrams-js/aws/enablement"; ``` ![ProfessionalServices](/resources/aws/enablement/professional-services.png) **ProfessionalServices** ``` import { ProfessionalServices } from "diagrams-js/aws/enablement"; ``` ![Support](/resources/aws/enablement/support.png) **Support** ``` import { Support } from "diagrams-js/aws/enablement"; ``` ### aws/enduser[​](#awsenduser "Direct link to aws/enduser") ![Appstream20](/resources/aws/enduser/appstream-2-0.png) **Appstream20** ``` import { Appstream20 } from "diagrams-js/aws/enduser"; ``` ![DesktopAndAppStreaming](/resources/aws/enduser/desktop-and-app-streaming.png) **DesktopAndAppStreaming** ``` import { DesktopAndAppStreaming } from "diagrams-js/aws/enduser"; ``` ![Workdocs](/resources/aws/enduser/workdocs.png) **Workdocs** ``` import { Workdocs } from "diagrams-js/aws/enduser"; ``` ![Worklink](/resources/aws/enduser/worklink.png) **Worklink** ``` import { Worklink } from "diagrams-js/aws/enduser"; ``` ![Workspaces](/resources/aws/enduser/workspaces.png) **Workspaces** ``` import { Workspaces } from "diagrams-js/aws/enduser"; ``` ### aws/engagement[​](#awsengagement "Direct link to aws/engagement") ![Connect](/resources/aws/engagement/connect.png) **Connect** ``` import { Connect } from "diagrams-js/aws/engagement"; ``` ![CustomerEngagement](/resources/aws/engagement/customer-engagement.png) **CustomerEngagement** ``` import { CustomerEngagement } from "diagrams-js/aws/engagement"; ``` ![Pinpoint](/resources/aws/engagement/pinpoint.png) **Pinpoint** ``` import { Pinpoint } from "diagrams-js/aws/engagement"; ``` ![SimpleEmailServiceSesEmail](/resources/aws/engagement/simple-email-service-ses-email.png) **SimpleEmailServiceSesEmail** ``` import { SimpleEmailServiceSesEmail } from "diagrams-js/aws/engagement"; ``` ![SimpleEmailServiceSes](/resources/aws/engagement/simple-email-service-ses.png) **SimpleEmailServiceSes** ``` import { SimpleEmailServiceSes } from "diagrams-js/aws/engagement"; ``` ### aws/game[​](#awsgame "Direct link to aws/game") ![GameTech](/resources/aws/game/game-tech.png) **GameTech** ``` import { GameTech } from "diagrams-js/aws/game"; ``` ![Gamelift](/resources/aws/game/gamelift.png) **Gamelift** ``` import { Gamelift } from "diagrams-js/aws/game"; ``` ### aws/general[​](#awsgeneral "Direct link to aws/general") ![Client](/resources/aws/general/client.png) **Client** ``` import { Client } from "diagrams-js/aws/general"; ``` ![Disk](/resources/aws/general/disk.png) **Disk** ``` import { Disk } from "diagrams-js/aws/general"; ``` ![Forums](/resources/aws/general/forums.png) **Forums** ``` import { Forums } from "diagrams-js/aws/general"; ``` ![General](/resources/aws/general/general.png) **General** ``` import { General } from "diagrams-js/aws/general"; ``` ![GenericDatabase](/resources/aws/general/generic-database.png) **GenericDatabase** ``` import { GenericDatabase } from "diagrams-js/aws/general"; ``` ![GenericFirewall](/resources/aws/general/generic-firewall.png) **GenericFirewall** ``` import { GenericFirewall } from "diagrams-js/aws/general"; ``` ![GenericOfficeBuilding](/resources/aws/general/generic-office-building.png) **GenericOfficeBuilding** ``` import { GenericOfficeBuilding } from "diagrams-js/aws/general"; ``` ![GenericSamlToken](/resources/aws/general/generic-saml-token.png) **GenericSamlToken** ``` import { GenericSamlToken } from "diagrams-js/aws/general"; ``` ![GenericSDK](/resources/aws/general/generic-sdk.png) **GenericSDK** ``` import { GenericSDK } from "diagrams-js/aws/general"; ``` ![InternetAlt1](/resources/aws/general/internet-alt1.png) **InternetAlt1** ``` import { InternetAlt1 } from "diagrams-js/aws/general"; ``` ![InternetAlt2](/resources/aws/general/internet-alt2.png) **InternetAlt2** ``` import { InternetAlt2 } from "diagrams-js/aws/general"; ``` ![InternetGateway](/resources/aws/general/internet-gateway.png) **InternetGateway** ``` import { InternetGateway } from "diagrams-js/aws/general"; ``` ![Marketplace](/resources/aws/general/marketplace.png) **Marketplace** ``` import { Marketplace } from "diagrams-js/aws/general"; ``` ![MobileClient](/resources/aws/general/mobile-client.png) **MobileClient** ``` import { MobileClient } from "diagrams-js/aws/general"; ``` ![Multimedia](/resources/aws/general/multimedia.png) **Multimedia** ``` import { Multimedia } from "diagrams-js/aws/general"; ``` ![OfficeBuilding](/resources/aws/general/office-building.png) **OfficeBuilding** ``` import { OfficeBuilding } from "diagrams-js/aws/general"; ``` ![SamlToken](/resources/aws/general/saml-token.png) **SamlToken** ``` import { SamlToken } from "diagrams-js/aws/general"; ``` ![SDK](/resources/aws/general/sdk.png) **SDK** ``` import { SDK } from "diagrams-js/aws/general"; ``` ![SslPadlock](/resources/aws/general/ssl-padlock.png) **SslPadlock** ``` import { SslPadlock } from "diagrams-js/aws/general"; ``` ![TapeStorage](/resources/aws/general/tape-storage.png) **TapeStorage** ``` import { TapeStorage } from "diagrams-js/aws/general"; ``` ![Toolkit](/resources/aws/general/toolkit.png) **Toolkit** ``` import { Toolkit } from "diagrams-js/aws/general"; ``` ![TraditionalServer](/resources/aws/general/traditional-server.png) **TraditionalServer** ``` import { TraditionalServer } from "diagrams-js/aws/general"; ``` ![User](/resources/aws/general/user.png) **User** ``` import { User } from "diagrams-js/aws/general"; ``` ![Users](/resources/aws/general/users.png) **Users** ``` import { Users } from "diagrams-js/aws/general"; ``` ### aws/integration[​](#awsintegration "Direct link to aws/integration") ![ApplicationIntegration](/resources/aws/integration/application-integration.png) **ApplicationIntegration** ``` import { ApplicationIntegration } from "diagrams-js/aws/integration"; ``` ![Appsync](/resources/aws/integration/appsync.png) **Appsync** ``` import { Appsync } from "diagrams-js/aws/integration"; ``` ![ConsoleMobileApplication](/resources/aws/integration/console-mobile-application.png) **ConsoleMobileApplication** ``` import { ConsoleMobileApplication } from "diagrams-js/aws/integration"; ``` ![EventResource](/resources/aws/integration/event-resource.png) **EventResource** ``` import { EventResource } from "diagrams-js/aws/integration"; ``` ![EventbridgeCustomEventBusResource](/resources/aws/integration/eventbridge-custom-event-bus-resource.png) **EventbridgeCustomEventBusResource** ``` import { EventbridgeCustomEventBusResource } from "diagrams-js/aws/integration"; ``` ![EventbridgeDefaultEventBusResource](/resources/aws/integration/eventbridge-default-event-bus-resource.png) **EventbridgeDefaultEventBusResource** ``` import { EventbridgeDefaultEventBusResource } from "diagrams-js/aws/integration"; ``` ![EventbridgeEvent](/resources/aws/integration/eventbridge-event.png) **EventbridgeEvent** ``` import { EventbridgeEvent } from "diagrams-js/aws/integration"; ``` ![EventbridgePipes](/resources/aws/integration/eventbridge-pipes.png) **EventbridgePipes** ``` import { EventbridgePipes } from "diagrams-js/aws/integration"; ``` ![EventbridgeRule](/resources/aws/integration/eventbridge-rule.png) **EventbridgeRule** ``` import { EventbridgeRule } from "diagrams-js/aws/integration"; ``` ![EventbridgeSaasPartnerEventBusResource](/resources/aws/integration/eventbridge-saas-partner-event-bus-resource.png) **EventbridgeSaasPartnerEventBusResource** ``` import { EventbridgeSaasPartnerEventBusResource } from "diagrams-js/aws/integration"; ``` ![EventbridgeScheduler](/resources/aws/integration/eventbridge-scheduler.png) **EventbridgeScheduler** ``` import { EventbridgeScheduler } from "diagrams-js/aws/integration"; ``` ![EventbridgeSchema](/resources/aws/integration/eventbridge-schema.png) **EventbridgeSchema** ``` import { EventbridgeSchema } from "diagrams-js/aws/integration"; ``` ![Eventbridge](/resources/aws/integration/eventbridge.png) **Eventbridge** ``` import { Eventbridge } from "diagrams-js/aws/integration"; ``` ![ExpressWorkflows](/resources/aws/integration/express-workflows.png) **ExpressWorkflows** ``` import { ExpressWorkflows } from "diagrams-js/aws/integration"; ``` ![MQ](/resources/aws/integration/mq.png) **MQ** ``` import { MQ } from "diagrams-js/aws/integration"; ``` ![SimpleNotificationServiceSnsEmailNotification](/resources/aws/integration/simple-notification-service-sns-email-notification.png) **SimpleNotificationServiceSnsEmailNotification** ``` import { SimpleNotificationServiceSnsEmailNotification } from "diagrams-js/aws/integration"; ``` ![SimpleNotificationServiceSnsHttpNotification](/resources/aws/integration/simple-notification-service-sns-http-notification.png) **SimpleNotificationServiceSnsHttpNotification** ``` import { SimpleNotificationServiceSnsHttpNotification } from "diagrams-js/aws/integration"; ``` ![SimpleNotificationServiceSnsTopic](/resources/aws/integration/simple-notification-service-sns-topic.png) **SimpleNotificationServiceSnsTopic** ``` import { SimpleNotificationServiceSnsTopic } from "diagrams-js/aws/integration"; ``` ![SimpleNotificationServiceSns](/resources/aws/integration/simple-notification-service-sns.png) **SimpleNotificationServiceSns** ``` import { SimpleNotificationServiceSns } from "diagrams-js/aws/integration"; ``` ![SimpleQueueServiceSqsMessage](/resources/aws/integration/simple-queue-service-sqs-message.png) **SimpleQueueServiceSqsMessage** ``` import { SimpleQueueServiceSqsMessage } from "diagrams-js/aws/integration"; ``` ![SimpleQueueServiceSqsQueue](/resources/aws/integration/simple-queue-service-sqs-queue.png) **SimpleQueueServiceSqsQueue** ``` import { SimpleQueueServiceSqsQueue } from "diagrams-js/aws/integration"; ``` ![SimpleQueueServiceSqs](/resources/aws/integration/simple-queue-service-sqs.png) **SimpleQueueServiceSqs** ``` import { SimpleQueueServiceSqs } from "diagrams-js/aws/integration"; ``` ![StepFunctions](/resources/aws/integration/step-functions.png) **StepFunctions** ``` import { StepFunctions } from "diagrams-js/aws/integration"; ``` ### aws/iot[​](#awsiot "Direct link to aws/iot") ![Freertos](/resources/aws/iot/freertos.png) **Freertos** ``` import { Freertos } from "diagrams-js/aws/iot"; ``` ![InternetOfThings](/resources/aws/iot/internet-of-things.png) **InternetOfThings** ``` import { InternetOfThings } from "diagrams-js/aws/iot"; ``` ![Iot1Click](/resources/aws/iot/iot-1-click.png) **Iot1Click** ``` import { Iot1Click } from "diagrams-js/aws/iot"; ``` ![IotAction](/resources/aws/iot/iot-action.png) **IotAction** ``` import { IotAction } from "diagrams-js/aws/iot"; ``` ![IotActuator](/resources/aws/iot/iot-actuator.png) **IotActuator** ``` import { IotActuator } from "diagrams-js/aws/iot"; ``` ![IotAlexaEcho](/resources/aws/iot/iot-alexa-echo.png) **IotAlexaEcho** ``` import { IotAlexaEcho } from "diagrams-js/aws/iot"; ``` ![IotAlexaEnabledDevice](/resources/aws/iot/iot-alexa-enabled-device.png) **IotAlexaEnabledDevice** ``` import { IotAlexaEnabledDevice } from "diagrams-js/aws/iot"; ``` ![IotAlexaSkill](/resources/aws/iot/iot-alexa-skill.png) **IotAlexaSkill** ``` import { IotAlexaSkill } from "diagrams-js/aws/iot"; ``` ![IotAlexaVoiceService](/resources/aws/iot/iot-alexa-voice-service.png) **IotAlexaVoiceService** ``` import { IotAlexaVoiceService } from "diagrams-js/aws/iot"; ``` ![IotAnalyticsChannel](/resources/aws/iot/iot-analytics-channel.png) **IotAnalyticsChannel** ``` import { IotAnalyticsChannel } from "diagrams-js/aws/iot"; ``` ![IotAnalyticsDataSet](/resources/aws/iot/iot-analytics-data-set.png) **IotAnalyticsDataSet** ``` import { IotAnalyticsDataSet } from "diagrams-js/aws/iot"; ``` ![IotAnalyticsDataStore](/resources/aws/iot/iot-analytics-data-store.png) **IotAnalyticsDataStore** ``` import { IotAnalyticsDataStore } from "diagrams-js/aws/iot"; ``` ![IotAnalyticsNotebook](/resources/aws/iot/iot-analytics-notebook.png) **IotAnalyticsNotebook** ``` import { IotAnalyticsNotebook } from "diagrams-js/aws/iot"; ``` ![IotAnalyticsPipeline](/resources/aws/iot/iot-analytics-pipeline.png) **IotAnalyticsPipeline** ``` import { IotAnalyticsPipeline } from "diagrams-js/aws/iot"; ``` ![IotAnalytics](/resources/aws/iot/iot-analytics.png) **IotAnalytics** ``` import { IotAnalytics } from "diagrams-js/aws/iot"; ``` ![IotBank](/resources/aws/iot/iot-bank.png) **IotBank** ``` import { IotBank } from "diagrams-js/aws/iot"; ``` ![IotBicycle](/resources/aws/iot/iot-bicycle.png) **IotBicycle** ``` import { IotBicycle } from "diagrams-js/aws/iot"; ``` ![IotButton](/resources/aws/iot/iot-button.png) **IotButton** ``` import { IotButton } from "diagrams-js/aws/iot"; ``` ![IotCamera](/resources/aws/iot/iot-camera.png) **IotCamera** ``` import { IotCamera } from "diagrams-js/aws/iot"; ``` ![IotCar](/resources/aws/iot/iot-car.png) **IotCar** ``` import { IotCar } from "diagrams-js/aws/iot"; ``` ![IotCart](/resources/aws/iot/iot-cart.png) **IotCart** ``` import { IotCart } from "diagrams-js/aws/iot"; ``` ![IotCertificate](/resources/aws/iot/iot-certificate.png) **IotCertificate** ``` import { IotCertificate } from "diagrams-js/aws/iot"; ``` ![IotCoffeePot](/resources/aws/iot/iot-coffee-pot.png) **IotCoffeePot** ``` import { IotCoffeePot } from "diagrams-js/aws/iot"; ``` ![IotCore](/resources/aws/iot/iot-core.png) **IotCore** ``` import { IotCore } from "diagrams-js/aws/iot"; ``` ![IotDesiredState](/resources/aws/iot/iot-desired-state.png) **IotDesiredState** ``` import { IotDesiredState } from "diagrams-js/aws/iot"; ``` ![IotDeviceDefender](/resources/aws/iot/iot-device-defender.png) **IotDeviceDefender** ``` import { IotDeviceDefender } from "diagrams-js/aws/iot"; ``` ![IotDeviceGateway](/resources/aws/iot/iot-device-gateway.png) **IotDeviceGateway** ``` import { IotDeviceGateway } from "diagrams-js/aws/iot"; ``` ![IotDeviceManagement](/resources/aws/iot/iot-device-management.png) **IotDeviceManagement** ``` import { IotDeviceManagement } from "diagrams-js/aws/iot"; ``` ![IotDoorLock](/resources/aws/iot/iot-door-lock.png) **IotDoorLock** ``` import { IotDoorLock } from "diagrams-js/aws/iot"; ``` ![IotEvents](/resources/aws/iot/iot-events.png) **IotEvents** ``` import { IotEvents } from "diagrams-js/aws/iot"; ``` ![IotFactory](/resources/aws/iot/iot-factory.png) **IotFactory** ``` import { IotFactory } from "diagrams-js/aws/iot"; ``` ![IotFireTvStick](/resources/aws/iot/iot-fire-tv-stick.png) **IotFireTvStick** ``` import { IotFireTvStick } from "diagrams-js/aws/iot"; ``` ![IotFireTv](/resources/aws/iot/iot-fire-tv.png) **IotFireTv** ``` import { IotFireTv } from "diagrams-js/aws/iot"; ``` ![IotGeneric](/resources/aws/iot/iot-generic.png) **IotGeneric** ``` import { IotGeneric } from "diagrams-js/aws/iot"; ``` ![IotGreengrassConnector](/resources/aws/iot/iot-greengrass-connector.png) **IotGreengrassConnector** ``` import { IotGreengrassConnector } from "diagrams-js/aws/iot"; ``` ![IotGreengrass](/resources/aws/iot/iot-greengrass.png) **IotGreengrass** ``` import { IotGreengrass } from "diagrams-js/aws/iot"; ``` ![IotHardwareBoard](/resources/aws/iot/iot-hardware-board.png) **IotHardwareBoard** ``` import { IotHardwareBoard } from "diagrams-js/aws/iot"; ``` ![IotHouse](/resources/aws/iot/iot-house.png) **IotHouse** ``` import { IotHouse } from "diagrams-js/aws/iot"; ``` ![IotHttp](/resources/aws/iot/iot-http.png) **IotHttp** ``` import { IotHttp } from "diagrams-js/aws/iot"; ``` ![IotHttp2](/resources/aws/iot/iot-http2.png) **IotHttp2** ``` import { IotHttp2 } from "diagrams-js/aws/iot"; ``` ![IotJobs](/resources/aws/iot/iot-jobs.png) **IotJobs** ``` import { IotJobs } from "diagrams-js/aws/iot"; ``` ![IotLambda](/resources/aws/iot/iot-lambda.png) **IotLambda** ``` import { IotLambda } from "diagrams-js/aws/iot"; ``` ![IotLightbulb](/resources/aws/iot/iot-lightbulb.png) **IotLightbulb** ``` import { IotLightbulb } from "diagrams-js/aws/iot"; ``` ![IotMedicalEmergency](/resources/aws/iot/iot-medical-emergency.png) **IotMedicalEmergency** ``` import { IotMedicalEmergency } from "diagrams-js/aws/iot"; ``` ![IotMqtt](/resources/aws/iot/iot-mqtt.png) **IotMqtt** ``` import { IotMqtt } from "diagrams-js/aws/iot"; ``` ![IotOverTheAirUpdate](/resources/aws/iot/iot-over-the-air-update.png) **IotOverTheAirUpdate** ``` import { IotOverTheAirUpdate } from "diagrams-js/aws/iot"; ``` ![IotPolicyEmergency](/resources/aws/iot/iot-policy-emergency.png) **IotPolicyEmergency** ``` import { IotPolicyEmergency } from "diagrams-js/aws/iot"; ``` ![IotPolicy](/resources/aws/iot/iot-policy.png) **IotPolicy** ``` import { IotPolicy } from "diagrams-js/aws/iot"; ``` ![IotReportedState](/resources/aws/iot/iot-reported-state.png) **IotReportedState** ``` import { IotReportedState } from "diagrams-js/aws/iot"; ``` ![IotRule](/resources/aws/iot/iot-rule.png) **IotRule** ``` import { IotRule } from "diagrams-js/aws/iot"; ``` ![IotSensor](/resources/aws/iot/iot-sensor.png) **IotSensor** ``` import { IotSensor } from "diagrams-js/aws/iot"; ``` ![IotServo](/resources/aws/iot/iot-servo.png) **IotServo** ``` import { IotServo } from "diagrams-js/aws/iot"; ``` ![IotShadow](/resources/aws/iot/iot-shadow.png) **IotShadow** ``` import { IotShadow } from "diagrams-js/aws/iot"; ``` ![IotSimulator](/resources/aws/iot/iot-simulator.png) **IotSimulator** ``` import { IotSimulator } from "diagrams-js/aws/iot"; ``` ![IotSitewise](/resources/aws/iot/iot-sitewise.png) **IotSitewise** ``` import { IotSitewise } from "diagrams-js/aws/iot"; ``` ![IotThermostat](/resources/aws/iot/iot-thermostat.png) **IotThermostat** ``` import { IotThermostat } from "diagrams-js/aws/iot"; ``` ![IotThingsGraph](/resources/aws/iot/iot-things-graph.png) **IotThingsGraph** ``` import { IotThingsGraph } from "diagrams-js/aws/iot"; ``` ![IotTopic](/resources/aws/iot/iot-topic.png) **IotTopic** ``` import { IotTopic } from "diagrams-js/aws/iot"; ``` ![IotTravel](/resources/aws/iot/iot-travel.png) **IotTravel** ``` import { IotTravel } from "diagrams-js/aws/iot"; ``` ![IotUtility](/resources/aws/iot/iot-utility.png) **IotUtility** ``` import { IotUtility } from "diagrams-js/aws/iot"; ``` ![IotWindfarm](/resources/aws/iot/iot-windfarm.png) **IotWindfarm** ``` import { IotWindfarm } from "diagrams-js/aws/iot"; ``` ### aws/management[​](#awsmanagement "Direct link to aws/management") ![AmazonDevopsGuru](/resources/aws/management/amazon-devops-guru.png) **AmazonDevopsGuru** ``` import { AmazonDevopsGuru } from "diagrams-js/aws/management"; ``` ![AmazonManagedGrafana](/resources/aws/management/amazon-managed-grafana.png) **AmazonManagedGrafana** ``` import { AmazonManagedGrafana } from "diagrams-js/aws/management"; ``` ![AmazonManagedPrometheus](/resources/aws/management/amazon-managed-prometheus.png) **AmazonManagedPrometheus** ``` import { AmazonManagedPrometheus } from "diagrams-js/aws/management"; ``` ![AmazonManagedWorkflowsApacheAirflow](/resources/aws/management/amazon-managed-workflows-apache-airflow.png) **AmazonManagedWorkflowsApacheAirflow** ``` import { AmazonManagedWorkflowsApacheAirflow } from "diagrams-js/aws/management"; ``` ![AutoScaling](/resources/aws/management/auto-scaling.png) **AutoScaling** ``` import { AutoScaling } from "diagrams-js/aws/management"; ``` ![Chatbot](/resources/aws/management/chatbot.png) **Chatbot** ``` import { Chatbot } from "diagrams-js/aws/management"; ``` ![CloudformationChangeSet](/resources/aws/management/cloudformation-change-set.png) **CloudformationChangeSet** ``` import { CloudformationChangeSet } from "diagrams-js/aws/management"; ``` ![CloudformationStack](/resources/aws/management/cloudformation-stack.png) **CloudformationStack** ``` import { CloudformationStack } from "diagrams-js/aws/management"; ``` ![CloudformationTemplate](/resources/aws/management/cloudformation-template.png) **CloudformationTemplate** ``` import { CloudformationTemplate } from "diagrams-js/aws/management"; ``` ![Cloudformation](/resources/aws/management/cloudformation.png) **Cloudformation** ``` import { Cloudformation } from "diagrams-js/aws/management"; ``` ![Cloudtrail](/resources/aws/management/cloudtrail.png) **Cloudtrail** ``` import { Cloudtrail } from "diagrams-js/aws/management"; ``` ![CloudwatchAlarm](/resources/aws/management/cloudwatch-alarm.png) **CloudwatchAlarm** ``` import { CloudwatchAlarm } from "diagrams-js/aws/management"; ``` ![CloudwatchEventEventBased](/resources/aws/management/cloudwatch-event-event-based.png) **CloudwatchEventEventBased** ``` import { CloudwatchEventEventBased } from "diagrams-js/aws/management"; ``` ![CloudwatchEventTimeBased](/resources/aws/management/cloudwatch-event-time-based.png) **CloudwatchEventTimeBased** ``` import { CloudwatchEventTimeBased } from "diagrams-js/aws/management"; ``` ![CloudwatchLogs](/resources/aws/management/cloudwatch-logs.png) **CloudwatchLogs** ``` import { CloudwatchLogs } from "diagrams-js/aws/management"; ``` ![CloudwatchRule](/resources/aws/management/cloudwatch-rule.png) **CloudwatchRule** ``` import { CloudwatchRule } from "diagrams-js/aws/management"; ``` ![Cloudwatch](/resources/aws/management/cloudwatch.png) **Cloudwatch** ``` import { Cloudwatch } from "diagrams-js/aws/management"; ``` ![Codeguru](/resources/aws/management/codeguru.png) **Codeguru** ``` import { Codeguru } from "diagrams-js/aws/management"; ``` ![CommandLineInterface](/resources/aws/management/command-line-interface.png) **CommandLineInterface** ``` import { CommandLineInterface } from "diagrams-js/aws/management"; ``` ![Config](/resources/aws/management/config.png) **Config** ``` import { Config } from "diagrams-js/aws/management"; ``` ![ControlTower](/resources/aws/management/control-tower.png) **ControlTower** ``` import { ControlTower } from "diagrams-js/aws/management"; ``` ![LicenseManager](/resources/aws/management/license-manager.png) **LicenseManager** ``` import { LicenseManager } from "diagrams-js/aws/management"; ``` ![ManagedServices](/resources/aws/management/managed-services.png) **ManagedServices** ``` import { ManagedServices } from "diagrams-js/aws/management"; ``` ![ManagementAndGovernance](/resources/aws/management/management-and-governance.png) **ManagementAndGovernance** ``` import { ManagementAndGovernance } from "diagrams-js/aws/management"; ``` ![ManagementConsole](/resources/aws/management/management-console.png) **ManagementConsole** ``` import { ManagementConsole } from "diagrams-js/aws/management"; ``` ![OpsworksApps](/resources/aws/management/opsworks-apps.png) **OpsworksApps** ``` import { OpsworksApps } from "diagrams-js/aws/management"; ``` ![OpsworksDeployments](/resources/aws/management/opsworks-deployments.png) **OpsworksDeployments** ``` import { OpsworksDeployments } from "diagrams-js/aws/management"; ``` ![OpsworksInstances](/resources/aws/management/opsworks-instances.png) **OpsworksInstances** ``` import { OpsworksInstances } from "diagrams-js/aws/management"; ``` ![OpsworksLayers](/resources/aws/management/opsworks-layers.png) **OpsworksLayers** ``` import { OpsworksLayers } from "diagrams-js/aws/management"; ``` ![OpsworksMonitoring](/resources/aws/management/opsworks-monitoring.png) **OpsworksMonitoring** ``` import { OpsworksMonitoring } from "diagrams-js/aws/management"; ``` ![OpsworksPermissions](/resources/aws/management/opsworks-permissions.png) **OpsworksPermissions** ``` import { OpsworksPermissions } from "diagrams-js/aws/management"; ``` ![OpsworksResources](/resources/aws/management/opsworks-resources.png) **OpsworksResources** ``` import { OpsworksResources } from "diagrams-js/aws/management"; ``` ![OpsworksStack](/resources/aws/management/opsworks-stack.png) **OpsworksStack** ``` import { OpsworksStack } from "diagrams-js/aws/management"; ``` ![Opsworks](/resources/aws/management/opsworks.png) **Opsworks** ``` import { Opsworks } from "diagrams-js/aws/management"; ``` ![OrganizationsAccount](/resources/aws/management/organizations-account.png) **OrganizationsAccount** ``` import { OrganizationsAccount } from "diagrams-js/aws/management"; ``` ![OrganizationsOrganizationalUnit](/resources/aws/management/organizations-organizational-unit.png) **OrganizationsOrganizationalUnit** ``` import { OrganizationsOrganizationalUnit } from "diagrams-js/aws/management"; ``` ![Organizations](/resources/aws/management/organizations.png) **Organizations** ``` import { Organizations } from "diagrams-js/aws/management"; ``` ![PersonalHealthDashboard](/resources/aws/management/personal-health-dashboard.png) **PersonalHealthDashboard** ``` import { PersonalHealthDashboard } from "diagrams-js/aws/management"; ``` ![Proton](/resources/aws/management/proton.png) **Proton** ``` import { Proton } from "diagrams-js/aws/management"; ``` ![ServiceCatalog](/resources/aws/management/service-catalog.png) **ServiceCatalog** ``` import { ServiceCatalog } from "diagrams-js/aws/management"; ``` ![SystemsManagerAppConfig](/resources/aws/management/systems-manager-app-config.png) **SystemsManagerAppConfig** ``` import { SystemsManagerAppConfig } from "diagrams-js/aws/management"; ``` ![SystemsManagerAutomation](/resources/aws/management/systems-manager-automation.png) **SystemsManagerAutomation** ``` import { SystemsManagerAutomation } from "diagrams-js/aws/management"; ``` ![SystemsManagerDocuments](/resources/aws/management/systems-manager-documents.png) **SystemsManagerDocuments** ``` import { SystemsManagerDocuments } from "diagrams-js/aws/management"; ``` ![SystemsManagerInventory](/resources/aws/management/systems-manager-inventory.png) **SystemsManagerInventory** ``` import { SystemsManagerInventory } from "diagrams-js/aws/management"; ``` ![SystemsManagerMaintenanceWindows](/resources/aws/management/systems-manager-maintenance-windows.png) **SystemsManagerMaintenanceWindows** ``` import { SystemsManagerMaintenanceWindows } from "diagrams-js/aws/management"; ``` ![SystemsManagerOpscenter](/resources/aws/management/systems-manager-opscenter.png) **SystemsManagerOpscenter** ``` import { SystemsManagerOpscenter } from "diagrams-js/aws/management"; ``` ![SystemsManagerParameterStore](/resources/aws/management/systems-manager-parameter-store.png) **SystemsManagerParameterStore** ``` import { SystemsManagerParameterStore } from "diagrams-js/aws/management"; ``` ![SystemsManagerPatchManager](/resources/aws/management/systems-manager-patch-manager.png) **SystemsManagerPatchManager** ``` import { SystemsManagerPatchManager } from "diagrams-js/aws/management"; ``` ![SystemsManagerRunCommand](/resources/aws/management/systems-manager-run-command.png) **SystemsManagerRunCommand** ``` import { SystemsManagerRunCommand } from "diagrams-js/aws/management"; ``` ![SystemsManagerStateManager](/resources/aws/management/systems-manager-state-manager.png) **SystemsManagerStateManager** ``` import { SystemsManagerStateManager } from "diagrams-js/aws/management"; ``` ![SystemsManager](/resources/aws/management/systems-manager.png) **SystemsManager** ``` import { SystemsManager } from "diagrams-js/aws/management"; ``` ![TrustedAdvisorChecklistCost](/resources/aws/management/trusted-advisor-checklist-cost.png) **TrustedAdvisorChecklistCost** ``` import { TrustedAdvisorChecklistCost } from "diagrams-js/aws/management"; ``` ![TrustedAdvisorChecklistFaultTolerant](/resources/aws/management/trusted-advisor-checklist-fault-tolerant.png) **TrustedAdvisorChecklistFaultTolerant** ``` import { TrustedAdvisorChecklistFaultTolerant } from "diagrams-js/aws/management"; ``` ![TrustedAdvisorChecklistPerformance](/resources/aws/management/trusted-advisor-checklist-performance.png) **TrustedAdvisorChecklistPerformance** ``` import { TrustedAdvisorChecklistPerformance } from "diagrams-js/aws/management"; ``` ![TrustedAdvisorChecklistSecurity](/resources/aws/management/trusted-advisor-checklist-security.png) **TrustedAdvisorChecklistSecurity** ``` import { TrustedAdvisorChecklistSecurity } from "diagrams-js/aws/management"; ``` ![TrustedAdvisorChecklist](/resources/aws/management/trusted-advisor-checklist.png) **TrustedAdvisorChecklist** ``` import { TrustedAdvisorChecklist } from "diagrams-js/aws/management"; ``` ![TrustedAdvisor](/resources/aws/management/trusted-advisor.png) **TrustedAdvisor** ``` import { TrustedAdvisor } from "diagrams-js/aws/management"; ``` ![UserNotifications](/resources/aws/management/user-notifications.png) **UserNotifications** ``` import { UserNotifications } from "diagrams-js/aws/management"; ``` ![WellArchitectedTool](/resources/aws/management/well-architected-tool.png) **WellArchitectedTool** ``` import { WellArchitectedTool } from "diagrams-js/aws/management"; ``` ### aws/media[​](#awsmedia "Direct link to aws/media") ![ElasticTranscoder](/resources/aws/media/elastic-transcoder.png) **ElasticTranscoder** ``` import { ElasticTranscoder } from "diagrams-js/aws/media"; ``` ![ElementalConductor](/resources/aws/media/elemental-conductor.png) **ElementalConductor** ``` import { ElementalConductor } from "diagrams-js/aws/media"; ``` ![ElementalDelta](/resources/aws/media/elemental-delta.png) **ElementalDelta** ``` import { ElementalDelta } from "diagrams-js/aws/media"; ``` ![ElementalLive](/resources/aws/media/elemental-live.png) **ElementalLive** ``` import { ElementalLive } from "diagrams-js/aws/media"; ``` ![ElementalMediaconnect](/resources/aws/media/elemental-mediaconnect.png) **ElementalMediaconnect** ``` import { ElementalMediaconnect } from "diagrams-js/aws/media"; ``` ![ElementalMediaconvert](/resources/aws/media/elemental-mediaconvert.png) **ElementalMediaconvert** ``` import { ElementalMediaconvert } from "diagrams-js/aws/media"; ``` ![ElementalMedialive](/resources/aws/media/elemental-medialive.png) **ElementalMedialive** ``` import { ElementalMedialive } from "diagrams-js/aws/media"; ``` ![ElementalMediapackage](/resources/aws/media/elemental-mediapackage.png) **ElementalMediapackage** ``` import { ElementalMediapackage } from "diagrams-js/aws/media"; ``` ![ElementalMediastore](/resources/aws/media/elemental-mediastore.png) **ElementalMediastore** ``` import { ElementalMediastore } from "diagrams-js/aws/media"; ``` ![ElementalMediatailor](/resources/aws/media/elemental-mediatailor.png) **ElementalMediatailor** ``` import { ElementalMediatailor } from "diagrams-js/aws/media"; ``` ![ElementalServer](/resources/aws/media/elemental-server.png) **ElementalServer** ``` import { ElementalServer } from "diagrams-js/aws/media"; ``` ![KinesisVideoStreams](/resources/aws/media/kinesis-video-streams.png) **KinesisVideoStreams** ``` import { KinesisVideoStreams } from "diagrams-js/aws/media"; ``` ![MediaServices](/resources/aws/media/media-services.png) **MediaServices** ``` import { MediaServices } from "diagrams-js/aws/media"; ``` ### aws/migration[​](#awsmigration "Direct link to aws/migration") ![ApplicationDiscoveryService](/resources/aws/migration/application-discovery-service.png) **ApplicationDiscoveryService** ``` import { ApplicationDiscoveryService } from "diagrams-js/aws/migration"; ``` ![CloudendureMigration](/resources/aws/migration/cloudendure-migration.png) **CloudendureMigration** ``` import { CloudendureMigration } from "diagrams-js/aws/migration"; ``` ![DatabaseMigrationService](/resources/aws/migration/database-migration-service.png) **DatabaseMigrationService** ``` import { DatabaseMigrationService } from "diagrams-js/aws/migration"; ``` ![DatasyncAgent](/resources/aws/migration/datasync-agent.png) **DatasyncAgent** ``` import { DatasyncAgent } from "diagrams-js/aws/migration"; ``` ![Datasync](/resources/aws/migration/datasync.png) **Datasync** ``` import { Datasync } from "diagrams-js/aws/migration"; ``` ![MigrationAndTransfer](/resources/aws/migration/migration-and-transfer.png) **MigrationAndTransfer** ``` import { MigrationAndTransfer } from "diagrams-js/aws/migration"; ``` ![MigrationHub](/resources/aws/migration/migration-hub.png) **MigrationHub** ``` import { MigrationHub } from "diagrams-js/aws/migration"; ``` ![ServerMigrationService](/resources/aws/migration/server-migration-service.png) **ServerMigrationService** ``` import { ServerMigrationService } from "diagrams-js/aws/migration"; ``` ![SnowballEdge](/resources/aws/migration/snowball-edge.png) **SnowballEdge** ``` import { SnowballEdge } from "diagrams-js/aws/migration"; ``` ![Snowball](/resources/aws/migration/snowball.png) **Snowball** ``` import { Snowball } from "diagrams-js/aws/migration"; ``` ![Snowmobile](/resources/aws/migration/snowmobile.png) **Snowmobile** ``` import { Snowmobile } from "diagrams-js/aws/migration"; ``` ![TransferForSftp](/resources/aws/migration/transfer-for-sftp.png) **TransferForSftp** ``` import { TransferForSftp } from "diagrams-js/aws/migration"; ``` ### aws/ml[​](#awsml "Direct link to aws/ml") ![ApacheMxnetOnAWS](/resources/aws/ml/apache-mxnet-on-aws.png) **ApacheMxnetOnAWS** ``` import { ApacheMxnetOnAWS } from "diagrams-js/aws/ml"; ``` ![AugmentedAi](/resources/aws/ml/augmented-ai.png) **AugmentedAi** ``` import { AugmentedAi } from "diagrams-js/aws/ml"; ``` ![Bedrock](/resources/aws/ml/bedrock.png) **Bedrock** ``` import { Bedrock } from "diagrams-js/aws/ml"; ``` ![Comprehend](/resources/aws/ml/comprehend.png) **Comprehend** ``` import { Comprehend } from "diagrams-js/aws/ml"; ``` ![DeepLearningAmis](/resources/aws/ml/deep-learning-amis.png) **DeepLearningAmis** ``` import { DeepLearningAmis } from "diagrams-js/aws/ml"; ``` ![DeepLearningContainers](/resources/aws/ml/deep-learning-containers.png) **DeepLearningContainers** ``` import { DeepLearningContainers } from "diagrams-js/aws/ml"; ``` ![Deepcomposer](/resources/aws/ml/deepcomposer.png) **Deepcomposer** ``` import { Deepcomposer } from "diagrams-js/aws/ml"; ``` ![Deeplens](/resources/aws/ml/deeplens.png) **Deeplens** ``` import { Deeplens } from "diagrams-js/aws/ml"; ``` ![Deepracer](/resources/aws/ml/deepracer.png) **Deepracer** ``` import { Deepracer } from "diagrams-js/aws/ml"; ``` ![ElasticInference](/resources/aws/ml/elastic-inference.png) **ElasticInference** ``` import { ElasticInference } from "diagrams-js/aws/ml"; ``` ![Forecast](/resources/aws/ml/forecast.png) **Forecast** ``` import { Forecast } from "diagrams-js/aws/ml"; ``` ![FraudDetector](/resources/aws/ml/fraud-detector.png) **FraudDetector** ``` import { FraudDetector } from "diagrams-js/aws/ml"; ``` ![Kendra](/resources/aws/ml/kendra.png) **Kendra** ``` import { Kendra } from "diagrams-js/aws/ml"; ``` ![Lex](/resources/aws/ml/lex.png) **Lex** ``` import { Lex } from "diagrams-js/aws/ml"; ``` ![MachineLearning](/resources/aws/ml/machine-learning.png) **MachineLearning** ``` import { MachineLearning } from "diagrams-js/aws/ml"; ``` ![Personalize](/resources/aws/ml/personalize.png) **Personalize** ``` import { Personalize } from "diagrams-js/aws/ml"; ``` ![Polly](/resources/aws/ml/polly.png) **Polly** ``` import { Polly } from "diagrams-js/aws/ml"; ``` ![Q](/resources/aws/ml/q.png) **Q** ``` import { Q } from "diagrams-js/aws/ml"; ``` ![RekognitionImage](/resources/aws/ml/rekognition-image.png) **RekognitionImage** ``` import { RekognitionImage } from "diagrams-js/aws/ml"; ``` ![RekognitionVideo](/resources/aws/ml/rekognition-video.png) **RekognitionVideo** ``` import { RekognitionVideo } from "diagrams-js/aws/ml"; ``` ![Rekognition](/resources/aws/ml/rekognition.png) **Rekognition** ``` import { Rekognition } from "diagrams-js/aws/ml"; ``` ![SagemakerGroundTruth](/resources/aws/ml/sagemaker-ground-truth.png) **SagemakerGroundTruth** ``` import { SagemakerGroundTruth } from "diagrams-js/aws/ml"; ``` ![SagemakerModel](/resources/aws/ml/sagemaker-model.png) **SagemakerModel** ``` import { SagemakerModel } from "diagrams-js/aws/ml"; ``` ![SagemakerNotebook](/resources/aws/ml/sagemaker-notebook.png) **SagemakerNotebook** ``` import { SagemakerNotebook } from "diagrams-js/aws/ml"; ``` ![SagemakerTrainingJob](/resources/aws/ml/sagemaker-training-job.png) **SagemakerTrainingJob** ``` import { SagemakerTrainingJob } from "diagrams-js/aws/ml"; ``` ![Sagemaker](/resources/aws/ml/sagemaker.png) **Sagemaker** ``` import { Sagemaker } from "diagrams-js/aws/ml"; ``` ![TensorflowOnAWS](/resources/aws/ml/tensorflow-on-aws.png) **TensorflowOnAWS** ``` import { TensorflowOnAWS } from "diagrams-js/aws/ml"; ``` ![Textract](/resources/aws/ml/textract.png) **Textract** ``` import { Textract } from "diagrams-js/aws/ml"; ``` ![Transcribe](/resources/aws/ml/transcribe.png) **Transcribe** ``` import { Transcribe } from "diagrams-js/aws/ml"; ``` ![Transform](/resources/aws/ml/transform.png) **Transform** ``` import { Transform } from "diagrams-js/aws/ml"; ``` ![Translate](/resources/aws/ml/translate.png) **Translate** ``` import { Translate } from "diagrams-js/aws/ml"; ``` ### aws/mobile[​](#awsmobile "Direct link to aws/mobile") ![Amplify](/resources/aws/mobile/amplify.png) **Amplify** ``` import { Amplify } from "diagrams-js/aws/mobile"; ``` ![APIGatewayEndpoint](/resources/aws/mobile/api-gateway-endpoint.png) **APIGatewayEndpoint** ``` import { APIGatewayEndpoint } from "diagrams-js/aws/mobile"; ``` ![APIGateway](/resources/aws/mobile/api-gateway.png) **APIGateway** ``` import { APIGateway } from "diagrams-js/aws/mobile"; ``` ![Appsync](/resources/aws/mobile/appsync.png) **Appsync** ``` import { Appsync } from "diagrams-js/aws/mobile"; ``` ![DeviceFarm](/resources/aws/mobile/device-farm.png) **DeviceFarm** ``` import { DeviceFarm } from "diagrams-js/aws/mobile"; ``` ![Mobile](/resources/aws/mobile/mobile.png) **Mobile** ``` import { Mobile } from "diagrams-js/aws/mobile"; ``` ![Pinpoint](/resources/aws/mobile/pinpoint.png) **Pinpoint** ``` import { Pinpoint } from "diagrams-js/aws/mobile"; ``` ### aws/network[​](#awsnetwork "Direct link to aws/network") ![APIGatewayEndpoint](/resources/aws/network/api-gateway-endpoint.png) **APIGatewayEndpoint** ``` import { APIGatewayEndpoint } from "diagrams-js/aws/network"; ``` ![APIGateway](/resources/aws/network/api-gateway.png) **APIGateway** ``` import { APIGateway } from "diagrams-js/aws/network"; ``` ![AppMesh](/resources/aws/network/app-mesh.png) **AppMesh** ``` import { AppMesh } from "diagrams-js/aws/network"; ``` ![ClientVpn](/resources/aws/network/client-vpn.png) **ClientVpn** ``` import { ClientVpn } from "diagrams-js/aws/network"; ``` ![CloudMap](/resources/aws/network/cloud-map.png) **CloudMap** ``` import { CloudMap } from "diagrams-js/aws/network"; ``` ![CloudFrontDownloadDistribution](/resources/aws/network/cloudfront-download-distribution.png) **CloudFrontDownloadDistribution** ``` import { CloudFrontDownloadDistribution } from "diagrams-js/aws/network"; ``` ![CloudFrontEdgeLocation](/resources/aws/network/cloudfront-edge-location.png) **CloudFrontEdgeLocation** ``` import { CloudFrontEdgeLocation } from "diagrams-js/aws/network"; ``` ![CloudFrontStreamingDistribution](/resources/aws/network/cloudfront-streaming-distribution.png) **CloudFrontStreamingDistribution** ``` import { CloudFrontStreamingDistribution } from "diagrams-js/aws/network"; ``` ![CloudFront](/resources/aws/network/cloudfront.png) **CloudFront** ``` import { CloudFront } from "diagrams-js/aws/network"; ``` ![DirectConnect](/resources/aws/network/direct-connect.png) **DirectConnect** ``` import { DirectConnect } from "diagrams-js/aws/network"; ``` ![ElasticLoadBalancing](/resources/aws/network/elastic-load-balancing.png) **ElasticLoadBalancing** ``` import { ElasticLoadBalancing } from "diagrams-js/aws/network"; ``` ![ElbApplicationLoadBalancer](/resources/aws/network/elb-application-load-balancer.png) **ElbApplicationLoadBalancer** ``` import { ElbApplicationLoadBalancer } from "diagrams-js/aws/network"; ``` ![ElbClassicLoadBalancer](/resources/aws/network/elb-classic-load-balancer.png) **ElbClassicLoadBalancer** ``` import { ElbClassicLoadBalancer } from "diagrams-js/aws/network"; ``` ![ElbNetworkLoadBalancer](/resources/aws/network/elb-network-load-balancer.png) **ElbNetworkLoadBalancer** ``` import { ElbNetworkLoadBalancer } from "diagrams-js/aws/network"; ``` ![Endpoint](/resources/aws/network/endpoint.png) **Endpoint** ``` import { Endpoint } from "diagrams-js/aws/network"; ``` ![GlobalAccelerator](/resources/aws/network/global-accelerator.png) **GlobalAccelerator** ``` import { GlobalAccelerator } from "diagrams-js/aws/network"; ``` ![InternetGateway](/resources/aws/network/internet-gateway.png) **InternetGateway** ``` import { InternetGateway } from "diagrams-js/aws/network"; ``` ![Nacl](/resources/aws/network/nacl.png) **Nacl** ``` import { Nacl } from "diagrams-js/aws/network"; ``` ![NATGateway](/resources/aws/network/nat-gateway.png) **NATGateway** ``` import { NATGateway } from "diagrams-js/aws/network"; ``` ![NetworkFirewall](/resources/aws/network/network-firewall.png) **NetworkFirewall** ``` import { NetworkFirewall } from "diagrams-js/aws/network"; ``` ![NetworkingAndContentDelivery](/resources/aws/network/networking-and-content-delivery.png) **NetworkingAndContentDelivery** ``` import { NetworkingAndContentDelivery } from "diagrams-js/aws/network"; ``` ![PrivateSubnet](/resources/aws/network/private-subnet.png) **PrivateSubnet** ``` import { PrivateSubnet } from "diagrams-js/aws/network"; ``` ![Privatelink](/resources/aws/network/privatelink.png) **Privatelink** ``` import { Privatelink } from "diagrams-js/aws/network"; ``` ![PublicSubnet](/resources/aws/network/public-subnet.png) **PublicSubnet** ``` import { PublicSubnet } from "diagrams-js/aws/network"; ``` ![Route53HostedZone](/resources/aws/network/route-53-hosted-zone.png) **Route53HostedZone** ``` import { Route53HostedZone } from "diagrams-js/aws/network"; ``` ![Route53](/resources/aws/network/route-53.png) **Route53** ``` import { Route53 } from "diagrams-js/aws/network"; ``` ![RouteTable](/resources/aws/network/route-table.png) **RouteTable** ``` import { RouteTable } from "diagrams-js/aws/network"; ``` ![SiteToSiteVpn](/resources/aws/network/site-to-site-vpn.png) **SiteToSiteVpn** ``` import { SiteToSiteVpn } from "diagrams-js/aws/network"; ``` ![TransitGatewayAttachment](/resources/aws/network/transit-gateway-attachment.png) **TransitGatewayAttachment** ``` import { TransitGatewayAttachment } from "diagrams-js/aws/network"; ``` ![TransitGateway](/resources/aws/network/transit-gateway.png) **TransitGateway** ``` import { TransitGateway } from "diagrams-js/aws/network"; ``` ![VPCCustomerGateway](/resources/aws/network/vpc-customer-gateway.png) **VPCCustomerGateway** ``` import { VPCCustomerGateway } from "diagrams-js/aws/network"; ``` ![VPCElasticNetworkAdapter](/resources/aws/network/vpc-elastic-network-adapter.png) **VPCElasticNetworkAdapter** ``` import { VPCElasticNetworkAdapter } from "diagrams-js/aws/network"; ``` ![VPCElasticNetworkInterface](/resources/aws/network/vpc-elastic-network-interface.png) **VPCElasticNetworkInterface** ``` import { VPCElasticNetworkInterface } from "diagrams-js/aws/network"; ``` ![VPCFlowLogs](/resources/aws/network/vpc-flow-logs.png) **VPCFlowLogs** ``` import { VPCFlowLogs } from "diagrams-js/aws/network"; ``` ![VPCPeering](/resources/aws/network/vpc-peering.png) **VPCPeering** ``` import { VPCPeering } from "diagrams-js/aws/network"; ``` ![VPCRouter](/resources/aws/network/vpc-router.png) **VPCRouter** ``` import { VPCRouter } from "diagrams-js/aws/network"; ``` ![VPCTrafficMirroring](/resources/aws/network/vpc-traffic-mirroring.png) **VPCTrafficMirroring** ``` import { VPCTrafficMirroring } from "diagrams-js/aws/network"; ``` ![VPC](/resources/aws/network/vpc.png) **VPC** ``` import { VPC } from "diagrams-js/aws/network"; ``` ![VpnConnection](/resources/aws/network/vpn-connection.png) **VpnConnection** ``` import { VpnConnection } from "diagrams-js/aws/network"; ``` ![VpnGateway](/resources/aws/network/vpn-gateway.png) **VpnGateway** ``` import { VpnGateway } from "diagrams-js/aws/network"; ``` ### aws/quantum[​](#awsquantum "Direct link to aws/quantum") ![Braket](/resources/aws/quantum/braket.png) **Braket** ``` import { Braket } from "diagrams-js/aws/quantum"; ``` ![QuantumTechnologies](/resources/aws/quantum/quantum-technologies.png) **QuantumTechnologies** ``` import { QuantumTechnologies } from "diagrams-js/aws/quantum"; ``` ### aws/robotics[​](#awsrobotics "Direct link to aws/robotics") ![RobomakerCloudExtensionRos](/resources/aws/robotics/robomaker-cloud-extension-ros.png) **RobomakerCloudExtensionRos** ``` import { RobomakerCloudExtensionRos } from "diagrams-js/aws/robotics"; ``` ![RobomakerDevelopmentEnvironment](/resources/aws/robotics/robomaker-development-environment.png) **RobomakerDevelopmentEnvironment** ``` import { RobomakerDevelopmentEnvironment } from "diagrams-js/aws/robotics"; ``` ![RobomakerFleetManagement](/resources/aws/robotics/robomaker-fleet-management.png) **RobomakerFleetManagement** ``` import { RobomakerFleetManagement } from "diagrams-js/aws/robotics"; ``` ![RobomakerSimulator](/resources/aws/robotics/robomaker-simulator.png) **RobomakerSimulator** ``` import { RobomakerSimulator } from "diagrams-js/aws/robotics"; ``` ![Robomaker](/resources/aws/robotics/robomaker.png) **Robomaker** ``` import { Robomaker } from "diagrams-js/aws/robotics"; ``` ![Robotics](/resources/aws/robotics/robotics.png) **Robotics** ``` import { Robotics } from "diagrams-js/aws/robotics"; ``` ### aws/satellite[​](#awssatellite "Direct link to aws/satellite") ![GroundStation](/resources/aws/satellite/ground-station.png) **GroundStation** ``` import { GroundStation } from "diagrams-js/aws/satellite"; ``` ![Satellite](/resources/aws/satellite/satellite.png) **Satellite** ``` import { Satellite } from "diagrams-js/aws/satellite"; ``` ### aws/security[​](#awssecurity "Direct link to aws/security") ![AdConnector](/resources/aws/security/ad-connector.png) **AdConnector** ``` import { AdConnector } from "diagrams-js/aws/security"; ``` ![Artifact](/resources/aws/security/artifact.png) **Artifact** ``` import { Artifact } from "diagrams-js/aws/security"; ``` ![CertificateAuthority](/resources/aws/security/certificate-authority.png) **CertificateAuthority** ``` import { CertificateAuthority } from "diagrams-js/aws/security"; ``` ![CertificateManager](/resources/aws/security/certificate-manager.png) **CertificateManager** ``` import { CertificateManager } from "diagrams-js/aws/security"; ``` ![CloudDirectory](/resources/aws/security/cloud-directory.png) **CloudDirectory** ``` import { CloudDirectory } from "diagrams-js/aws/security"; ``` ![Cloudhsm](/resources/aws/security/cloudhsm.png) **Cloudhsm** ``` import { Cloudhsm } from "diagrams-js/aws/security"; ``` ![Cognito](/resources/aws/security/cognito.png) **Cognito** ``` import { Cognito } from "diagrams-js/aws/security"; ``` ![Detective](/resources/aws/security/detective.png) **Detective** ``` import { Detective } from "diagrams-js/aws/security"; ``` ![DirectoryService](/resources/aws/security/directory-service.png) **DirectoryService** ``` import { DirectoryService } from "diagrams-js/aws/security"; ``` ![FirewallManager](/resources/aws/security/firewall-manager.png) **FirewallManager** ``` import { FirewallManager } from "diagrams-js/aws/security"; ``` ![Guardduty](/resources/aws/security/guardduty.png) **Guardduty** ``` import { Guardduty } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamAccessAnalyzer](/resources/aws/security/identity-and-access-management-iam-access-analyzer.png) **IdentityAndAccessManagementIamAccessAnalyzer** ``` import { IdentityAndAccessManagementIamAccessAnalyzer } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamAddOn](/resources/aws/security/identity-and-access-management-iam-add-on.png) **IdentityAndAccessManagementIamAddOn** ``` import { IdentityAndAccessManagementIamAddOn } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamAWSStsAlternate](/resources/aws/security/identity-and-access-management-iam-aws-sts-alternate.png) **IdentityAndAccessManagementIamAWSStsAlternate** ``` import { IdentityAndAccessManagementIamAWSStsAlternate } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamAWSSts](/resources/aws/security/identity-and-access-management-iam-aws-sts.png) **IdentityAndAccessManagementIamAWSSts** ``` import { IdentityAndAccessManagementIamAWSSts } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamDataEncryptionKey](/resources/aws/security/identity-and-access-management-iam-data-encryption-key.png) **IdentityAndAccessManagementIamDataEncryptionKey** ``` import { IdentityAndAccessManagementIamDataEncryptionKey } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamEncryptedData](/resources/aws/security/identity-and-access-management-iam-encrypted-data.png) **IdentityAndAccessManagementIamEncryptedData** ``` import { IdentityAndAccessManagementIamEncryptedData } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamLongTermSecurityCredential](/resources/aws/security/identity-and-access-management-iam-long-term-security-credential.png) **IdentityAndAccessManagementIamLongTermSecurityCredential** ``` import { IdentityAndAccessManagementIamLongTermSecurityCredential } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamMfaToken](/resources/aws/security/identity-and-access-management-iam-mfa-token.png) **IdentityAndAccessManagementIamMfaToken** ``` import { IdentityAndAccessManagementIamMfaToken } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamPermissions](/resources/aws/security/identity-and-access-management-iam-permissions.png) **IdentityAndAccessManagementIamPermissions** ``` import { IdentityAndAccessManagementIamPermissions } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamRole](/resources/aws/security/identity-and-access-management-iam-role.png) **IdentityAndAccessManagementIamRole** ``` import { IdentityAndAccessManagementIamRole } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIamTemporarySecurityCredential](/resources/aws/security/identity-and-access-management-iam-temporary-security-credential.png) **IdentityAndAccessManagementIamTemporarySecurityCredential** ``` import { IdentityAndAccessManagementIamTemporarySecurityCredential } from "diagrams-js/aws/security"; ``` ![IdentityAndAccessManagementIam](/resources/aws/security/identity-and-access-management-iam.png) **IdentityAndAccessManagementIam** ``` import { IdentityAndAccessManagementIam } from "diagrams-js/aws/security"; ``` ![InspectorAgent](/resources/aws/security/inspector-agent.png) **InspectorAgent** ``` import { InspectorAgent } from "diagrams-js/aws/security"; ``` ![Inspector](/resources/aws/security/inspector.png) **Inspector** ``` import { Inspector } from "diagrams-js/aws/security"; ``` ![KeyManagementService](/resources/aws/security/key-management-service.png) **KeyManagementService** ``` import { KeyManagementService } from "diagrams-js/aws/security"; ``` ![Macie](/resources/aws/security/macie.png) **Macie** ``` import { Macie } from "diagrams-js/aws/security"; ``` ![ManagedMicrosoftAd](/resources/aws/security/managed-microsoft-ad.png) **ManagedMicrosoftAd** ``` import { ManagedMicrosoftAd } from "diagrams-js/aws/security"; ``` ![ResourceAccessManager](/resources/aws/security/resource-access-manager.png) **ResourceAccessManager** ``` import { ResourceAccessManager } from "diagrams-js/aws/security"; ``` ![SecretsManager](/resources/aws/security/secrets-manager.png) **SecretsManager** ``` import { SecretsManager } from "diagrams-js/aws/security"; ``` ![SecurityHubFinding](/resources/aws/security/security-hub-finding.png) **SecurityHubFinding** ``` import { SecurityHubFinding } from "diagrams-js/aws/security"; ``` ![SecurityHub](/resources/aws/security/security-hub.png) **SecurityHub** ``` import { SecurityHub } from "diagrams-js/aws/security"; ``` ![SecurityIdentityAndCompliance](/resources/aws/security/security-identity-and-compliance.png) **SecurityIdentityAndCompliance** ``` import { SecurityIdentityAndCompliance } from "diagrams-js/aws/security"; ``` ![SecurityLake](/resources/aws/security/security-lake.png) **SecurityLake** ``` import { SecurityLake } from "diagrams-js/aws/security"; ``` ![ShieldAdvanced](/resources/aws/security/shield-advanced.png) **ShieldAdvanced** ``` import { ShieldAdvanced } from "diagrams-js/aws/security"; ``` ![Shield](/resources/aws/security/shield.png) **Shield** ``` import { Shield } from "diagrams-js/aws/security"; ``` ![SimpleAd](/resources/aws/security/simple-ad.png) **SimpleAd** ``` import { SimpleAd } from "diagrams-js/aws/security"; ``` ![SingleSignOn](/resources/aws/security/single-sign-on.png) **SingleSignOn** ``` import { SingleSignOn } from "diagrams-js/aws/security"; ``` ![WAFFilteringRule](/resources/aws/security/waf-filtering-rule.png) **WAFFilteringRule** ``` import { WAFFilteringRule } from "diagrams-js/aws/security"; ``` ![WAF](/resources/aws/security/waf.png) **WAF** ``` import { WAF } from "diagrams-js/aws/security"; ``` ### aws/storage[​](#awsstorage "Direct link to aws/storage") ![Backup](/resources/aws/storage/backup.png) **Backup** ``` import { Backup } from "diagrams-js/aws/storage"; ``` ![CloudendureDisasterRecovery](/resources/aws/storage/cloudendure-disaster-recovery.png) **CloudendureDisasterRecovery** ``` import { CloudendureDisasterRecovery } from "diagrams-js/aws/storage"; ``` ![EFSInfrequentaccessPrimaryBg](/resources/aws/storage/efs-infrequentaccess-primary-bg.png) **EFSInfrequentaccessPrimaryBg** ``` import { EFSInfrequentaccessPrimaryBg } from "diagrams-js/aws/storage"; ``` ![EFSStandardPrimaryBg](/resources/aws/storage/efs-standard-primary-bg.png) **EFSStandardPrimaryBg** ``` import { EFSStandardPrimaryBg } from "diagrams-js/aws/storage"; ``` ![ElasticBlockStoreEBSSnapshot](/resources/aws/storage/elastic-block-store-ebs-snapshot.png) **ElasticBlockStoreEBSSnapshot** ``` import { ElasticBlockStoreEBSSnapshot } from "diagrams-js/aws/storage"; ``` ![ElasticBlockStoreEBSVolume](/resources/aws/storage/elastic-block-store-ebs-volume.png) **ElasticBlockStoreEBSVolume** ``` import { ElasticBlockStoreEBSVolume } from "diagrams-js/aws/storage"; ``` ![ElasticBlockStoreEBS](/resources/aws/storage/elastic-block-store-ebs.png) **ElasticBlockStoreEBS** ``` import { ElasticBlockStoreEBS } from "diagrams-js/aws/storage"; ``` ![ElasticFileSystemEFSFileSystem](/resources/aws/storage/elastic-file-system-efs-file-system.png) **ElasticFileSystemEFSFileSystem** ``` import { ElasticFileSystemEFSFileSystem } from "diagrams-js/aws/storage"; ``` ![ElasticFileSystemEFS](/resources/aws/storage/elastic-file-system-efs.png) **ElasticFileSystemEFS** ``` import { ElasticFileSystemEFS } from "diagrams-js/aws/storage"; ``` ![FsxForLustre](/resources/aws/storage/fsx-for-lustre.png) **FsxForLustre** ``` import { FsxForLustre } from "diagrams-js/aws/storage"; ``` ![FsxForWindowsFileServer](/resources/aws/storage/fsx-for-windows-file-server.png) **FsxForWindowsFileServer** ``` import { FsxForWindowsFileServer } from "diagrams-js/aws/storage"; ``` ![Fsx](/resources/aws/storage/fsx.png) **Fsx** ``` import { Fsx } from "diagrams-js/aws/storage"; ``` ![MultipleVolumesResource](/resources/aws/storage/multiple-volumes-resource.png) **MultipleVolumesResource** ``` import { MultipleVolumesResource } from "diagrams-js/aws/storage"; ``` ![S3AccessPoints](/resources/aws/storage/s3-access-points.png) **S3AccessPoints** ``` import { S3AccessPoints } from "diagrams-js/aws/storage"; ``` ![S3GlacierArchive](/resources/aws/storage/s3-glacier-archive.png) **S3GlacierArchive** ``` import { S3GlacierArchive } from "diagrams-js/aws/storage"; ``` ![S3GlacierVault](/resources/aws/storage/s3-glacier-vault.png) **S3GlacierVault** ``` import { S3GlacierVault } from "diagrams-js/aws/storage"; ``` ![S3Glacier](/resources/aws/storage/s3-glacier.png) **S3Glacier** ``` import { S3Glacier } from "diagrams-js/aws/storage"; ``` ![S3ObjectLambdaAccessPoints](/resources/aws/storage/s3-object-lambda-access-points.png) **S3ObjectLambdaAccessPoints** ``` import { S3ObjectLambdaAccessPoints } from "diagrams-js/aws/storage"; ``` ![SimpleStorageServiceS3BucketWithObjects](/resources/aws/storage/simple-storage-service-s3-bucket-with-objects.png) **SimpleStorageServiceS3BucketWithObjects** ``` import { SimpleStorageServiceS3BucketWithObjects } from "diagrams-js/aws/storage"; ``` ![SimpleStorageServiceS3Bucket](/resources/aws/storage/simple-storage-service-s3-bucket.png) **SimpleStorageServiceS3Bucket** ``` import { SimpleStorageServiceS3Bucket } from "diagrams-js/aws/storage"; ``` ![SimpleStorageServiceS3Object](/resources/aws/storage/simple-storage-service-s3-object.png) **SimpleStorageServiceS3Object** ``` import { SimpleStorageServiceS3Object } from "diagrams-js/aws/storage"; ``` ![SimpleStorageServiceS3](/resources/aws/storage/simple-storage-service-s3.png) **SimpleStorageServiceS3** ``` import { SimpleStorageServiceS3 } from "diagrams-js/aws/storage"; ``` ![SnowFamilySnowballImportExport](/resources/aws/storage/snow-family-snowball-import-export.png) **SnowFamilySnowballImportExport** ``` import { SnowFamilySnowballImportExport } from "diagrams-js/aws/storage"; ``` ![SnowballEdge](/resources/aws/storage/snowball-edge.png) **SnowballEdge** ``` import { SnowballEdge } from "diagrams-js/aws/storage"; ``` ![Snowball](/resources/aws/storage/snowball.png) **Snowball** ``` import { Snowball } from "diagrams-js/aws/storage"; ``` ![Snowmobile](/resources/aws/storage/snowmobile.png) **Snowmobile** ``` import { Snowmobile } from "diagrams-js/aws/storage"; ``` ![StorageGatewayCachedVolume](/resources/aws/storage/storage-gateway-cached-volume.png) **StorageGatewayCachedVolume** ``` import { StorageGatewayCachedVolume } from "diagrams-js/aws/storage"; ``` ![StorageGatewayNonCachedVolume](/resources/aws/storage/storage-gateway-non-cached-volume.png) **StorageGatewayNonCachedVolume** ``` import { StorageGatewayNonCachedVolume } from "diagrams-js/aws/storage"; ``` ![StorageGatewayVirtualTapeLibrary](/resources/aws/storage/storage-gateway-virtual-tape-library.png) **StorageGatewayVirtualTapeLibrary** ``` import { StorageGatewayVirtualTapeLibrary } from "diagrams-js/aws/storage"; ``` ![StorageGateway](/resources/aws/storage/storage-gateway.png) **StorageGateway** ``` import { StorageGateway } from "diagrams-js/aws/storage"; ``` ![Storage](/resources/aws/storage/storage.png) **Storage** ``` import { Storage } from "diagrams-js/aws/storage"; ``` --- # Azure Node classes list for the Azure provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { AIStudio, AnomalyDetector, AzureAppliedAIServices, } from "diagrams-js/azure/aimachinelearning"; import { AnalysisServices, AzureDataExplorerClusters, AzureDatabricks, } from "diagrams-js/azure/analytics"; const diagram = Diagram("Azure Architecture", { direction: "TB" }); const node1 = diagram.add(AIStudio("Node 1")); const node2 = diagram.add(AnalysisServices("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/azure) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### azure/aimachinelearning[​](#azureaimachinelearning "Direct link to azure/aimachinelearning") ![AIStudio](/resources/azure/aimachinelearning/ai-studio.png) **AIStudio** ``` import { AIStudio } from "diagrams-js/azure/aimachinelearning"; ``` ![AnomalyDetector](/resources/azure/aimachinelearning/anomaly-detector.png) **AnomalyDetector** ``` import { AnomalyDetector } from "diagrams-js/azure/aimachinelearning"; ``` ![AzureAppliedAIServices](/resources/azure/aimachinelearning/azure-applied-ai-services.png) **AzureAppliedAIServices** ``` import { AzureAppliedAIServices } from "diagrams-js/azure/aimachinelearning"; ``` ![AzureExperimentationStudio](/resources/azure/aimachinelearning/azure-experimentation-studio.png) **AzureExperimentationStudio** ``` import { AzureExperimentationStudio } from "diagrams-js/azure/aimachinelearning"; ``` ![AzureObjectUnderstanding](/resources/azure/aimachinelearning/azure-object-understanding.png) **AzureObjectUnderstanding** ``` import { AzureObjectUnderstanding } from "diagrams-js/azure/aimachinelearning"; ``` ![AzureOpenai](/resources/azure/aimachinelearning/azure-openai.png) **AzureOpenai** ``` import { AzureOpenai } from "diagrams-js/azure/aimachinelearning"; ``` ![BatchAI](/resources/azure/aimachinelearning/batch-ai.png) **BatchAI** ``` import { BatchAI } from "diagrams-js/azure/aimachinelearning"; ``` ![Bonsai](/resources/azure/aimachinelearning/bonsai.png) **Bonsai** ``` import { Bonsai } from "diagrams-js/azure/aimachinelearning"; ``` ![BotServices](/resources/azure/aimachinelearning/bot-services.png) **BotServices** ``` import { BotServices } from "diagrams-js/azure/aimachinelearning"; ``` ![CognitiveSearch](/resources/azure/aimachinelearning/cognitive-search.png) **CognitiveSearch** ``` import { CognitiveSearch } from "diagrams-js/azure/aimachinelearning"; ``` ![CognitiveServicesDecisions](/resources/azure/aimachinelearning/cognitive-services-decisions.png) **CognitiveServicesDecisions** ``` import { CognitiveServicesDecisions } from "diagrams-js/azure/aimachinelearning"; ``` ![CognitiveServices](/resources/azure/aimachinelearning/cognitive-services.png) **CognitiveServices** ``` import { CognitiveServices } from "diagrams-js/azure/aimachinelearning"; ``` ![ComputerVision](/resources/azure/aimachinelearning/computer-vision.png) **ComputerVision** ``` import { ComputerVision } from "diagrams-js/azure/aimachinelearning"; ``` ![ContentModerators](/resources/azure/aimachinelearning/content-moderators.png) **ContentModerators** ``` import { ContentModerators } from "diagrams-js/azure/aimachinelearning"; ``` ![CustomVision](/resources/azure/aimachinelearning/custom-vision.png) **CustomVision** ``` import { CustomVision } from "diagrams-js/azure/aimachinelearning"; ``` ![FaceApis](/resources/azure/aimachinelearning/face-apis.png) **FaceApis** ``` import { FaceApis } from "diagrams-js/azure/aimachinelearning"; ``` ![FormRecognizers](/resources/azure/aimachinelearning/form-recognizers.png) **FormRecognizers** ``` import { FormRecognizers } from "diagrams-js/azure/aimachinelearning"; ``` ![GenomicsAccounts](/resources/azure/aimachinelearning/genomics-accounts.png) **GenomicsAccounts** ``` import { GenomicsAccounts } from "diagrams-js/azure/aimachinelearning"; ``` ![Genomics](/resources/azure/aimachinelearning/genomics.png) **Genomics** ``` import { Genomics } from "diagrams-js/azure/aimachinelearning"; ``` ![ImmersiveReaders](/resources/azure/aimachinelearning/immersive-readers.png) **ImmersiveReaders** ``` import { ImmersiveReaders } from "diagrams-js/azure/aimachinelearning"; ``` ![LanguageUnderstanding](/resources/azure/aimachinelearning/language-understanding.png) **LanguageUnderstanding** ``` import { LanguageUnderstanding } from "diagrams-js/azure/aimachinelearning"; ``` ![Language](/resources/azure/aimachinelearning/language.png) **Language** ``` import { Language } from "diagrams-js/azure/aimachinelearning"; ``` ![MachineLearningStudioClassicWebServices](/resources/azure/aimachinelearning/machine-learning-studio-classic-web-services.png) **MachineLearningStudioClassicWebServices** ``` import { MachineLearningStudioClassicWebServices } from "diagrams-js/azure/aimachinelearning"; ``` ![MachineLearningStudioWebServicePlans](/resources/azure/aimachinelearning/machine-learning-studio-web-service-plans.png) **MachineLearningStudioWebServicePlans** ``` import { MachineLearningStudioWebServicePlans } from "diagrams-js/azure/aimachinelearning"; ``` ![MachineLearningStudioWorkspaces](/resources/azure/aimachinelearning/machine-learning-studio-workspaces.png) **MachineLearningStudioWorkspaces** ``` import { MachineLearningStudioWorkspaces } from "diagrams-js/azure/aimachinelearning"; ``` ![MachineLearning](/resources/azure/aimachinelearning/machine-learning.png) **MachineLearning** ``` import { MachineLearning } from "diagrams-js/azure/aimachinelearning"; ``` ![MetricsAdvisor](/resources/azure/aimachinelearning/metrics-advisor.png) **MetricsAdvisor** ``` import { MetricsAdvisor } from "diagrams-js/azure/aimachinelearning"; ``` ![Personalizers](/resources/azure/aimachinelearning/personalizers.png) **Personalizers** ``` import { Personalizers } from "diagrams-js/azure/aimachinelearning"; ``` ![QnaMakers](/resources/azure/aimachinelearning/qna-makers.png) **QnaMakers** ``` import { QnaMakers } from "diagrams-js/azure/aimachinelearning"; ``` ![ServerlessSearch](/resources/azure/aimachinelearning/serverless-search.png) **ServerlessSearch** ``` import { ServerlessSearch } from "diagrams-js/azure/aimachinelearning"; ``` ![SpeechServices](/resources/azure/aimachinelearning/speech-services.png) **SpeechServices** ``` import { SpeechServices } from "diagrams-js/azure/aimachinelearning"; ``` ![TranslatorText](/resources/azure/aimachinelearning/translator-text.png) **TranslatorText** ``` import { TranslatorText } from "diagrams-js/azure/aimachinelearning"; ``` ### azure/analytics[​](#azureanalytics "Direct link to azure/analytics") ![AnalysisServices](/resources/azure/analytics/analysis-services.png) **AnalysisServices** ``` import { AnalysisServices } from "diagrams-js/azure/analytics"; ``` ![AzureDataExplorerClusters](/resources/azure/analytics/azure-data-explorer-clusters.png) **AzureDataExplorerClusters** ``` import { AzureDataExplorerClusters } from "diagrams-js/azure/analytics"; ``` ![AzureDatabricks](/resources/azure/analytics/azure-databricks.png) **AzureDatabricks** ``` import { AzureDatabricks } from "diagrams-js/azure/analytics"; ``` ![AzureSynapseAnalytics](/resources/azure/analytics/azure-synapse-analytics.png) **AzureSynapseAnalytics** ``` import { AzureSynapseAnalytics } from "diagrams-js/azure/analytics"; ``` ![AzureWorkbooks](/resources/azure/analytics/azure-workbooks.png) **AzureWorkbooks** ``` import { AzureWorkbooks } from "diagrams-js/azure/analytics"; ``` ![DataExplorerClusters](/resources/azure/analytics/data-explorer-clusters.png) **DataExplorerClusters** ``` import { DataExplorerClusters } from "diagrams-js/azure/analytics"; ``` ![DataFactories](/resources/azure/analytics/data-factories.png) **DataFactories** ``` import { DataFactories } from "diagrams-js/azure/analytics"; ``` ![DataLakeAnalytics](/resources/azure/analytics/data-lake-analytics.png) **DataLakeAnalytics** ``` import { DataLakeAnalytics } from "diagrams-js/azure/analytics"; ``` ![DataLakeStoreGen1](/resources/azure/analytics/data-lake-store-gen1.png) **DataLakeStoreGen1** ``` import { DataLakeStoreGen1 } from "diagrams-js/azure/analytics"; ``` ![Databricks](/resources/azure/analytics/databricks.png) **Databricks** ``` import { Databricks } from "diagrams-js/azure/analytics"; ``` ![EndpointAnalytics](/resources/azure/analytics/endpoint-analytics.png) **EndpointAnalytics** ``` import { EndpointAnalytics } from "diagrams-js/azure/analytics"; ``` ![EventHubClusters](/resources/azure/analytics/event-hub-clusters.png) **EventHubClusters** ``` import { EventHubClusters } from "diagrams-js/azure/analytics"; ``` ![EventHubs](/resources/azure/analytics/event-hubs.png) **EventHubs** ``` import { EventHubs } from "diagrams-js/azure/analytics"; ``` ![HDInsightClusters](/resources/azure/analytics/hd-insight-clusters.png) **HDInsightClusters** ``` import { HDInsightClusters } from "diagrams-js/azure/analytics"; ``` ![LogAnalyticsWorkspaces](/resources/azure/analytics/log-analytics-workspaces.png) **LogAnalyticsWorkspaces** ``` import { LogAnalyticsWorkspaces } from "diagrams-js/azure/analytics"; ``` ![PowerBiEmbedded](/resources/azure/analytics/power-bi-embedded.png) **PowerBiEmbedded** ``` import { PowerBiEmbedded } from "diagrams-js/azure/analytics"; ``` ![PowerPlatform](/resources/azure/analytics/power-platform.png) **PowerPlatform** ``` import { PowerPlatform } from "diagrams-js/azure/analytics"; ``` ![PrivateLinkServices](/resources/azure/analytics/private-link-services.png) **PrivateLinkServices** ``` import { PrivateLinkServices } from "diagrams-js/azure/analytics"; ``` ![StreamAnalyticsJobs](/resources/azure/analytics/stream-analytics-jobs.png) **StreamAnalyticsJobs** ``` import { StreamAnalyticsJobs } from "diagrams-js/azure/analytics"; ``` ![SynapseAnalytics](/resources/azure/analytics/synapse-analytics.png) **SynapseAnalytics** ``` import { SynapseAnalytics } from "diagrams-js/azure/analytics"; ``` ### azure/appservices[​](#azureappservices "Direct link to azure/appservices") ![AppServiceCertificates](/resources/azure/appservices/app-service-certificates.png) **AppServiceCertificates** ``` import { AppServiceCertificates } from "diagrams-js/azure/appservices"; ``` ![AppServiceDomains](/resources/azure/appservices/app-service-domains.png) **AppServiceDomains** ``` import { AppServiceDomains } from "diagrams-js/azure/appservices"; ``` ![AppServiceEnvironments](/resources/azure/appservices/app-service-environments.png) **AppServiceEnvironments** ``` import { AppServiceEnvironments } from "diagrams-js/azure/appservices"; ``` ![AppServicePlans](/resources/azure/appservices/app-service-plans.png) **AppServicePlans** ``` import { AppServicePlans } from "diagrams-js/azure/appservices"; ``` ![AppServices](/resources/azure/appservices/app-services.png) **AppServices** ``` import { AppServices } from "diagrams-js/azure/appservices"; ``` ![CDNProfiles](/resources/azure/appservices/cdn-profiles.png) **CDNProfiles** ``` import { CDNProfiles } from "diagrams-js/azure/appservices"; ``` ![CognitiveSearch](/resources/azure/appservices/cognitive-search.png) **CognitiveSearch** ``` import { CognitiveSearch } from "diagrams-js/azure/appservices"; ``` ![NotificationHubs](/resources/azure/appservices/notification-hubs.png) **NotificationHubs** ``` import { NotificationHubs } from "diagrams-js/azure/appservices"; ``` ### azure/azureecosystem[​](#azureazureecosystem "Direct link to azure/azureecosystem") ![Applens](/resources/azure/azureecosystem/applens.png) **Applens** ``` import { Applens } from "diagrams-js/azure/azureecosystem"; ``` ![AzureHybridCenter](/resources/azure/azureecosystem/azure-hybrid-center.png) **AzureHybridCenter** ``` import { AzureHybridCenter } from "diagrams-js/azure/azureecosystem"; ``` ![CollaborativeService](/resources/azure/azureecosystem/collaborative-service.png) **CollaborativeService** ``` import { CollaborativeService } from "diagrams-js/azure/azureecosystem"; ``` ### azure/azurestack[​](#azureazurestack "Direct link to azure/azurestack") ![Capacity](/resources/azure/azurestack/capacity.png) **Capacity** ``` import { Capacity } from "diagrams-js/azure/azurestack"; ``` ![InfrastructureBackup](/resources/azure/azurestack/infrastructure-backup.png) **InfrastructureBackup** ``` import { InfrastructureBackup } from "diagrams-js/azure/azurestack"; ``` ![MultiTenancy](/resources/azure/azurestack/multi-tenancy.png) **MultiTenancy** ``` import { MultiTenancy } from "diagrams-js/azure/azurestack"; ``` ![Offers](/resources/azure/azurestack/offers.png) **Offers** ``` import { Offers } from "diagrams-js/azure/azurestack"; ``` ![Plans](/resources/azure/azurestack/plans.png) **Plans** ``` import { Plans } from "diagrams-js/azure/azurestack"; ``` ![Updates](/resources/azure/azurestack/updates.png) **Updates** ``` import { Updates } from "diagrams-js/azure/azurestack"; ``` ![UserSubscriptions](/resources/azure/azurestack/user-subscriptions.png) **UserSubscriptions** ``` import { UserSubscriptions } from "diagrams-js/azure/azurestack"; ``` ### azure/blockchain[​](#azureblockchain "Direct link to azure/blockchain") ![AbsMember](/resources/azure/blockchain/abs-member.png) **AbsMember** ``` import { AbsMember } from "diagrams-js/azure/blockchain"; ``` ![AzureBlockchainService](/resources/azure/blockchain/azure-blockchain-service.png) **AzureBlockchainService** ``` import { AzureBlockchainService } from "diagrams-js/azure/blockchain"; ``` ![AzureTokenService](/resources/azure/blockchain/azure-token-service.png) **AzureTokenService** ``` import { AzureTokenService } from "diagrams-js/azure/blockchain"; ``` ![BlockchainApplications](/resources/azure/blockchain/blockchain-applications.png) **BlockchainApplications** ``` import { BlockchainApplications } from "diagrams-js/azure/blockchain"; ``` ![Consortium](/resources/azure/blockchain/consortium.png) **Consortium** ``` import { Consortium } from "diagrams-js/azure/blockchain"; ``` ![OutboundConnection](/resources/azure/blockchain/outbound-connection.png) **OutboundConnection** ``` import { OutboundConnection } from "diagrams-js/azure/blockchain"; ``` ### azure/compute[​](#azurecompute "Direct link to azure/compute") ![AppServices](/resources/azure/compute/app-services.png) **AppServices** ``` import { AppServices } from "diagrams-js/azure/compute"; ``` ![ApplicationGroup](/resources/azure/compute/application-group.png) **ApplicationGroup** ``` import { ApplicationGroup } from "diagrams-js/azure/compute"; ``` ![AutomanagedVM](/resources/azure/compute/automanaged-vm.png) **AutomanagedVM** ``` import { AutomanagedVM } from "diagrams-js/azure/compute"; ``` ![AvailabilitySets](/resources/azure/compute/availability-sets.png) **AvailabilitySets** ``` import { AvailabilitySets } from "diagrams-js/azure/compute"; ``` ![AzureComputeGalleries](/resources/azure/compute/azure-compute-galleries.png) **AzureComputeGalleries** ``` import { AzureComputeGalleries } from "diagrams-js/azure/compute"; ``` ![AzureSpringApps](/resources/azure/compute/azure-spring-apps.png) **AzureSpringApps** ``` import { AzureSpringApps } from "diagrams-js/azure/compute"; ``` ![BatchAccounts](/resources/azure/compute/batch-accounts.png) **BatchAccounts** ``` import { BatchAccounts } from "diagrams-js/azure/compute"; ``` ![CitrixVirtualDesktopsEssentials](/resources/azure/compute/citrix-virtual-desktops-essentials.png) **CitrixVirtualDesktopsEssentials** ``` import { CitrixVirtualDesktopsEssentials } from "diagrams-js/azure/compute"; ``` ![CloudServicesClassic](/resources/azure/compute/cloud-services-classic.png) **CloudServicesClassic** ``` import { CloudServicesClassic } from "diagrams-js/azure/compute"; ``` ![CloudServices](/resources/azure/compute/cloud-services.png) **CloudServices** ``` import { CloudServices } from "diagrams-js/azure/compute"; ``` ![CloudsimpleVirtualMachines](/resources/azure/compute/cloudsimple-virtual-machines.png) **CloudsimpleVirtualMachines** ``` import { CloudsimpleVirtualMachines } from "diagrams-js/azure/compute"; ``` ![ContainerApps](/resources/azure/compute/container-apps.png) **ContainerApps** ``` import { ContainerApps } from "diagrams-js/azure/compute"; ``` ![ContainerInstances](/resources/azure/compute/container-instances.png) **ContainerInstances** ``` import { ContainerInstances } from "diagrams-js/azure/compute"; ``` ![ContainerRegistries](/resources/azure/compute/container-registries.png) **ContainerRegistries** ``` import { ContainerRegistries } from "diagrams-js/azure/compute"; ``` ![ContainerServicesDeprecated](/resources/azure/compute/container-services-deprecated.png) **ContainerServicesDeprecated** ``` import { ContainerServicesDeprecated } from "diagrams-js/azure/compute"; ``` ![DiskEncryptionSets](/resources/azure/compute/disk-encryption-sets.png) **DiskEncryptionSets** ``` import { DiskEncryptionSets } from "diagrams-js/azure/compute"; ``` ![DiskSnapshots](/resources/azure/compute/disk-snapshots.png) **DiskSnapshots** ``` import { DiskSnapshots } from "diagrams-js/azure/compute"; ``` ![DisksClassic](/resources/azure/compute/disks-classic.png) **DisksClassic** ``` import { DisksClassic } from "diagrams-js/azure/compute"; ``` ![DisksSnapshots](/resources/azure/compute/disks-snapshots.png) **DisksSnapshots** ``` import { DisksSnapshots } from "diagrams-js/azure/compute"; ``` ![Disks](/resources/azure/compute/disks.png) **Disks** ``` import { Disks } from "diagrams-js/azure/compute"; ``` ![FunctionApps](/resources/azure/compute/function-apps.png) **FunctionApps** ``` import { FunctionApps } from "diagrams-js/azure/compute"; ``` ![HostGroups](/resources/azure/compute/host-groups.png) **HostGroups** ``` import { HostGroups } from "diagrams-js/azure/compute"; ``` ![HostPools](/resources/azure/compute/host-pools.png) **HostPools** ``` import { HostPools } from "diagrams-js/azure/compute"; ``` ![Hosts](/resources/azure/compute/hosts.png) **Hosts** ``` import { Hosts } from "diagrams-js/azure/compute"; ``` ![ImageDefinitions](/resources/azure/compute/image-definitions.png) **ImageDefinitions** ``` import { ImageDefinitions } from "diagrams-js/azure/compute"; ``` ![ImageTemplates](/resources/azure/compute/image-templates.png) **ImageTemplates** ``` import { ImageTemplates } from "diagrams-js/azure/compute"; ``` ![ImageVersions](/resources/azure/compute/image-versions.png) **ImageVersions** ``` import { ImageVersions } from "diagrams-js/azure/compute"; ``` ![Images](/resources/azure/compute/images.png) **Images** ``` import { Images } from "diagrams-js/azure/compute"; ``` ![KubernetesServices](/resources/azure/compute/kubernetes-services.png) **KubernetesServices** ``` import { KubernetesServices } from "diagrams-js/azure/compute"; ``` ![MaintenanceConfiguration](/resources/azure/compute/maintenance-configuration.png) **MaintenanceConfiguration** ``` import { MaintenanceConfiguration } from "diagrams-js/azure/compute"; ``` ![ManagedServiceFabric](/resources/azure/compute/managed-service-fabric.png) **ManagedServiceFabric** ``` import { ManagedServiceFabric } from "diagrams-js/azure/compute"; ``` ![MeshApplications](/resources/azure/compute/mesh-applications.png) **MeshApplications** ``` import { MeshApplications } from "diagrams-js/azure/compute"; ``` ![MetricsAdvisor](/resources/azure/compute/metrics-advisor.png) **MetricsAdvisor** ``` import { MetricsAdvisor } from "diagrams-js/azure/compute"; ``` ![OsImagesClassic](/resources/azure/compute/os-images-classic.png) **OsImagesClassic** ``` import { OsImagesClassic } from "diagrams-js/azure/compute"; ``` ![OsImages](/resources/azure/compute/os-images.png) **OsImages** ``` import { OsImages } from "diagrams-js/azure/compute"; ``` ![RestorePointsCollections](/resources/azure/compute/restore-points-collections.png) **RestorePointsCollections** ``` import { RestorePointsCollections } from "diagrams-js/azure/compute"; ``` ![RestorePoints](/resources/azure/compute/restore-points.png) **RestorePoints** ``` import { RestorePoints } from "diagrams-js/azure/compute"; ``` ![SAPHANAOnAzure](/resources/azure/compute/sap-hana-on-azure.png) **SAPHANAOnAzure** ``` import { SAPHANAOnAzure } from "diagrams-js/azure/compute"; ``` ![ServiceFabricClusters](/resources/azure/compute/service-fabric-clusters.png) **ServiceFabricClusters** ``` import { ServiceFabricClusters } from "diagrams-js/azure/compute"; ``` ![SharedImageGalleries](/resources/azure/compute/shared-image-galleries.png) **SharedImageGalleries** ``` import { SharedImageGalleries } from "diagrams-js/azure/compute"; ``` ![SpringCloud](/resources/azure/compute/spring-cloud.png) **SpringCloud** ``` import { SpringCloud } from "diagrams-js/azure/compute"; ``` ![VirtualMachine](/resources/azure/compute/virtual-machine.png) **VirtualMachine** ``` import { VirtualMachine } from "diagrams-js/azure/compute"; ``` ![VirtualMachinesClassic](/resources/azure/compute/virtual-machines-classic.png) **VirtualMachinesClassic** ``` import { VirtualMachinesClassic } from "diagrams-js/azure/compute"; ``` ![VMClassic](/resources/azure/compute/vm-classic.png) **VMClassic** ``` import { VMClassic } from "diagrams-js/azure/compute"; ``` ![VMImagesClassic](/resources/azure/compute/vm-images-classic.png) **VMImagesClassic** ``` import { VMImagesClassic } from "diagrams-js/azure/compute"; ``` ![VMImages](/resources/azure/compute/vm-images.png) **VMImages** ``` import { VMImages } from "diagrams-js/azure/compute"; ``` ![VMLinux](/resources/azure/compute/vm-linux.png) **VMLinux** ``` import { VMLinux } from "diagrams-js/azure/compute"; ``` ![VMScaleSet](/resources/azure/compute/vm-scale-set.png) **VMScaleSet** ``` import { VMScaleSet } from "diagrams-js/azure/compute"; ``` ![VMScaleSets](/resources/azure/compute/vm-scale-sets.png) **VMScaleSets** ``` import { VMScaleSets } from "diagrams-js/azure/compute"; ``` ![VMWindows](/resources/azure/compute/vm-windows.png) **VMWindows** ``` import { VMWindows } from "diagrams-js/azure/compute"; ``` ![VM](/resources/azure/compute/vm.png) **VM** ``` import { VM } from "diagrams-js/azure/compute"; ``` ![Workspaces2](/resources/azure/compute/workspaces-2.png) **Workspaces2** ``` import { Workspaces2 } from "diagrams-js/azure/compute"; ``` ![Workspaces](/resources/azure/compute/workspaces.png) **Workspaces** ``` import { Workspaces } from "diagrams-js/azure/compute"; ``` ### azure/containers[​](#azurecontainers "Direct link to azure/containers") ![AppServices](/resources/azure/containers/app-services.png) **AppServices** ``` import { AppServices } from "diagrams-js/azure/containers"; ``` ![AzureRedHatOpenshift](/resources/azure/containers/azure-red-hat-openshift.png) **AzureRedHatOpenshift** ``` import { AzureRedHatOpenshift } from "diagrams-js/azure/containers"; ``` ![BatchAccounts](/resources/azure/containers/batch-accounts.png) **BatchAccounts** ``` import { BatchAccounts } from "diagrams-js/azure/containers"; ``` ![ContainerInstances](/resources/azure/containers/container-instances.png) **ContainerInstances** ``` import { ContainerInstances } from "diagrams-js/azure/containers"; ``` ![ContainerRegistries](/resources/azure/containers/container-registries.png) **ContainerRegistries** ``` import { ContainerRegistries } from "diagrams-js/azure/containers"; ``` ![KubernetesServices](/resources/azure/containers/kubernetes-services.png) **KubernetesServices** ``` import { KubernetesServices } from "diagrams-js/azure/containers"; ``` ![ServiceFabricClusters](/resources/azure/containers/service-fabric-clusters.png) **ServiceFabricClusters** ``` import { ServiceFabricClusters } from "diagrams-js/azure/containers"; ``` ### azure/database[​](#azuredatabase "Direct link to azure/database") ![BlobStorage](/resources/azure/database/blob-storage.png) **BlobStorage** ``` import { BlobStorage } from "diagrams-js/azure/database"; ``` ![CacheForRedis](/resources/azure/database/cache-for-redis.png) **CacheForRedis** ``` import { CacheForRedis } from "diagrams-js/azure/database"; ``` ![CosmosDb](/resources/azure/database/cosmos-db.png) **CosmosDb** ``` import { CosmosDb } from "diagrams-js/azure/database"; ``` ![DataExplorerClusters](/resources/azure/database/data-explorer-clusters.png) **DataExplorerClusters** ``` import { DataExplorerClusters } from "diagrams-js/azure/database"; ``` ![DataFactory](/resources/azure/database/data-factory.png) **DataFactory** ``` import { DataFactory } from "diagrams-js/azure/database"; ``` ![DataLake](/resources/azure/database/data-lake.png) **DataLake** ``` import { DataLake } from "diagrams-js/azure/database"; ``` ![DatabaseForMariadbServers](/resources/azure/database/database-for-mariadb-servers.png) **DatabaseForMariadbServers** ``` import { DatabaseForMariadbServers } from "diagrams-js/azure/database"; ``` ![DatabaseForMysqlServers](/resources/azure/database/database-for-mysql-servers.png) **DatabaseForMysqlServers** ``` import { DatabaseForMysqlServers } from "diagrams-js/azure/database"; ``` ![DatabaseForPostgresqlServers](/resources/azure/database/database-for-postgresql-servers.png) **DatabaseForPostgresqlServers** ``` import { DatabaseForPostgresqlServers } from "diagrams-js/azure/database"; ``` ![ElasticDatabasePools](/resources/azure/database/elastic-database-pools.png) **ElasticDatabasePools** ``` import { ElasticDatabasePools } from "diagrams-js/azure/database"; ``` ![ElasticJobAgents](/resources/azure/database/elastic-job-agents.png) **ElasticJobAgents** ``` import { ElasticJobAgents } from "diagrams-js/azure/database"; ``` ![InstancePools](/resources/azure/database/instance-pools.png) **InstancePools** ``` import { InstancePools } from "diagrams-js/azure/database"; ``` ![ManagedDatabases](/resources/azure/database/managed-databases.png) **ManagedDatabases** ``` import { ManagedDatabases } from "diagrams-js/azure/database"; ``` ![SQLDatabases](/resources/azure/database/sql-databases.png) **SQLDatabases** ``` import { SQLDatabases } from "diagrams-js/azure/database"; ``` ![SQLDatawarehouse](/resources/azure/database/sql-datawarehouse.png) **SQLDatawarehouse** ``` import { SQLDatawarehouse } from "diagrams-js/azure/database"; ``` ![SQLManagedInstances](/resources/azure/database/sql-managed-instances.png) **SQLManagedInstances** ``` import { SQLManagedInstances } from "diagrams-js/azure/database"; ``` ![SQLServerStretchDatabases](/resources/azure/database/sql-server-stretch-databases.png) **SQLServerStretchDatabases** ``` import { SQLServerStretchDatabases } from "diagrams-js/azure/database"; ``` ![SQLServers](/resources/azure/database/sql-servers.png) **SQLServers** ``` import { SQLServers } from "diagrams-js/azure/database"; ``` ![SQLVM](/resources/azure/database/sql-vm.png) **SQLVM** ``` import { SQLVM } from "diagrams-js/azure/database"; ``` ![SQL](/resources/azure/database/sql.png) **SQL** ``` import { SQL } from "diagrams-js/azure/database"; ``` ![SsisLiftAndShiftIr](/resources/azure/database/ssis-lift-and-shift-ir.png) **SsisLiftAndShiftIr** ``` import { SsisLiftAndShiftIr } from "diagrams-js/azure/database"; ``` ![SynapseAnalytics](/resources/azure/database/synapse-analytics.png) **SynapseAnalytics** ``` import { SynapseAnalytics } from "diagrams-js/azure/database"; ``` ![VirtualClusters](/resources/azure/database/virtual-clusters.png) **VirtualClusters** ``` import { VirtualClusters } from "diagrams-js/azure/database"; ``` ![VirtualDatacenter](/resources/azure/database/virtual-datacenter.png) **VirtualDatacenter** ``` import { VirtualDatacenter } from "diagrams-js/azure/database"; ``` ### azure/databases[​](#azuredatabases "Direct link to azure/databases") ![AzureCosmosDb](/resources/azure/databases/azure-cosmos-db.png) **AzureCosmosDb** ``` import { AzureCosmosDb } from "diagrams-js/azure/databases"; ``` ![AzureDataExplorerClusters](/resources/azure/databases/azure-data-explorer-clusters.png) **AzureDataExplorerClusters** ``` import { AzureDataExplorerClusters } from "diagrams-js/azure/databases"; ``` ![AzureDatabaseMariadbServer](/resources/azure/databases/azure-database-mariadb-server.png) **AzureDatabaseMariadbServer** ``` import { AzureDatabaseMariadbServer } from "diagrams-js/azure/databases"; ``` ![AzureDatabaseMigrationServices](/resources/azure/databases/azure-database-migration-services.png) **AzureDatabaseMigrationServices** ``` import { AzureDatabaseMigrationServices } from "diagrams-js/azure/databases"; ``` ![AzureDatabaseMysqlServer](/resources/azure/databases/azure-database-mysql-server.png) **AzureDatabaseMysqlServer** ``` import { AzureDatabaseMysqlServer } from "diagrams-js/azure/databases"; ``` ![AzureDatabasePostgresqlServerGroup](/resources/azure/databases/azure-database-postgresql-server-group.png) **AzureDatabasePostgresqlServerGroup** ``` import { AzureDatabasePostgresqlServerGroup } from "diagrams-js/azure/databases"; ``` ![AzureDatabasePostgresqlServer](/resources/azure/databases/azure-database-postgresql-server.png) **AzureDatabasePostgresqlServer** ``` import { AzureDatabasePostgresqlServer } from "diagrams-js/azure/databases"; ``` ![AzurePurviewAccounts](/resources/azure/databases/azure-purview-accounts.png) **AzurePurviewAccounts** ``` import { AzurePurviewAccounts } from "diagrams-js/azure/databases"; ``` ![AzureSQLEdge](/resources/azure/databases/azure-sql-edge.png) **AzureSQLEdge** ``` import { AzureSQLEdge } from "diagrams-js/azure/databases"; ``` ![AzureSQLServerStretchDatabases](/resources/azure/databases/azure-sql-server-stretch-databases.png) **AzureSQLServerStretchDatabases** ``` import { AzureSQLServerStretchDatabases } from "diagrams-js/azure/databases"; ``` ![AzureSQLVM](/resources/azure/databases/azure-sql-vm.png) **AzureSQLVM** ``` import { AzureSQLVM } from "diagrams-js/azure/databases"; ``` ![AzureSQL](/resources/azure/databases/azure-sql.png) **AzureSQL** ``` import { AzureSQL } from "diagrams-js/azure/databases"; ``` ![AzureSynapseAnalytics](/resources/azure/databases/azure-synapse-analytics.png) **AzureSynapseAnalytics** ``` import { AzureSynapseAnalytics } from "diagrams-js/azure/databases"; ``` ![CacheRedis](/resources/azure/databases/cache-redis.png) **CacheRedis** ``` import { CacheRedis } from "diagrams-js/azure/databases"; ``` ![DataFactories](/resources/azure/databases/data-factories.png) **DataFactories** ``` import { DataFactories } from "diagrams-js/azure/databases"; ``` ![ElasticJobAgents](/resources/azure/databases/elastic-job-agents.png) **ElasticJobAgents** ``` import { ElasticJobAgents } from "diagrams-js/azure/databases"; ``` ![InstancePools](/resources/azure/databases/instance-pools.png) **InstancePools** ``` import { InstancePools } from "diagrams-js/azure/databases"; ``` ![ManagedDatabase](/resources/azure/databases/managed-database.png) **ManagedDatabase** ``` import { ManagedDatabase } from "diagrams-js/azure/databases"; ``` ![OracleDatabase](/resources/azure/databases/oracle-database.png) **OracleDatabase** ``` import { OracleDatabase } from "diagrams-js/azure/databases"; ``` ![SQLDataWarehouses](/resources/azure/databases/sql-data-warehouses.png) **SQLDataWarehouses** ``` import { SQLDataWarehouses } from "diagrams-js/azure/databases"; ``` ![SQLDatabase](/resources/azure/databases/sql-database.png) **SQLDatabase** ``` import { SQLDatabase } from "diagrams-js/azure/databases"; ``` ![SQLElasticPools](/resources/azure/databases/sql-elastic-pools.png) **SQLElasticPools** ``` import { SQLElasticPools } from "diagrams-js/azure/databases"; ``` ![SQLManagedInstance](/resources/azure/databases/sql-managed-instance.png) **SQLManagedInstance** ``` import { SQLManagedInstance } from "diagrams-js/azure/databases"; ``` ![SQLServerRegistries](/resources/azure/databases/sql-server-registries.png) **SQLServerRegistries** ``` import { SQLServerRegistries } from "diagrams-js/azure/databases"; ``` ![SQLServer](/resources/azure/databases/sql-server.png) **SQLServer** ``` import { SQLServer } from "diagrams-js/azure/databases"; ``` ![SsisLiftAndShiftIr](/resources/azure/databases/ssis-lift-and-shift-ir.png) **SsisLiftAndShiftIr** ``` import { SsisLiftAndShiftIr } from "diagrams-js/azure/databases"; ``` ![VirtualClusters](/resources/azure/databases/virtual-clusters.png) **VirtualClusters** ``` import { VirtualClusters } from "diagrams-js/azure/databases"; ``` ### azure/devops[​](#azuredevops "Direct link to azure/devops") ![APIConnections](/resources/azure/devops/api-connections.png) **APIConnections** ``` import { APIConnections } from "diagrams-js/azure/devops"; ``` ![APIManagementServices](/resources/azure/devops/api-management-services.png) **APIManagementServices** ``` import { APIManagementServices } from "diagrams-js/azure/devops"; ``` ![ApplicationInsights](/resources/azure/devops/application-insights.png) **ApplicationInsights** ``` import { ApplicationInsights } from "diagrams-js/azure/devops"; ``` ![Artifacts](/resources/azure/devops/artifacts.png) **Artifacts** ``` import { Artifacts } from "diagrams-js/azure/devops"; ``` ![AzureDevops](/resources/azure/devops/azure-devops.png) **AzureDevops** ``` import { AzureDevops } from "diagrams-js/azure/devops"; ``` ![Boards](/resources/azure/devops/boards.png) **Boards** ``` import { Boards } from "diagrams-js/azure/devops"; ``` ![ChangeAnalysis](/resources/azure/devops/change-analysis.png) **ChangeAnalysis** ``` import { ChangeAnalysis } from "diagrams-js/azure/devops"; ``` ![Cloudtest](/resources/azure/devops/cloudtest.png) **Cloudtest** ``` import { Cloudtest } from "diagrams-js/azure/devops"; ``` ![CodeOptimization](/resources/azure/devops/code-optimization.png) **CodeOptimization** ``` import { CodeOptimization } from "diagrams-js/azure/devops"; ``` ![DevopsStarter](/resources/azure/devops/devops-starter.png) **DevopsStarter** ``` import { DevopsStarter } from "diagrams-js/azure/devops"; ``` ![Devops](/resources/azure/devops/devops.png) **Devops** ``` import { Devops } from "diagrams-js/azure/devops"; ``` ![DevtestLabs](/resources/azure/devops/devtest-labs.png) **DevtestLabs** ``` import { DevtestLabs } from "diagrams-js/azure/devops"; ``` ![LabAccounts](/resources/azure/devops/lab-accounts.png) **LabAccounts** ``` import { LabAccounts } from "diagrams-js/azure/devops"; ``` ![LabServices](/resources/azure/devops/lab-services.png) **LabServices** ``` import { LabServices } from "diagrams-js/azure/devops"; ``` ![LoadTesting](/resources/azure/devops/load-testing.png) **LoadTesting** ``` import { LoadTesting } from "diagrams-js/azure/devops"; ``` ![Pipelines](/resources/azure/devops/pipelines.png) **Pipelines** ``` import { Pipelines } from "diagrams-js/azure/devops"; ``` ![Repos](/resources/azure/devops/repos.png) **Repos** ``` import { Repos } from "diagrams-js/azure/devops"; ``` ![TestPlans](/resources/azure/devops/test-plans.png) **TestPlans** ``` import { TestPlans } from "diagrams-js/azure/devops"; ``` ### azure/general[​](#azuregeneral "Direct link to azure/general") ![AllResources](/resources/azure/general/all-resources.png) **AllResources** ``` import { AllResources } from "diagrams-js/azure/general"; ``` ![Allresources](/resources/azure/general/allresources.png) **Allresources** ``` import { Allresources } from "diagrams-js/azure/general"; ``` ![Azurehome](/resources/azure/general/azurehome.png) **Azurehome** ``` import { Azurehome } from "diagrams-js/azure/general"; ``` ![Backlog](/resources/azure/general/backlog.png) **Backlog** ``` import { Backlog } from "diagrams-js/azure/general"; ``` ![BizTalk](/resources/azure/general/biz-talk.png) **BizTalk** ``` import { BizTalk } from "diagrams-js/azure/general"; ``` ![BlobBlock](/resources/azure/general/blob-block.png) **BlobBlock** ``` import { BlobBlock } from "diagrams-js/azure/general"; ``` ![BlobPage](/resources/azure/general/blob-page.png) **BlobPage** ``` import { BlobPage } from "diagrams-js/azure/general"; ``` ![Branch](/resources/azure/general/branch.png) **Branch** ``` import { Branch } from "diagrams-js/azure/general"; ``` ![Browser](/resources/azure/general/browser.png) **Browser** ``` import { Browser } from "diagrams-js/azure/general"; ``` ![Bug](/resources/azure/general/bug.png) **Bug** ``` import { Bug } from "diagrams-js/azure/general"; ``` ![Builds](/resources/azure/general/builds.png) **Builds** ``` import { Builds } from "diagrams-js/azure/general"; ``` ![Cache](/resources/azure/general/cache.png) **Cache** ``` import { Cache } from "diagrams-js/azure/general"; ``` ![Code](/resources/azure/general/code.png) **Code** ``` import { Code } from "diagrams-js/azure/general"; ``` ![Commit](/resources/azure/general/commit.png) **Commit** ``` import { Commit } from "diagrams-js/azure/general"; ``` ![ControlsHorizontal](/resources/azure/general/controls-horizontal.png) **ControlsHorizontal** ``` import { ControlsHorizontal } from "diagrams-js/azure/general"; ``` ![Controls](/resources/azure/general/controls.png) **Controls** ``` import { Controls } from "diagrams-js/azure/general"; ``` ![CostAlerts](/resources/azure/general/cost-alerts.png) **CostAlerts** ``` import { CostAlerts } from "diagrams-js/azure/general"; ``` ![CostAnalysis](/resources/azure/general/cost-analysis.png) **CostAnalysis** ``` import { CostAnalysis } from "diagrams-js/azure/general"; ``` ![CostBudgets](/resources/azure/general/cost-budgets.png) **CostBudgets** ``` import { CostBudgets } from "diagrams-js/azure/general"; ``` ![CostManagementAndBilling](/resources/azure/general/cost-management-and-billing.png) **CostManagementAndBilling** ``` import { CostManagementAndBilling } from "diagrams-js/azure/general"; ``` ![CostManagement](/resources/azure/general/cost-management.png) **CostManagement** ``` import { CostManagement } from "diagrams-js/azure/general"; ``` ![Counter](/resources/azure/general/counter.png) **Counter** ``` import { Counter } from "diagrams-js/azure/general"; ``` ![Cubes](/resources/azure/general/cubes.png) **Cubes** ``` import { Cubes } from "diagrams-js/azure/general"; ``` ![Dashboard](/resources/azure/general/dashboard.png) **Dashboard** ``` import { Dashboard } from "diagrams-js/azure/general"; ``` ![DevConsole](/resources/azure/general/dev-console.png) **DevConsole** ``` import { DevConsole } from "diagrams-js/azure/general"; ``` ![Developertools](/resources/azure/general/developertools.png) **Developertools** ``` import { Developertools } from "diagrams-js/azure/general"; ``` ![Download](/resources/azure/general/download.png) **Download** ``` import { Download } from "diagrams-js/azure/general"; ``` ![Error](/resources/azure/general/error.png) **Error** ``` import { Error } from "diagrams-js/azure/general"; ``` ![Extensions](/resources/azure/general/extensions.png) **Extensions** ``` import { Extensions } from "diagrams-js/azure/general"; ``` ![FeaturePreviews](/resources/azure/general/feature-previews.png) **FeaturePreviews** ``` import { FeaturePreviews } from "diagrams-js/azure/general"; ``` ![File](/resources/azure/general/file.png) **File** ``` import { File } from "diagrams-js/azure/general"; ``` ![Files](/resources/azure/general/files.png) **Files** ``` import { Files } from "diagrams-js/azure/general"; ``` ![FolderBlank](/resources/azure/general/folder-blank.png) **FolderBlank** ``` import { FolderBlank } from "diagrams-js/azure/general"; ``` ![FolderWebsite](/resources/azure/general/folder-website.png) **FolderWebsite** ``` import { FolderWebsite } from "diagrams-js/azure/general"; ``` ![FreeServices](/resources/azure/general/free-services.png) **FreeServices** ``` import { FreeServices } from "diagrams-js/azure/general"; ``` ![Ftp](/resources/azure/general/ftp.png) **Ftp** ``` import { Ftp } from "diagrams-js/azure/general"; ``` ![Gear](/resources/azure/general/gear.png) **Gear** ``` import { Gear } from "diagrams-js/azure/general"; ``` ![GlobeError](/resources/azure/general/globe-error.png) **GlobeError** ``` import { GlobeError } from "diagrams-js/azure/general"; ``` ![GlobeSuccess](/resources/azure/general/globe-success.png) **GlobeSuccess** ``` import { GlobeSuccess } from "diagrams-js/azure/general"; ``` ![GlobeWarning](/resources/azure/general/globe-warning.png) **GlobeWarning** ``` import { GlobeWarning } from "diagrams-js/azure/general"; ``` ![Guide](/resources/azure/general/guide.png) **Guide** ``` import { Guide } from "diagrams-js/azure/general"; ``` ![Heart](/resources/azure/general/heart.png) **Heart** ``` import { Heart } from "diagrams-js/azure/general"; ``` ![HelpAndSupport](/resources/azure/general/help-and-support.png) **HelpAndSupport** ``` import { HelpAndSupport } from "diagrams-js/azure/general"; ``` ![Helpsupport](/resources/azure/general/helpsupport.png) **Helpsupport** ``` import { Helpsupport } from "diagrams-js/azure/general"; ``` ![Image](/resources/azure/general/image.png) **Image** ``` import { Image } from "diagrams-js/azure/general"; ``` ![Information](/resources/azure/general/information.png) **Information** ``` import { Information } from "diagrams-js/azure/general"; ``` ![InputOutput](/resources/azure/general/input-output.png) **InputOutput** ``` import { InputOutput } from "diagrams-js/azure/general"; ``` ![JourneyHub](/resources/azure/general/journey-hub.png) **JourneyHub** ``` import { JourneyHub } from "diagrams-js/azure/general"; ``` ![LaunchPortal](/resources/azure/general/launch-portal.png) **LaunchPortal** ``` import { LaunchPortal } from "diagrams-js/azure/general"; ``` ![Learn](/resources/azure/general/learn.png) **Learn** ``` import { Learn } from "diagrams-js/azure/general"; ``` ![LoadTest](/resources/azure/general/load-test.png) **LoadTest** ``` import { LoadTest } from "diagrams-js/azure/general"; ``` ![Location](/resources/azure/general/location.png) **Location** ``` import { Location } from "diagrams-js/azure/general"; ``` ![LogStreaming](/resources/azure/general/log-streaming.png) **LogStreaming** ``` import { LogStreaming } from "diagrams-js/azure/general"; ``` ![ManagementGroups](/resources/azure/general/management-groups.png) **ManagementGroups** ``` import { ManagementGroups } from "diagrams-js/azure/general"; ``` ![ManagementPortal](/resources/azure/general/management-portal.png) **ManagementPortal** ``` import { ManagementPortal } from "diagrams-js/azure/general"; ``` ![Managementgroups](/resources/azure/general/managementgroups.png) **Managementgroups** ``` import { Managementgroups } from "diagrams-js/azure/general"; ``` ![MarketplaceManagement](/resources/azure/general/marketplace-management.png) **MarketplaceManagement** ``` import { MarketplaceManagement } from "diagrams-js/azure/general"; ``` ![Marketplace](/resources/azure/general/marketplace.png) **Marketplace** ``` import { Marketplace } from "diagrams-js/azure/general"; ``` ![MediaFile](/resources/azure/general/media-file.png) **MediaFile** ``` import { MediaFile } from "diagrams-js/azure/general"; ``` ![Media](/resources/azure/general/media.png) **Media** ``` import { Media } from "diagrams-js/azure/general"; ``` ![MobileEngagement](/resources/azure/general/mobile-engagement.png) **MobileEngagement** ``` import { MobileEngagement } from "diagrams-js/azure/general"; ``` ![Mobile](/resources/azure/general/mobile.png) **Mobile** ``` import { Mobile } from "diagrams-js/azure/general"; ``` ![Module](/resources/azure/general/module.png) **Module** ``` import { Module } from "diagrams-js/azure/general"; ``` ![PowerUp](/resources/azure/general/power-up.png) **PowerUp** ``` import { PowerUp } from "diagrams-js/azure/general"; ``` ![Power](/resources/azure/general/power.png) **Power** ``` import { Power } from "diagrams-js/azure/general"; ``` ![Powershell](/resources/azure/general/powershell.png) **Powershell** ``` import { Powershell } from "diagrams-js/azure/general"; ``` ![PreviewFeatures](/resources/azure/general/preview-features.png) **PreviewFeatures** ``` import { PreviewFeatures } from "diagrams-js/azure/general"; ``` ![ProcessExplorer](/resources/azure/general/process-explorer.png) **ProcessExplorer** ``` import { ProcessExplorer } from "diagrams-js/azure/general"; ``` ![ProductionReadyDatabase](/resources/azure/general/production-ready-database.png) **ProductionReadyDatabase** ``` import { ProductionReadyDatabase } from "diagrams-js/azure/general"; ``` ![QuickstartCenter](/resources/azure/general/quickstart-center.png) **QuickstartCenter** ``` import { QuickstartCenter } from "diagrams-js/azure/general"; ``` ![Quickstartcenter](/resources/azure/general/quickstartcenter.png) **Quickstartcenter** ``` import { Quickstartcenter } from "diagrams-js/azure/general"; ``` ![Recent](/resources/azure/general/recent.png) **Recent** ``` import { Recent } from "diagrams-js/azure/general"; ``` ![RegionManagement](/resources/azure/general/region-management.png) **RegionManagement** ``` import { RegionManagement } from "diagrams-js/azure/general"; ``` ![Reservations](/resources/azure/general/reservations.png) **Reservations** ``` import { Reservations } from "diagrams-js/azure/general"; ``` ![ResourceExplorer](/resources/azure/general/resource-explorer.png) **ResourceExplorer** ``` import { ResourceExplorer } from "diagrams-js/azure/general"; ``` ![ResourceGroupList](/resources/azure/general/resource-group-list.png) **ResourceGroupList** ``` import { ResourceGroupList } from "diagrams-js/azure/general"; ``` ![ResourceGroups](/resources/azure/general/resource-groups.png) **ResourceGroups** ``` import { ResourceGroups } from "diagrams-js/azure/general"; ``` ![ResourceLinked](/resources/azure/general/resource-linked.png) **ResourceLinked** ``` import { ResourceLinked } from "diagrams-js/azure/general"; ``` ![Resource](/resources/azure/general/resource.png) **Resource** ``` import { Resource } from "diagrams-js/azure/general"; ``` ![Resourcegroups](/resources/azure/general/resourcegroups.png) **Resourcegroups** ``` import { Resourcegroups } from "diagrams-js/azure/general"; ``` ![Scheduler](/resources/azure/general/scheduler.png) **Scheduler** ``` import { Scheduler } from "diagrams-js/azure/general"; ``` ![SearchGrid](/resources/azure/general/search-grid.png) **SearchGrid** ``` import { SearchGrid } from "diagrams-js/azure/general"; ``` ![Search](/resources/azure/general/search.png) **Search** ``` import { Search } from "diagrams-js/azure/general"; ``` ![ServerFarm](/resources/azure/general/server-farm.png) **ServerFarm** ``` import { ServerFarm } from "diagrams-js/azure/general"; ``` ![ServiceHealth](/resources/azure/general/service-health.png) **ServiceHealth** ``` import { ServiceHealth } from "diagrams-js/azure/general"; ``` ![Servicehealth](/resources/azure/general/servicehealth.png) **Servicehealth** ``` import { Servicehealth } from "diagrams-js/azure/general"; ``` ![Shareddashboard](/resources/azure/general/shareddashboard.png) **Shareddashboard** ``` import { Shareddashboard } from "diagrams-js/azure/general"; ``` ![Ssd](/resources/azure/general/ssd.png) **Ssd** ``` import { Ssd } from "diagrams-js/azure/general"; ``` ![StorageAzureFiles](/resources/azure/general/storage-azure-files.png) **StorageAzureFiles** ``` import { StorageAzureFiles } from "diagrams-js/azure/general"; ``` ![StorageContainer](/resources/azure/general/storage-container.png) **StorageContainer** ``` import { StorageContainer } from "diagrams-js/azure/general"; ``` ![StorageQueue](/resources/azure/general/storage-queue.png) **StorageQueue** ``` import { StorageQueue } from "diagrams-js/azure/general"; ``` ![Subscriptions](/resources/azure/general/subscriptions.png) **Subscriptions** ``` import { Subscriptions } from "diagrams-js/azure/general"; ``` ![Support](/resources/azure/general/support.png) **Support** ``` import { Support } from "diagrams-js/azure/general"; ``` ![Supportrequests](/resources/azure/general/supportrequests.png) **Supportrequests** ``` import { Supportrequests } from "diagrams-js/azure/general"; ``` ![Table](/resources/azure/general/table.png) **Table** ``` import { Table } from "diagrams-js/azure/general"; ``` ![Tag](/resources/azure/general/tag.png) **Tag** ``` import { Tag } from "diagrams-js/azure/general"; ``` ![Tags](/resources/azure/general/tags.png) **Tags** ``` import { Tags } from "diagrams-js/azure/general"; ``` ![Templates](/resources/azure/general/templates.png) **Templates** ``` import { Templates } from "diagrams-js/azure/general"; ``` ![TfsVcRepository](/resources/azure/general/tfs-vc-repository.png) **TfsVcRepository** ``` import { TfsVcRepository } from "diagrams-js/azure/general"; ``` ![Toolbox](/resources/azure/general/toolbox.png) **Toolbox** ``` import { Toolbox } from "diagrams-js/azure/general"; ``` ![Troubleshoot](/resources/azure/general/troubleshoot.png) **Troubleshoot** ``` import { Troubleshoot } from "diagrams-js/azure/general"; ``` ![Twousericon](/resources/azure/general/twousericon.png) **Twousericon** ``` import { Twousericon } from "diagrams-js/azure/general"; ``` ![Userhealthicon](/resources/azure/general/userhealthicon.png) **Userhealthicon** ``` import { Userhealthicon } from "diagrams-js/azure/general"; ``` ![Usericon](/resources/azure/general/usericon.png) **Usericon** ``` import { Usericon } from "diagrams-js/azure/general"; ``` ![Userprivacy](/resources/azure/general/userprivacy.png) **Userprivacy** ``` import { Userprivacy } from "diagrams-js/azure/general"; ``` ![Userresource](/resources/azure/general/userresource.png) **Userresource** ``` import { Userresource } from "diagrams-js/azure/general"; ``` ![Versions](/resources/azure/general/versions.png) **Versions** ``` import { Versions } from "diagrams-js/azure/general"; ``` ![WebSlots](/resources/azure/general/web-slots.png) **WebSlots** ``` import { WebSlots } from "diagrams-js/azure/general"; ``` ![WebTest](/resources/azure/general/web-test.png) **WebTest** ``` import { WebTest } from "diagrams-js/azure/general"; ``` ![WebsitePower](/resources/azure/general/website-power.png) **WebsitePower** ``` import { WebsitePower } from "diagrams-js/azure/general"; ``` ![WebsiteStaging](/resources/azure/general/website-staging.png) **WebsiteStaging** ``` import { WebsiteStaging } from "diagrams-js/azure/general"; ``` ![Whatsnew](/resources/azure/general/whatsnew.png) **Whatsnew** ``` import { Whatsnew } from "diagrams-js/azure/general"; ``` ![Workbooks](/resources/azure/general/workbooks.png) **Workbooks** ``` import { Workbooks } from "diagrams-js/azure/general"; ``` ![Workflow](/resources/azure/general/workflow.png) **Workflow** ``` import { Workflow } from "diagrams-js/azure/general"; ``` ### azure/hybridmulticloud[​](#azurehybridmulticloud "Direct link to azure/hybridmulticloud") ![AzureOperator5gCore](/resources/azure/hybridmulticloud/azure-operator-5g-core.png) **AzureOperator5gCore** ``` import { AzureOperator5gCore } from "diagrams-js/azure/hybridmulticloud"; ``` ![AzureOperatorInsights](/resources/azure/hybridmulticloud/azure-operator-insights.png) **AzureOperatorInsights** ``` import { AzureOperatorInsights } from "diagrams-js/azure/hybridmulticloud"; ``` ![AzureOperatorNexus](/resources/azure/hybridmulticloud/azure-operator-nexus.png) **AzureOperatorNexus** ``` import { AzureOperatorNexus } from "diagrams-js/azure/hybridmulticloud"; ``` ![AzureOperatorServiceManager](/resources/azure/hybridmulticloud/azure-operator-service-manager.png) **AzureOperatorServiceManager** ``` import { AzureOperatorServiceManager } from "diagrams-js/azure/hybridmulticloud"; ``` ![AzureProgrammableConnectivity](/resources/azure/hybridmulticloud/azure-programmable-connectivity.png) **AzureProgrammableConnectivity** ``` import { AzureProgrammableConnectivity } from "diagrams-js/azure/hybridmulticloud"; ``` ### azure/identity[​](#azureidentity "Direct link to azure/identity") ![AadLicenses](/resources/azure/identity/aad-licenses.png) **AadLicenses** ``` import { AadLicenses } from "diagrams-js/azure/identity"; ``` ![AccessReview](/resources/azure/identity/access-review.png) **AccessReview** ``` import { AccessReview } from "diagrams-js/azure/identity"; ``` ![ActiveDirectoryConnectHealth](/resources/azure/identity/active-directory-connect-health.png) **ActiveDirectoryConnectHealth** ``` import { ActiveDirectoryConnectHealth } from "diagrams-js/azure/identity"; ``` ![ActiveDirectory](/resources/azure/identity/active-directory.png) **ActiveDirectory** ``` import { ActiveDirectory } from "diagrams-js/azure/identity"; ``` ![ADB2C](/resources/azure/identity/ad-b2c.png) **ADB2C** ``` import { ADB2C } from "diagrams-js/azure/identity"; ``` ![ADDomainServices](/resources/azure/identity/ad-domain-services.png) **ADDomainServices** ``` import { ADDomainServices } from "diagrams-js/azure/identity"; ``` ![ADIdentityProtection](/resources/azure/identity/ad-identity-protection.png) **ADIdentityProtection** ``` import { ADIdentityProtection } from "diagrams-js/azure/identity"; ``` ![ADPrivilegedIdentityManagement](/resources/azure/identity/ad-privileged-identity-management.png) **ADPrivilegedIdentityManagement** ``` import { ADPrivilegedIdentityManagement } from "diagrams-js/azure/identity"; ``` ![AdministrativeUnits](/resources/azure/identity/administrative-units.png) **AdministrativeUnits** ``` import { AdministrativeUnits } from "diagrams-js/azure/identity"; ``` ![APIProxy](/resources/azure/identity/api-proxy.png) **APIProxy** ``` import { APIProxy } from "diagrams-js/azure/identity"; ``` ![AppRegistrations](/resources/azure/identity/app-registrations.png) **AppRegistrations** ``` import { AppRegistrations } from "diagrams-js/azure/identity"; ``` ![AzureActiveDirectory](/resources/azure/identity/azure-active-directory.png) **AzureActiveDirectory** ``` import { AzureActiveDirectory } from "diagrams-js/azure/identity"; ``` ![AzureADB2C](/resources/azure/identity/azure-ad-b2c.png) **AzureADB2C** ``` import { AzureADB2C } from "diagrams-js/azure/identity"; ``` ![AzureADDomainServices](/resources/azure/identity/azure-ad-domain-services.png) **AzureADDomainServices** ``` import { AzureADDomainServices } from "diagrams-js/azure/identity"; ``` ![AzureADIdentityProtection](/resources/azure/identity/azure-ad-identity-protection.png) **AzureADIdentityProtection** ``` import { AzureADIdentityProtection } from "diagrams-js/azure/identity"; ``` ![AzureADPrivilegeIdentityManagement](/resources/azure/identity/azure-ad-privilege-identity-management.png) **AzureADPrivilegeIdentityManagement** ``` import { AzureADPrivilegeIdentityManagement } from "diagrams-js/azure/identity"; ``` ![AzureADPrivlegedIdentityManagement](/resources/azure/identity/azure-ad-privleged-identity-management.png) **AzureADPrivlegedIdentityManagement** ``` import { AzureADPrivlegedIdentityManagement } from "diagrams-js/azure/identity"; ``` ![AzureADRolesAndAdministrators](/resources/azure/identity/azure-ad-roles-and-administrators.png) **AzureADRolesAndAdministrators** ``` import { AzureADRolesAndAdministrators } from "diagrams-js/azure/identity"; ``` ![AzureInformationProtection](/resources/azure/identity/azure-information-protection.png) **AzureInformationProtection** ``` import { AzureInformationProtection } from "diagrams-js/azure/identity"; ``` ![ConditionalAccess](/resources/azure/identity/conditional-access.png) **ConditionalAccess** ``` import { ConditionalAccess } from "diagrams-js/azure/identity"; ``` ![CustomAzureADRoles](/resources/azure/identity/custom-azure-ad-roles.png) **CustomAzureADRoles** ``` import { CustomAzureADRoles } from "diagrams-js/azure/identity"; ``` ![EnterpriseApplications](/resources/azure/identity/enterprise-applications.png) **EnterpriseApplications** ``` import { EnterpriseApplications } from "diagrams-js/azure/identity"; ``` ![EntraConnect](/resources/azure/identity/entra-connect.png) **EntraConnect** ``` import { EntraConnect } from "diagrams-js/azure/identity"; ``` ![EntraDomainServices](/resources/azure/identity/entra-domain-services.png) **EntraDomainServices** ``` import { EntraDomainServices } from "diagrams-js/azure/identity"; ``` ![EntraIDProtection](/resources/azure/identity/entra-id-protection.png) **EntraIDProtection** ``` import { EntraIDProtection } from "diagrams-js/azure/identity"; ``` ![EntraManagedIdentities](/resources/azure/identity/entra-managed-identities.png) **EntraManagedIdentities** ``` import { EntraManagedIdentities } from "diagrams-js/azure/identity"; ``` ![EntraPrivlegedIdentityManagement](/resources/azure/identity/entra-privleged-identity-management.png) **EntraPrivlegedIdentityManagement** ``` import { EntraPrivlegedIdentityManagement } from "diagrams-js/azure/identity"; ``` ![EntraVerifiedID](/resources/azure/identity/entra-verified-id.png) **EntraVerifiedID** ``` import { EntraVerifiedID } from "diagrams-js/azure/identity"; ``` ![ExternalIdentities](/resources/azure/identity/external-identities.png) **ExternalIdentities** ``` import { ExternalIdentities } from "diagrams-js/azure/identity"; ``` ![GlobalSecureAccess](/resources/azure/identity/global-secure-access.png) **GlobalSecureAccess** ``` import { GlobalSecureAccess } from "diagrams-js/azure/identity"; ``` ![Groups](/resources/azure/identity/groups.png) **Groups** ``` import { Groups } from "diagrams-js/azure/identity"; ``` ![IdentityGovernance](/resources/azure/identity/identity-governance.png) **IdentityGovernance** ``` import { IdentityGovernance } from "diagrams-js/azure/identity"; ``` ![InformationProtection](/resources/azure/identity/information-protection.png) **InformationProtection** ``` import { InformationProtection } from "diagrams-js/azure/identity"; ``` ![InternetAccess](/resources/azure/identity/internet-access.png) **InternetAccess** ``` import { InternetAccess } from "diagrams-js/azure/identity"; ``` ![ManagedIdentities](/resources/azure/identity/managed-identities.png) **ManagedIdentities** ``` import { ManagedIdentities } from "diagrams-js/azure/identity"; ``` ![PrivateAccess](/resources/azure/identity/private-access.png) **PrivateAccess** ``` import { PrivateAccess } from "diagrams-js/azure/identity"; ``` ![Security](/resources/azure/identity/security.png) **Security** ``` import { Security } from "diagrams-js/azure/identity"; ``` ![TenantProperties](/resources/azure/identity/tenant-properties.png) **TenantProperties** ``` import { TenantProperties } from "diagrams-js/azure/identity"; ``` ![UserSettings](/resources/azure/identity/user-settings.png) **UserSettings** ``` import { UserSettings } from "diagrams-js/azure/identity"; ``` ![Users](/resources/azure/identity/users.png) **Users** ``` import { Users } from "diagrams-js/azure/identity"; ``` ![VerifiableCredentials](/resources/azure/identity/verifiable-credentials.png) **VerifiableCredentials** ``` import { VerifiableCredentials } from "diagrams-js/azure/identity"; ``` ### azure/integration[​](#azureintegration "Direct link to azure/integration") ![APIConnections](/resources/azure/integration/api-connections.png) **APIConnections** ``` import { APIConnections } from "diagrams-js/azure/integration"; ``` ![APIForFhir](/resources/azure/integration/api-for-fhir.png) **APIForFhir** ``` import { APIForFhir } from "diagrams-js/azure/integration"; ``` ![APIManagementServices](/resources/azure/integration/api-management-services.png) **APIManagementServices** ``` import { APIManagementServices } from "diagrams-js/azure/integration"; ``` ![APIManagement](/resources/azure/integration/api-management.png) **APIManagement** ``` import { APIManagement } from "diagrams-js/azure/integration"; ``` ![AppConfiguration](/resources/azure/integration/app-configuration.png) **AppConfiguration** ``` import { AppConfiguration } from "diagrams-js/azure/integration"; ``` ![AzureAPIForFhir](/resources/azure/integration/azure-api-for-fhir.png) **AzureAPIForFhir** ``` import { AzureAPIForFhir } from "diagrams-js/azure/integration"; ``` ![AzureDataCatalog](/resources/azure/integration/azure-data-catalog.png) **AzureDataCatalog** ``` import { AzureDataCatalog } from "diagrams-js/azure/integration"; ``` ![AzureDataboxGateway](/resources/azure/integration/azure-databox-gateway.png) **AzureDataboxGateway** ``` import { AzureDataboxGateway } from "diagrams-js/azure/integration"; ``` ![AzureServiceBus](/resources/azure/integration/azure-service-bus.png) **AzureServiceBus** ``` import { AzureServiceBus } from "diagrams-js/azure/integration"; ``` ![AzureSQLServerStretchDatabases](/resources/azure/integration/azure-sql-server-stretch-databases.png) **AzureSQLServerStretchDatabases** ``` import { AzureSQLServerStretchDatabases } from "diagrams-js/azure/integration"; ``` ![AzureStackEdge](/resources/azure/integration/azure-stack-edge.png) **AzureStackEdge** ``` import { AzureStackEdge } from "diagrams-js/azure/integration"; ``` ![DataCatalog](/resources/azure/integration/data-catalog.png) **DataCatalog** ``` import { DataCatalog } from "diagrams-js/azure/integration"; ``` ![DataFactories](/resources/azure/integration/data-factories.png) **DataFactories** ``` import { DataFactories } from "diagrams-js/azure/integration"; ``` ![EventGridDomains](/resources/azure/integration/event-grid-domains.png) **EventGridDomains** ``` import { EventGridDomains } from "diagrams-js/azure/integration"; ``` ![EventGridSubscriptions](/resources/azure/integration/event-grid-subscriptions.png) **EventGridSubscriptions** ``` import { EventGridSubscriptions } from "diagrams-js/azure/integration"; ``` ![EventGridTopics](/resources/azure/integration/event-grid-topics.png) **EventGridTopics** ``` import { EventGridTopics } from "diagrams-js/azure/integration"; ``` ![IntegrationAccounts](/resources/azure/integration/integration-accounts.png) **IntegrationAccounts** ``` import { IntegrationAccounts } from "diagrams-js/azure/integration"; ``` ![IntegrationEnvironments](/resources/azure/integration/integration-environments.png) **IntegrationEnvironments** ``` import { IntegrationEnvironments } from "diagrams-js/azure/integration"; ``` ![IntegrationServiceEnvironments](/resources/azure/integration/integration-service-environments.png) **IntegrationServiceEnvironments** ``` import { IntegrationServiceEnvironments } from "diagrams-js/azure/integration"; ``` ![LogicAppsCustomConnector](/resources/azure/integration/logic-apps-custom-connector.png) **LogicAppsCustomConnector** ``` import { LogicAppsCustomConnector } from "diagrams-js/azure/integration"; ``` ![LogicApps](/resources/azure/integration/logic-apps.png) **LogicApps** ``` import { LogicApps } from "diagrams-js/azure/integration"; ``` ![PartnerNamespace](/resources/azure/integration/partner-namespace.png) **PartnerNamespace** ``` import { PartnerNamespace } from "diagrams-js/azure/integration"; ``` ![PartnerRegistration](/resources/azure/integration/partner-registration.png) **PartnerRegistration** ``` import { PartnerRegistration } from "diagrams-js/azure/integration"; ``` ![PartnerTopic](/resources/azure/integration/partner-topic.png) **PartnerTopic** ``` import { PartnerTopic } from "diagrams-js/azure/integration"; ``` ![PowerPlatform](/resources/azure/integration/power-platform.png) **PowerPlatform** ``` import { PowerPlatform } from "diagrams-js/azure/integration"; ``` ![Relays](/resources/azure/integration/relays.png) **Relays** ``` import { Relays } from "diagrams-js/azure/integration"; ``` ![SendgridAccounts](/resources/azure/integration/sendgrid-accounts.png) **SendgridAccounts** ``` import { SendgridAccounts } from "diagrams-js/azure/integration"; ``` ![ServiceBusRelays](/resources/azure/integration/service-bus-relays.png) **ServiceBusRelays** ``` import { ServiceBusRelays } from "diagrams-js/azure/integration"; ``` ![ServiceBus](/resources/azure/integration/service-bus.png) **ServiceBus** ``` import { ServiceBus } from "diagrams-js/azure/integration"; ``` ![ServiceCatalogManagedApplicationDefinitions](/resources/azure/integration/service-catalog-managed-application-definitions.png) **ServiceCatalogManagedApplicationDefinitions** ``` import { ServiceCatalogManagedApplicationDefinitions } from "diagrams-js/azure/integration"; ``` ![SoftwareAsAService](/resources/azure/integration/software-as-a-service.png) **SoftwareAsAService** ``` import { SoftwareAsAService } from "diagrams-js/azure/integration"; ``` ![SQLDataWarehouses](/resources/azure/integration/sql-data-warehouses.png) **SQLDataWarehouses** ``` import { SQLDataWarehouses } from "diagrams-js/azure/integration"; ``` ![StorsimpleDeviceManagers](/resources/azure/integration/storsimple-device-managers.png) **StorsimpleDeviceManagers** ``` import { StorsimpleDeviceManagers } from "diagrams-js/azure/integration"; ``` ![SystemTopic](/resources/azure/integration/system-topic.png) **SystemTopic** ``` import { SystemTopic } from "diagrams-js/azure/integration"; ``` ### azure/intune[​](#azureintune "Direct link to azure/intune") ![AzureADRolesAndAdministrators](/resources/azure/intune/azure-ad-roles-and-administrators.png) **AzureADRolesAndAdministrators** ``` import { AzureADRolesAndAdministrators } from "diagrams-js/azure/intune"; ``` ![ClientApps](/resources/azure/intune/client-apps.png) **ClientApps** ``` import { ClientApps } from "diagrams-js/azure/intune"; ``` ![DeviceCompliance](/resources/azure/intune/device-compliance.png) **DeviceCompliance** ``` import { DeviceCompliance } from "diagrams-js/azure/intune"; ``` ![DeviceConfiguration](/resources/azure/intune/device-configuration.png) **DeviceConfiguration** ``` import { DeviceConfiguration } from "diagrams-js/azure/intune"; ``` ![DeviceEnrollment](/resources/azure/intune/device-enrollment.png) **DeviceEnrollment** ``` import { DeviceEnrollment } from "diagrams-js/azure/intune"; ``` ![DeviceSecurityApple](/resources/azure/intune/device-security-apple.png) **DeviceSecurityApple** ``` import { DeviceSecurityApple } from "diagrams-js/azure/intune"; ``` ![DeviceSecurityGoogle](/resources/azure/intune/device-security-google.png) **DeviceSecurityGoogle** ``` import { DeviceSecurityGoogle } from "diagrams-js/azure/intune"; ``` ![DeviceSecurityWindows](/resources/azure/intune/device-security-windows.png) **DeviceSecurityWindows** ``` import { DeviceSecurityWindows } from "diagrams-js/azure/intune"; ``` ![Devices](/resources/azure/intune/devices.png) **Devices** ``` import { Devices } from "diagrams-js/azure/intune"; ``` ![Ebooks](/resources/azure/intune/ebooks.png) **Ebooks** ``` import { Ebooks } from "diagrams-js/azure/intune"; ``` ![ExchangeAccess](/resources/azure/intune/exchange-access.png) **ExchangeAccess** ``` import { ExchangeAccess } from "diagrams-js/azure/intune"; ``` ![IntuneAppProtection](/resources/azure/intune/intune-app-protection.png) **IntuneAppProtection** ``` import { IntuneAppProtection } from "diagrams-js/azure/intune"; ``` ![IntuneForEducation](/resources/azure/intune/intune-for-education.png) **IntuneForEducation** ``` import { IntuneForEducation } from "diagrams-js/azure/intune"; ``` ![Intune](/resources/azure/intune/intune.png) **Intune** ``` import { Intune } from "diagrams-js/azure/intune"; ``` ![Mindaro](/resources/azure/intune/mindaro.png) **Mindaro** ``` import { Mindaro } from "diagrams-js/azure/intune"; ``` ![SecurityBaselines](/resources/azure/intune/security-baselines.png) **SecurityBaselines** ``` import { SecurityBaselines } from "diagrams-js/azure/intune"; ``` ![SoftwareUpdates](/resources/azure/intune/software-updates.png) **SoftwareUpdates** ``` import { SoftwareUpdates } from "diagrams-js/azure/intune"; ``` ![TenantStatus](/resources/azure/intune/tenant-status.png) **TenantStatus** ``` import { TenantStatus } from "diagrams-js/azure/intune"; ``` ### azure/iot[​](#azureiot "Direct link to azure/iot") ![AzureCosmosDb](/resources/azure/iot/azure-cosmos-db.png) **AzureCosmosDb** ``` import { AzureCosmosDb } from "diagrams-js/azure/iot"; ``` ![AzureDataboxGateway](/resources/azure/iot/azure-databox-gateway.png) **AzureDataboxGateway** ``` import { AzureDataboxGateway } from "diagrams-js/azure/iot"; ``` ![AzureIotOperations](/resources/azure/iot/azure-iot-operations.png) **AzureIotOperations** ``` import { AzureIotOperations } from "diagrams-js/azure/iot"; ``` ![AzureMapsAccounts](/resources/azure/iot/azure-maps-accounts.png) **AzureMapsAccounts** ``` import { AzureMapsAccounts } from "diagrams-js/azure/iot"; ``` ![AzureStack](/resources/azure/iot/azure-stack.png) **AzureStack** ``` import { AzureStack } from "diagrams-js/azure/iot"; ``` ![DeviceProvisioningServices](/resources/azure/iot/device-provisioning-services.png) **DeviceProvisioningServices** ``` import { DeviceProvisioningServices } from "diagrams-js/azure/iot"; ``` ![DigitalTwins](/resources/azure/iot/digital-twins.png) **DigitalTwins** ``` import { DigitalTwins } from "diagrams-js/azure/iot"; ``` ![EventGridSubscriptions](/resources/azure/iot/event-grid-subscriptions.png) **EventGridSubscriptions** ``` import { EventGridSubscriptions } from "diagrams-js/azure/iot"; ``` ![EventHubClusters](/resources/azure/iot/event-hub-clusters.png) **EventHubClusters** ``` import { EventHubClusters } from "diagrams-js/azure/iot"; ``` ![EventHubs](/resources/azure/iot/event-hubs.png) **EventHubs** ``` import { EventHubs } from "diagrams-js/azure/iot"; ``` ![FunctionApps](/resources/azure/iot/function-apps.png) **FunctionApps** ``` import { FunctionApps } from "diagrams-js/azure/iot"; ``` ![IndustrialIot](/resources/azure/iot/industrial-iot.png) **IndustrialIot** ``` import { IndustrialIot } from "diagrams-js/azure/iot"; ``` ![IotCentralApplications](/resources/azure/iot/iot-central-applications.png) **IotCentralApplications** ``` import { IotCentralApplications } from "diagrams-js/azure/iot"; ``` ![IotEdge](/resources/azure/iot/iot-edge.png) **IotEdge** ``` import { IotEdge } from "diagrams-js/azure/iot"; ``` ![IotHubSecurity](/resources/azure/iot/iot-hub-security.png) **IotHubSecurity** ``` import { IotHubSecurity } from "diagrams-js/azure/iot"; ``` ![IotHub](/resources/azure/iot/iot-hub.png) **IotHub** ``` import { IotHub } from "diagrams-js/azure/iot"; ``` ![LogicApps](/resources/azure/iot/logic-apps.png) **LogicApps** ``` import { LogicApps } from "diagrams-js/azure/iot"; ``` ![MachineLearningStudioClassicWebServices](/resources/azure/iot/machine-learning-studio-classic-web-services.png) **MachineLearningStudioClassicWebServices** ``` import { MachineLearningStudioClassicWebServices } from "diagrams-js/azure/iot"; ``` ![MachineLearningStudioWebServicePlans](/resources/azure/iot/machine-learning-studio-web-service-plans.png) **MachineLearningStudioWebServicePlans** ``` import { MachineLearningStudioWebServicePlans } from "diagrams-js/azure/iot"; ``` ![MachineLearningStudioWorkspaces](/resources/azure/iot/machine-learning-studio-workspaces.png) **MachineLearningStudioWorkspaces** ``` import { MachineLearningStudioWorkspaces } from "diagrams-js/azure/iot"; ``` ![Maps](/resources/azure/iot/maps.png) **Maps** ``` import { Maps } from "diagrams-js/azure/iot"; ``` ![NotificationHubNamespaces](/resources/azure/iot/notification-hub-namespaces.png) **NotificationHubNamespaces** ``` import { NotificationHubNamespaces } from "diagrams-js/azure/iot"; ``` ![NotificationHubs](/resources/azure/iot/notification-hubs.png) **NotificationHubs** ``` import { NotificationHubs } from "diagrams-js/azure/iot"; ``` ![Sphere](/resources/azure/iot/sphere.png) **Sphere** ``` import { Sphere } from "diagrams-js/azure/iot"; ``` ![StackHciPremium](/resources/azure/iot/stack-hci-premium.png) **StackHciPremium** ``` import { StackHciPremium } from "diagrams-js/azure/iot"; ``` ![StreamAnalyticsJobs](/resources/azure/iot/stream-analytics-jobs.png) **StreamAnalyticsJobs** ``` import { StreamAnalyticsJobs } from "diagrams-js/azure/iot"; ``` ![TimeSeriesDataSets](/resources/azure/iot/time-series-data-sets.png) **TimeSeriesDataSets** ``` import { TimeSeriesDataSets } from "diagrams-js/azure/iot"; ``` ![TimeSeriesInsightsAccessPolicies](/resources/azure/iot/time-series-insights-access-policies.png) **TimeSeriesInsightsAccessPolicies** ``` import { TimeSeriesInsightsAccessPolicies } from "diagrams-js/azure/iot"; ``` ![TimeSeriesInsightsEnvironments](/resources/azure/iot/time-series-insights-environments.png) **TimeSeriesInsightsEnvironments** ``` import { TimeSeriesInsightsEnvironments } from "diagrams-js/azure/iot"; ``` ![TimeSeriesInsightsEventSources](/resources/azure/iot/time-series-insights-event-sources.png) **TimeSeriesInsightsEventSources** ``` import { TimeSeriesInsightsEventSources } from "diagrams-js/azure/iot"; ``` ![TimeSeriesInsightsEventsSources](/resources/azure/iot/time-series-insights-events-sources.png) **TimeSeriesInsightsEventsSources** ``` import { TimeSeriesInsightsEventsSources } from "diagrams-js/azure/iot"; ``` ![Windows10IotCoreServices](/resources/azure/iot/windows-10-iot-core-services.png) **Windows10IotCoreServices** ``` import { Windows10IotCoreServices } from "diagrams-js/azure/iot"; ``` ![Windows10CoreServices](/resources/azure/iot/windows10-core-services.png) **Windows10CoreServices** ``` import { Windows10CoreServices } from "diagrams-js/azure/iot"; ``` ### azure/managementgovernance[​](#azuremanagementgovernance "Direct link to azure/managementgovernance") ![ActivityLog](/resources/azure/managementgovernance/activity-log.png) **ActivityLog** ``` import { ActivityLog } from "diagrams-js/azure/managementgovernance"; ``` ![Advisor](/resources/azure/managementgovernance/advisor.png) **Advisor** ``` import { Advisor } from "diagrams-js/azure/managementgovernance"; ``` ![Alerts](/resources/azure/managementgovernance/alerts.png) **Alerts** ``` import { Alerts } from "diagrams-js/azure/managementgovernance"; ``` ![ApplicationInsights](/resources/azure/managementgovernance/application-insights.png) **ApplicationInsights** ``` import { ApplicationInsights } from "diagrams-js/azure/managementgovernance"; ``` ![ArcMachines](/resources/azure/managementgovernance/arc-machines.png) **ArcMachines** ``` import { ArcMachines } from "diagrams-js/azure/managementgovernance"; ``` ![AutomationAccounts](/resources/azure/managementgovernance/automation-accounts.png) **AutomationAccounts** ``` import { AutomationAccounts } from "diagrams-js/azure/managementgovernance"; ``` ![AzureArc](/resources/azure/managementgovernance/azure-arc.png) **AzureArc** ``` import { AzureArc } from "diagrams-js/azure/managementgovernance"; ``` ![AzureLighthouse](/resources/azure/managementgovernance/azure-lighthouse.png) **AzureLighthouse** ``` import { AzureLighthouse } from "diagrams-js/azure/managementgovernance"; ``` ![Blueprints](/resources/azure/managementgovernance/blueprints.png) **Blueprints** ``` import { Blueprints } from "diagrams-js/azure/managementgovernance"; ``` ![Compliance](/resources/azure/managementgovernance/compliance.png) **Compliance** ``` import { Compliance } from "diagrams-js/azure/managementgovernance"; ``` ![CostManagementAndBilling](/resources/azure/managementgovernance/cost-management-and-billing.png) **CostManagementAndBilling** ``` import { CostManagementAndBilling } from "diagrams-js/azure/managementgovernance"; ``` ![CustomerLockboxForMicrosoftAzure](/resources/azure/managementgovernance/customer-lockbox-for-microsoft-azure.png) **CustomerLockboxForMicrosoftAzure** ``` import { CustomerLockboxForMicrosoftAzure } from "diagrams-js/azure/managementgovernance"; ``` ![DiagnosticsSettings](/resources/azure/managementgovernance/diagnostics-settings.png) **DiagnosticsSettings** ``` import { DiagnosticsSettings } from "diagrams-js/azure/managementgovernance"; ``` ![Education](/resources/azure/managementgovernance/education.png) **Education** ``` import { Education } from "diagrams-js/azure/managementgovernance"; ``` ![IntuneTrends](/resources/azure/managementgovernance/intune-trends.png) **IntuneTrends** ``` import { IntuneTrends } from "diagrams-js/azure/managementgovernance"; ``` ![LogAnalyticsWorkspaces](/resources/azure/managementgovernance/log-analytics-workspaces.png) **LogAnalyticsWorkspaces** ``` import { LogAnalyticsWorkspaces } from "diagrams-js/azure/managementgovernance"; ``` ![Machinesazurearc](/resources/azure/managementgovernance/machinesazurearc.png) **Machinesazurearc** ``` import { Machinesazurearc } from "diagrams-js/azure/managementgovernance"; ``` ![ManagedApplicationsCenter](/resources/azure/managementgovernance/managed-applications-center.png) **ManagedApplicationsCenter** ``` import { ManagedApplicationsCenter } from "diagrams-js/azure/managementgovernance"; ``` ![ManagedDesktop](/resources/azure/managementgovernance/managed-desktop.png) **ManagedDesktop** ``` import { ManagedDesktop } from "diagrams-js/azure/managementgovernance"; ``` ![Metrics](/resources/azure/managementgovernance/metrics.png) **Metrics** ``` import { Metrics } from "diagrams-js/azure/managementgovernance"; ``` ![Monitor](/resources/azure/managementgovernance/monitor.png) **Monitor** ``` import { Monitor } from "diagrams-js/azure/managementgovernance"; ``` ![MyCustomers](/resources/azure/managementgovernance/my-customers.png) **MyCustomers** ``` import { MyCustomers } from "diagrams-js/azure/managementgovernance"; ``` ![OperationLogClassic](/resources/azure/managementgovernance/operation-log-classic.png) **OperationLogClassic** ``` import { OperationLogClassic } from "diagrams-js/azure/managementgovernance"; ``` ![Policy](/resources/azure/managementgovernance/policy.png) **Policy** ``` import { Policy } from "diagrams-js/azure/managementgovernance"; ``` ![RecoveryServicesVaults](/resources/azure/managementgovernance/recovery-services-vaults.png) **RecoveryServicesVaults** ``` import { RecoveryServicesVaults } from "diagrams-js/azure/managementgovernance"; ``` ![ResourceGraphExplorer](/resources/azure/managementgovernance/resource-graph-explorer.png) **ResourceGraphExplorer** ``` import { ResourceGraphExplorer } from "diagrams-js/azure/managementgovernance"; ``` ![ResourcesProvider](/resources/azure/managementgovernance/resources-provider.png) **ResourcesProvider** ``` import { ResourcesProvider } from "diagrams-js/azure/managementgovernance"; ``` ![SchedulerJobCollections](/resources/azure/managementgovernance/scheduler-job-collections.png) **SchedulerJobCollections** ``` import { SchedulerJobCollections } from "diagrams-js/azure/managementgovernance"; ``` ![ServiceCatalogMad](/resources/azure/managementgovernance/service-catalog-mad.png) **ServiceCatalogMad** ``` import { ServiceCatalogMad } from "diagrams-js/azure/managementgovernance"; ``` ![ServiceProviders](/resources/azure/managementgovernance/service-providers.png) **ServiceProviders** ``` import { ServiceProviders } from "diagrams-js/azure/managementgovernance"; ``` ![Solutions](/resources/azure/managementgovernance/solutions.png) **Solutions** ``` import { Solutions } from "diagrams-js/azure/managementgovernance"; ``` ![UniversalPrint](/resources/azure/managementgovernance/universal-print.png) **UniversalPrint** ``` import { UniversalPrint } from "diagrams-js/azure/managementgovernance"; ``` ![UserPrivacy](/resources/azure/managementgovernance/user-privacy.png) **UserPrivacy** ``` import { UserPrivacy } from "diagrams-js/azure/managementgovernance"; ``` ### azure/menu[​](#azuremenu "Direct link to azure/menu") ![Keys](/resources/azure/menu/keys.png) **Keys** ``` import { Keys } from "diagrams-js/azure/menu"; ``` ### azure/migrate[​](#azuremigrate "Direct link to azure/migrate") ![AzureDataboxGateway](/resources/azure/migrate/azure-databox-gateway.png) **AzureDataboxGateway** ``` import { AzureDataboxGateway } from "diagrams-js/azure/migrate"; ``` ![AzureMigrate](/resources/azure/migrate/azure-migrate.png) **AzureMigrate** ``` import { AzureMigrate } from "diagrams-js/azure/migrate"; ``` ![AzureStackEdge](/resources/azure/migrate/azure-stack-edge.png) **AzureStackEdge** ``` import { AzureStackEdge } from "diagrams-js/azure/migrate"; ``` ![CostManagementAndBilling](/resources/azure/migrate/cost-management-and-billing.png) **CostManagementAndBilling** ``` import { CostManagementAndBilling } from "diagrams-js/azure/migrate"; ``` ![DataBox](/resources/azure/migrate/data-box.png) **DataBox** ``` import { DataBox } from "diagrams-js/azure/migrate"; ``` ![RecoveryServicesVaults](/resources/azure/migrate/recovery-services-vaults.png) **RecoveryServicesVaults** ``` import { RecoveryServicesVaults } from "diagrams-js/azure/migrate"; ``` ### azure/migration[​](#azuremigration "Direct link to azure/migration") ![AzureDatabaseMigrationServices](/resources/azure/migration/azure-database-migration-services.png) **AzureDatabaseMigrationServices** ``` import { AzureDatabaseMigrationServices } from "diagrams-js/azure/migration"; ``` ![DataBoxEdge](/resources/azure/migration/data-box-edge.png) **DataBoxEdge** ``` import { DataBoxEdge } from "diagrams-js/azure/migration"; ``` ![DataBox](/resources/azure/migration/data-box.png) **DataBox** ``` import { DataBox } from "diagrams-js/azure/migration"; ``` ![DatabaseMigrationServices](/resources/azure/migration/database-migration-services.png) **DatabaseMigrationServices** ``` import { DatabaseMigrationServices } from "diagrams-js/azure/migration"; ``` ![MigrationProjects](/resources/azure/migration/migration-projects.png) **MigrationProjects** ``` import { MigrationProjects } from "diagrams-js/azure/migration"; ``` ![RecoveryServicesVaults](/resources/azure/migration/recovery-services-vaults.png) **RecoveryServicesVaults** ``` import { RecoveryServicesVaults } from "diagrams-js/azure/migration"; ``` ### azure/mixedreality[​](#azuremixedreality "Direct link to azure/mixedreality") ![RemoteRendering](/resources/azure/mixedreality/remote-rendering.png) **RemoteRendering** ``` import { RemoteRendering } from "diagrams-js/azure/mixedreality"; ``` ![SpatialAnchorAccounts](/resources/azure/mixedreality/spatial-anchor-accounts.png) **SpatialAnchorAccounts** ``` import { SpatialAnchorAccounts } from "diagrams-js/azure/mixedreality"; ``` ### azure/ml[​](#azureml "Direct link to azure/ml") ![AzureOpenAI](/resources/azure/ml/azure-open-ai.png) **AzureOpenAI** ``` import { AzureOpenAI } from "diagrams-js/azure/ml"; ``` ![AzureSpeechService](/resources/azure/ml/azure-speech-service.png) **AzureSpeechService** ``` import { AzureSpeechService } from "diagrams-js/azure/ml"; ``` ![BatchAI](/resources/azure/ml/batch-ai.png) **BatchAI** ``` import { BatchAI } from "diagrams-js/azure/ml"; ``` ![BotServices](/resources/azure/ml/bot-services.png) **BotServices** ``` import { BotServices } from "diagrams-js/azure/ml"; ``` ![CognitiveServices](/resources/azure/ml/cognitive-services.png) **CognitiveServices** ``` import { CognitiveServices } from "diagrams-js/azure/ml"; ``` ![GenomicsAccounts](/resources/azure/ml/genomics-accounts.png) **GenomicsAccounts** ``` import { GenomicsAccounts } from "diagrams-js/azure/ml"; ``` ![MachineLearningServiceWorkspaces](/resources/azure/ml/machine-learning-service-workspaces.png) **MachineLearningServiceWorkspaces** ``` import { MachineLearningServiceWorkspaces } from "diagrams-js/azure/ml"; ``` ![MachineLearningStudioWebServicePlans](/resources/azure/ml/machine-learning-studio-web-service-plans.png) **MachineLearningStudioWebServicePlans** ``` import { MachineLearningStudioWebServicePlans } from "diagrams-js/azure/ml"; ``` ![MachineLearningStudioWebServices](/resources/azure/ml/machine-learning-studio-web-services.png) **MachineLearningStudioWebServices** ``` import { MachineLearningStudioWebServices } from "diagrams-js/azure/ml"; ``` ![MachineLearningStudioWorkspaces](/resources/azure/ml/machine-learning-studio-workspaces.png) **MachineLearningStudioWorkspaces** ``` import { MachineLearningStudioWorkspaces } from "diagrams-js/azure/ml"; ``` ### azure/mobile[​](#azuremobile "Direct link to azure/mobile") ![AppServiceMobile](/resources/azure/mobile/app-service-mobile.png) **AppServiceMobile** ``` import { AppServiceMobile } from "diagrams-js/azure/mobile"; ``` ![AppServices](/resources/azure/mobile/app-services.png) **AppServices** ``` import { AppServices } from "diagrams-js/azure/mobile"; ``` ![MobileEngagement](/resources/azure/mobile/mobile-engagement.png) **MobileEngagement** ``` import { MobileEngagement } from "diagrams-js/azure/mobile"; ``` ![NotificationHubs](/resources/azure/mobile/notification-hubs.png) **NotificationHubs** ``` import { NotificationHubs } from "diagrams-js/azure/mobile"; ``` ![PowerPlatform](/resources/azure/mobile/power-platform.png) **PowerPlatform** ``` import { PowerPlatform } from "diagrams-js/azure/mobile"; ``` ### azure/monitor[​](#azuremonitor "Direct link to azure/monitor") ![ActivityLog](/resources/azure/monitor/activity-log.png) **ActivityLog** ``` import { ActivityLog } from "diagrams-js/azure/monitor"; ``` ![ApplicationInsights](/resources/azure/monitor/application-insights.png) **ApplicationInsights** ``` import { ApplicationInsights } from "diagrams-js/azure/monitor"; ``` ![AutoScale](/resources/azure/monitor/auto-scale.png) **AutoScale** ``` import { AutoScale } from "diagrams-js/azure/monitor"; ``` ![AzureMonitorsForSAPSolutions](/resources/azure/monitor/azure-monitors-for-sap-solutions.png) **AzureMonitorsForSAPSolutions** ``` import { AzureMonitorsForSAPSolutions } from "diagrams-js/azure/monitor"; ``` ![AzureWorkbooks](/resources/azure/monitor/azure-workbooks.png) **AzureWorkbooks** ``` import { AzureWorkbooks } from "diagrams-js/azure/monitor"; ``` ![ChangeAnalysis](/resources/azure/monitor/change-analysis.png) **ChangeAnalysis** ``` import { ChangeAnalysis } from "diagrams-js/azure/monitor"; ``` ![DiagnosticsSettings](/resources/azure/monitor/diagnostics-settings.png) **DiagnosticsSettings** ``` import { DiagnosticsSettings } from "diagrams-js/azure/monitor"; ``` ![LogAnalyticsWorkspaces](/resources/azure/monitor/log-analytics-workspaces.png) **LogAnalyticsWorkspaces** ``` import { LogAnalyticsWorkspaces } from "diagrams-js/azure/monitor"; ``` ![Logs](/resources/azure/monitor/logs.png) **Logs** ``` import { Logs } from "diagrams-js/azure/monitor"; ``` ![Metrics](/resources/azure/monitor/metrics.png) **Metrics** ``` import { Metrics } from "diagrams-js/azure/monitor"; ``` ![Monitor](/resources/azure/monitor/monitor.png) **Monitor** ``` import { Monitor } from "diagrams-js/azure/monitor"; ``` ![NetworkWatcher](/resources/azure/monitor/network-watcher.png) **NetworkWatcher** ``` import { NetworkWatcher } from "diagrams-js/azure/monitor"; ``` ### azure/network[​](#azurenetwork "Direct link to azure/network") ![ApplicationGateway](/resources/azure/network/application-gateway.png) **ApplicationGateway** ``` import { ApplicationGateway } from "diagrams-js/azure/network"; ``` ![ApplicationSecurityGroups](/resources/azure/network/application-security-groups.png) **ApplicationSecurityGroups** ``` import { ApplicationSecurityGroups } from "diagrams-js/azure/network"; ``` ![CDNProfiles](/resources/azure/network/cdn-profiles.png) **CDNProfiles** ``` import { CDNProfiles } from "diagrams-js/azure/network"; ``` ![Connections](/resources/azure/network/connections.png) **Connections** ``` import { Connections } from "diagrams-js/azure/network"; ``` ![DDOSProtectionPlans](/resources/azure/network/ddos-protection-plans.png) **DDOSProtectionPlans** ``` import { DDOSProtectionPlans } from "diagrams-js/azure/network"; ``` ![DNSPrivateZones](/resources/azure/network/dns-private-zones.png) **DNSPrivateZones** ``` import { DNSPrivateZones } from "diagrams-js/azure/network"; ``` ![DNSZones](/resources/azure/network/dns-zones.png) **DNSZones** ``` import { DNSZones } from "diagrams-js/azure/network"; ``` ![ExpressrouteCircuits](/resources/azure/network/expressroute-circuits.png) **ExpressrouteCircuits** ``` import { ExpressrouteCircuits } from "diagrams-js/azure/network"; ``` ![Firewall](/resources/azure/network/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/azure/network"; ``` ![FrontDoors](/resources/azure/network/front-doors.png) **FrontDoors** ``` import { FrontDoors } from "diagrams-js/azure/network"; ``` ![LoadBalancers](/resources/azure/network/load-balancers.png) **LoadBalancers** ``` import { LoadBalancers } from "diagrams-js/azure/network"; ``` ![LocalNetworkGateways](/resources/azure/network/local-network-gateways.png) **LocalNetworkGateways** ``` import { LocalNetworkGateways } from "diagrams-js/azure/network"; ``` ![NetworkInterfaces](/resources/azure/network/network-interfaces.png) **NetworkInterfaces** ``` import { NetworkInterfaces } from "diagrams-js/azure/network"; ``` ![NetworkSecurityGroupsClassic](/resources/azure/network/network-security-groups-classic.png) **NetworkSecurityGroupsClassic** ``` import { NetworkSecurityGroupsClassic } from "diagrams-js/azure/network"; ``` ![NetworkWatcher](/resources/azure/network/network-watcher.png) **NetworkWatcher** ``` import { NetworkWatcher } from "diagrams-js/azure/network"; ``` ![OnPremisesDataGateways](/resources/azure/network/on-premises-data-gateways.png) **OnPremisesDataGateways** ``` import { OnPremisesDataGateways } from "diagrams-js/azure/network"; ``` ![PrivateEndpoint](/resources/azure/network/private-endpoint.png) **PrivateEndpoint** ``` import { PrivateEndpoint } from "diagrams-js/azure/network"; ``` ![PublicIpAddresses](/resources/azure/network/public-ip-addresses.png) **PublicIpAddresses** ``` import { PublicIpAddresses } from "diagrams-js/azure/network"; ``` ![ReservedIpAddressesClassic](/resources/azure/network/reserved-ip-addresses-classic.png) **ReservedIpAddressesClassic** ``` import { ReservedIpAddressesClassic } from "diagrams-js/azure/network"; ``` ![RouteFilters](/resources/azure/network/route-filters.png) **RouteFilters** ``` import { RouteFilters } from "diagrams-js/azure/network"; ``` ![RouteTables](/resources/azure/network/route-tables.png) **RouteTables** ``` import { RouteTables } from "diagrams-js/azure/network"; ``` ![ServiceEndpointPolicies](/resources/azure/network/service-endpoint-policies.png) **ServiceEndpointPolicies** ``` import { ServiceEndpointPolicies } from "diagrams-js/azure/network"; ``` ![Subnets](/resources/azure/network/subnets.png) **Subnets** ``` import { Subnets } from "diagrams-js/azure/network"; ``` ![TrafficManagerProfiles](/resources/azure/network/traffic-manager-profiles.png) **TrafficManagerProfiles** ``` import { TrafficManagerProfiles } from "diagrams-js/azure/network"; ``` ![VirtualNetworkClassic](/resources/azure/network/virtual-network-classic.png) **VirtualNetworkClassic** ``` import { VirtualNetworkClassic } from "diagrams-js/azure/network"; ``` ![VirtualNetworkGateways](/resources/azure/network/virtual-network-gateways.png) **VirtualNetworkGateways** ``` import { VirtualNetworkGateways } from "diagrams-js/azure/network"; ``` ![VirtualNetworks](/resources/azure/network/virtual-networks.png) **VirtualNetworks** ``` import { VirtualNetworks } from "diagrams-js/azure/network"; ``` ![VirtualWans](/resources/azure/network/virtual-wans.png) **VirtualWans** ``` import { VirtualWans } from "diagrams-js/azure/network"; ``` ### azure/networking[​](#azurenetworking "Direct link to azure/networking") ![ApplicationGateways](/resources/azure/networking/application-gateways.png) **ApplicationGateways** ``` import { ApplicationGateways } from "diagrams-js/azure/networking"; ``` ![AtmMultistack](/resources/azure/networking/atm-multistack.png) **AtmMultistack** ``` import { AtmMultistack } from "diagrams-js/azure/networking"; ``` ![AzureCommunicationsGateway](/resources/azure/networking/azure-communications-gateway.png) **AzureCommunicationsGateway** ``` import { AzureCommunicationsGateway } from "diagrams-js/azure/networking"; ``` ![AzureFirewallManager](/resources/azure/networking/azure-firewall-manager.png) **AzureFirewallManager** ``` import { AzureFirewallManager } from "diagrams-js/azure/networking"; ``` ![AzureFirewallPolicy](/resources/azure/networking/azure-firewall-policy.png) **AzureFirewallPolicy** ``` import { AzureFirewallPolicy } from "diagrams-js/azure/networking"; ``` ![Bastions](/resources/azure/networking/bastions.png) **Bastions** ``` import { Bastions } from "diagrams-js/azure/networking"; ``` ![CDNProfiles](/resources/azure/networking/cdn-profiles.png) **CDNProfiles** ``` import { CDNProfiles } from "diagrams-js/azure/networking"; ``` ![ConnectedCache](/resources/azure/networking/connected-cache.png) **ConnectedCache** ``` import { ConnectedCache } from "diagrams-js/azure/networking"; ``` ![Connections](/resources/azure/networking/connections.png) **Connections** ``` import { Connections } from "diagrams-js/azure/networking"; ``` ![DDOSProtectionPlans](/resources/azure/networking/ddos-protection-plans.png) **DDOSProtectionPlans** ``` import { DDOSProtectionPlans } from "diagrams-js/azure/networking"; ``` ![DNSMultistack](/resources/azure/networking/dns-multistack.png) **DNSMultistack** ``` import { DNSMultistack } from "diagrams-js/azure/networking"; ``` ![DNSPrivateResolver](/resources/azure/networking/dns-private-resolver.png) **DNSPrivateResolver** ``` import { DNSPrivateResolver } from "diagrams-js/azure/networking"; ``` ![DNSSecurityPolicy](/resources/azure/networking/dns-security-policy.png) **DNSSecurityPolicy** ``` import { DNSSecurityPolicy } from "diagrams-js/azure/networking"; ``` ![DNSZones](/resources/azure/networking/dns-zones.png) **DNSZones** ``` import { DNSZones } from "diagrams-js/azure/networking"; ``` ![ExpressrouteCircuits](/resources/azure/networking/expressroute-circuits.png) **ExpressrouteCircuits** ``` import { ExpressrouteCircuits } from "diagrams-js/azure/networking"; ``` ![Firewalls](/resources/azure/networking/firewalls.png) **Firewalls** ``` import { Firewalls } from "diagrams-js/azure/networking"; ``` ![FrontDoorAndCDNProfiles](/resources/azure/networking/front-door-and-cdn-profiles.png) **FrontDoorAndCDNProfiles** ``` import { FrontDoorAndCDNProfiles } from "diagrams-js/azure/networking"; ``` ![IpAddressManager](/resources/azure/networking/ip-address-manager.png) **IpAddressManager** ``` import { IpAddressManager } from "diagrams-js/azure/networking"; ``` ![IpGroups](/resources/azure/networking/ip-groups.png) **IpGroups** ``` import { IpGroups } from "diagrams-js/azure/networking"; ``` ![LoadBalancerHub](/resources/azure/networking/load-balancer-hub.png) **LoadBalancerHub** ``` import { LoadBalancerHub } from "diagrams-js/azure/networking"; ``` ![LoadBalancers](/resources/azure/networking/load-balancers.png) **LoadBalancers** ``` import { LoadBalancers } from "diagrams-js/azure/networking"; ``` ![LocalNetworkGateways](/resources/azure/networking/local-network-gateways.png) **LocalNetworkGateways** ``` import { LocalNetworkGateways } from "diagrams-js/azure/networking"; ``` ![Nat](/resources/azure/networking/nat.png) **Nat** ``` import { Nat } from "diagrams-js/azure/networking"; ``` ![NetworkInterfaces](/resources/azure/networking/network-interfaces.png) **NetworkInterfaces** ``` import { NetworkInterfaces } from "diagrams-js/azure/networking"; ``` ![NetworkSecurityGroups](/resources/azure/networking/network-security-groups.png) **NetworkSecurityGroups** ``` import { NetworkSecurityGroups } from "diagrams-js/azure/networking"; ``` ![NetworkWatcher](/resources/azure/networking/network-watcher.png) **NetworkWatcher** ``` import { NetworkWatcher } from "diagrams-js/azure/networking"; ``` ![OnPremisesDataGateways](/resources/azure/networking/on-premises-data-gateways.png) **OnPremisesDataGateways** ``` import { OnPremisesDataGateways } from "diagrams-js/azure/networking"; ``` ![PrivateLinkService](/resources/azure/networking/private-link-service.png) **PrivateLinkService** ``` import { PrivateLinkService } from "diagrams-js/azure/networking"; ``` ![PrivateLinkServices](/resources/azure/networking/private-link-services.png) **PrivateLinkServices** ``` import { PrivateLinkServices } from "diagrams-js/azure/networking"; ``` ![PrivateLink](/resources/azure/networking/private-link.png) **PrivateLink** ``` import { PrivateLink } from "diagrams-js/azure/networking"; ``` ![ProximityPlacementGroups](/resources/azure/networking/proximity-placement-groups.png) **ProximityPlacementGroups** ``` import { ProximityPlacementGroups } from "diagrams-js/azure/networking"; ``` ![PublicIpAddressesClassic](/resources/azure/networking/public-ip-addresses-classic.png) **PublicIpAddressesClassic** ``` import { PublicIpAddressesClassic } from "diagrams-js/azure/networking"; ``` ![PublicIpAddresses](/resources/azure/networking/public-ip-addresses.png) **PublicIpAddresses** ``` import { PublicIpAddresses } from "diagrams-js/azure/networking"; ``` ![PublicIpPrefixes](/resources/azure/networking/public-ip-prefixes.png) **PublicIpPrefixes** ``` import { PublicIpPrefixes } from "diagrams-js/azure/networking"; ``` ![ReservedIpAddressesClassic](/resources/azure/networking/reserved-ip-addresses-classic.png) **ReservedIpAddressesClassic** ``` import { ReservedIpAddressesClassic } from "diagrams-js/azure/networking"; ``` ![ResourceManagementPrivateLink](/resources/azure/networking/resource-management-private-link.png) **ResourceManagementPrivateLink** ``` import { ResourceManagementPrivateLink } from "diagrams-js/azure/networking"; ``` ![RouteFilters](/resources/azure/networking/route-filters.png) **RouteFilters** ``` import { RouteFilters } from "diagrams-js/azure/networking"; ``` ![RouteTables](/resources/azure/networking/route-tables.png) **RouteTables** ``` import { RouteTables } from "diagrams-js/azure/networking"; ``` ![ServiceEndpointPolicies](/resources/azure/networking/service-endpoint-policies.png) **ServiceEndpointPolicies** ``` import { ServiceEndpointPolicies } from "diagrams-js/azure/networking"; ``` ![SpotVM](/resources/azure/networking/spot-vm.png) **SpotVM** ``` import { SpotVM } from "diagrams-js/azure/networking"; ``` ![SpotVmss](/resources/azure/networking/spot-vmss.png) **SpotVmss** ``` import { SpotVmss } from "diagrams-js/azure/networking"; ``` ![Subnet](/resources/azure/networking/subnet.png) **Subnet** ``` import { Subnet } from "diagrams-js/azure/networking"; ``` ![TrafficController](/resources/azure/networking/traffic-controller.png) **TrafficController** ``` import { TrafficController } from "diagrams-js/azure/networking"; ``` ![TrafficManagerProfiles](/resources/azure/networking/traffic-manager-profiles.png) **TrafficManagerProfiles** ``` import { TrafficManagerProfiles } from "diagrams-js/azure/networking"; ``` ![VirtualNetworkGateways](/resources/azure/networking/virtual-network-gateways.png) **VirtualNetworkGateways** ``` import { VirtualNetworkGateways } from "diagrams-js/azure/networking"; ``` ![VirtualNetworksClassic](/resources/azure/networking/virtual-networks-classic.png) **VirtualNetworksClassic** ``` import { VirtualNetworksClassic } from "diagrams-js/azure/networking"; ``` ![VirtualNetworks](/resources/azure/networking/virtual-networks.png) **VirtualNetworks** ``` import { VirtualNetworks } from "diagrams-js/azure/networking"; ``` ![VirtualRouter](/resources/azure/networking/virtual-router.png) **VirtualRouter** ``` import { VirtualRouter } from "diagrams-js/azure/networking"; ``` ![VirtualWanHub](/resources/azure/networking/virtual-wan-hub.png) **VirtualWanHub** ``` import { VirtualWanHub } from "diagrams-js/azure/networking"; ``` ![VirtualWans](/resources/azure/networking/virtual-wans.png) **VirtualWans** ``` import { VirtualWans } from "diagrams-js/azure/networking"; ``` ![WebApplicationFirewallPolicieswaf](/resources/azure/networking/web-application-firewall-policieswaf.png) **WebApplicationFirewallPolicieswaf** ``` import { WebApplicationFirewallPolicieswaf } from "diagrams-js/azure/networking"; ``` ### azure/newicons[​](#azurenewicons "Direct link to azure/newicons") ![AzureSustainability](/resources/azure/newicons/azure-sustainability.png) **AzureSustainability** ``` import { AzureSustainability } from "diagrams-js/azure/newicons"; ``` ![ConnectedVehiclePlatform](/resources/azure/newicons/connected-vehicle-platform.png) **ConnectedVehiclePlatform** ``` import { ConnectedVehiclePlatform } from "diagrams-js/azure/newicons"; ``` ![EntraConnectHealth](/resources/azure/newicons/entra-connect-health.png) **EntraConnectHealth** ``` import { EntraConnectHealth } from "diagrams-js/azure/newicons"; ``` ![EntraConnectSync](/resources/azure/newicons/entra-connect-sync.png) **EntraConnectSync** ``` import { EntraConnectSync } from "diagrams-js/azure/newicons"; ``` ![IcmTroubleshooting](/resources/azure/newicons/icm-troubleshooting.png) **IcmTroubleshooting** ``` import { IcmTroubleshooting } from "diagrams-js/azure/newicons"; ``` ![Osconfig](/resources/azure/newicons/osconfig.png) **Osconfig** ``` import { Osconfig } from "diagrams-js/azure/newicons"; ``` ![StorageActions](/resources/azure/newicons/storage-actions.png) **StorageActions** ``` import { StorageActions } from "diagrams-js/azure/newicons"; ``` ### azure/other[​](#azureother "Direct link to azure/other") ![AadLicenses](/resources/azure/other/aad-licenses.png) **AadLicenses** ``` import { AadLicenses } from "diagrams-js/azure/other"; ``` ![AksIstio](/resources/azure/other/aks-istio.png) **AksIstio** ``` import { AksIstio } from "diagrams-js/azure/other"; ``` ![AppComplianceAutomation](/resources/azure/other/app-compliance-automation.png) **AppComplianceAutomation** ``` import { AppComplianceAutomation } from "diagrams-js/azure/other"; ``` ![AppRegistrations](/resources/azure/other/app-registrations.png) **AppRegistrations** ``` import { AppRegistrations } from "diagrams-js/azure/other"; ``` ![Aquila](/resources/azure/other/aquila.png) **Aquila** ``` import { Aquila } from "diagrams-js/azure/other"; ``` ![ArcDataServices](/resources/azure/other/arc-data-services.png) **ArcDataServices** ``` import { ArcDataServices } from "diagrams-js/azure/other"; ``` ![ArcKubernetes](/resources/azure/other/arc-kubernetes.png) **ArcKubernetes** ``` import { ArcKubernetes } from "diagrams-js/azure/other"; ``` ![ArcPostgresql](/resources/azure/other/arc-postgresql-.png) **ArcPostgresql** ``` import { ArcPostgresql } from "diagrams-js/azure/other"; ``` ![ArcSQLManagedInstance](/resources/azure/other/arc-sql-managed-instance.png) **ArcSQLManagedInstance** ``` import { ArcSQLManagedInstance } from "diagrams-js/azure/other"; ``` ![ArcSQLServer](/resources/azure/other/arc-sql-server.png) **ArcSQLServer** ``` import { ArcSQLServer } from "diagrams-js/azure/other"; ``` ![AvsVM](/resources/azure/other/avs-vm.png) **AvsVM** ``` import { AvsVM } from "diagrams-js/azure/other"; ``` ![AzureA](/resources/azure/other/azure-a.png) **AzureA** ``` import { AzureA } from "diagrams-js/azure/other"; ``` ![AzureBackupCenter](/resources/azure/other/azure-backup-center.png) **AzureBackupCenter** ``` import { AzureBackupCenter } from "diagrams-js/azure/other"; ``` ![AzureCenterForSAP](/resources/azure/other/azure-center-for-sap.png) **AzureCenterForSAP** ``` import { AzureCenterForSAP } from "diagrams-js/azure/other"; ``` ![AzureChaosStudio](/resources/azure/other/azure-chaos-studio.png) **AzureChaosStudio** ``` import { AzureChaosStudio } from "diagrams-js/azure/other"; ``` ![AzureCloudShell](/resources/azure/other/azure-cloud-shell.png) **AzureCloudShell** ``` import { AzureCloudShell } from "diagrams-js/azure/other"; ``` ![AzureCommunicationServices](/resources/azure/other/azure-communication-services.png) **AzureCommunicationServices** ``` import { AzureCommunicationServices } from "diagrams-js/azure/other"; ``` ![AzureComputeGalleries](/resources/azure/other/azure-compute-galleries.png) **AzureComputeGalleries** ``` import { AzureComputeGalleries } from "diagrams-js/azure/other"; ``` ![AzureDeploymentEnvironments](/resources/azure/other/azure-deployment-environments.png) **AzureDeploymentEnvironments** ``` import { AzureDeploymentEnvironments } from "diagrams-js/azure/other"; ``` ![AzureDevTunnels](/resources/azure/other/azure-dev-tunnels.png) **AzureDevTunnels** ``` import { AzureDevTunnels } from "diagrams-js/azure/other"; ``` ![AzureEdgeHardwareCenter](/resources/azure/other/azure-edge-hardware-center.png) **AzureEdgeHardwareCenter** ``` import { AzureEdgeHardwareCenter } from "diagrams-js/azure/other"; ``` ![AzureHpcWorkbenches](/resources/azure/other/azure-hpc-workbenches.png) **AzureHpcWorkbenches** ``` import { AzureHpcWorkbenches } from "diagrams-js/azure/other"; ``` ![AzureLoadTesting](/resources/azure/other/azure-load-testing.png) **AzureLoadTesting** ``` import { AzureLoadTesting } from "diagrams-js/azure/other"; ``` ![AzureManagedGrafana](/resources/azure/other/azure-managed-grafana.png) **AzureManagedGrafana** ``` import { AzureManagedGrafana } from "diagrams-js/azure/other"; ``` ![AzureMonitorDashboard](/resources/azure/other/azure-monitor-dashboard.png) **AzureMonitorDashboard** ``` import { AzureMonitorDashboard } from "diagrams-js/azure/other"; ``` ![AzureNetworkFunctionManagerFunctions](/resources/azure/other/azure-network-function-manager-functions.png) **AzureNetworkFunctionManagerFunctions** ``` import { AzureNetworkFunctionManagerFunctions } from "diagrams-js/azure/other"; ``` ![AzureNetworkFunctionManager](/resources/azure/other/azure-network-function-manager.png) **AzureNetworkFunctionManager** ``` import { AzureNetworkFunctionManager } from "diagrams-js/azure/other"; ``` ![AzureOrbital](/resources/azure/other/azure-orbital.png) **AzureOrbital** ``` import { AzureOrbital } from "diagrams-js/azure/other"; ``` ![AzureQuotas](/resources/azure/other/azure-quotas.png) **AzureQuotas** ``` import { AzureQuotas } from "diagrams-js/azure/other"; ``` ![AzureSphere](/resources/azure/other/azure-sphere.png) **AzureSphere** ``` import { AzureSphere } from "diagrams-js/azure/other"; ``` ![AzureStorageMover](/resources/azure/other/azure-storage-mover.png) **AzureStorageMover** ``` import { AzureStorageMover } from "diagrams-js/azure/other"; ``` ![AzureSupportCenterBlue](/resources/azure/other/azure-support-center-blue.png) **AzureSupportCenterBlue** ``` import { AzureSupportCenterBlue } from "diagrams-js/azure/other"; ``` ![AzureVideoIndexer](/resources/azure/other/azure-video-indexer.png) **AzureVideoIndexer** ``` import { AzureVideoIndexer } from "diagrams-js/azure/other"; ``` ![AzureVirtualDesktop](/resources/azure/other/azure-virtual-desktop.png) **AzureVirtualDesktop** ``` import { AzureVirtualDesktop } from "diagrams-js/azure/other"; ``` ![AzureVmwareSolution](/resources/azure/other/azure-vmware-solution.png) **AzureVmwareSolution** ``` import { AzureVmwareSolution } from "diagrams-js/azure/other"; ``` ![Azureattestation](/resources/azure/other/azureattestation.png) **Azureattestation** ``` import { Azureattestation } from "diagrams-js/azure/other"; ``` ![Azurite](/resources/azure/other/azurite.png) **Azurite** ``` import { Azurite } from "diagrams-js/azure/other"; ``` ![BackupVault](/resources/azure/other/backup-vault.png) **BackupVault** ``` import { BackupVault } from "diagrams-js/azure/other"; ``` ![BareMetalInfrastructure](/resources/azure/other/bare-metal-infrastructure.png) **BareMetalInfrastructure** ``` import { BareMetalInfrastructure } from "diagrams-js/azure/other"; ``` ![CapacityReservationGroups](/resources/azure/other/capacity-reservation-groups.png) **CapacityReservationGroups** ``` import { CapacityReservationGroups } from "diagrams-js/azure/other"; ``` ![CentralServiceInstanceForSAP](/resources/azure/other/central-service-instance-for-sap.png) **CentralServiceInstanceForSAP** ``` import { CentralServiceInstanceForSAP } from "diagrams-js/azure/other"; ``` ![Ceres](/resources/azure/other/ceres.png) **Ceres** ``` import { Ceres } from "diagrams-js/azure/other"; ``` ![CloudServicesExtendedSupport](/resources/azure/other/cloud-services-extended-support.png) **CloudServicesExtendedSupport** ``` import { CloudServicesExtendedSupport } from "diagrams-js/azure/other"; ``` ![CommunityImages](/resources/azure/other/community-images.png) **CommunityImages** ``` import { CommunityImages } from "diagrams-js/azure/other"; ``` ![ComplianceCenter](/resources/azure/other/compliance-center.png) **ComplianceCenter** ``` import { ComplianceCenter } from "diagrams-js/azure/other"; ``` ![ConfidentialLedgers](/resources/azure/other/confidential-ledgers.png) **ConfidentialLedgers** ``` import { ConfidentialLedgers } from "diagrams-js/azure/other"; ``` ![ContainerAppsEnvironments](/resources/azure/other/container-apps-environments.png) **ContainerAppsEnvironments** ``` import { ContainerAppsEnvironments } from "diagrams-js/azure/other"; ``` ![CostExport](/resources/azure/other/cost-export.png) **CostExport** ``` import { CostExport } from "diagrams-js/azure/other"; ``` ![CustomIpPrefix](/resources/azure/other/custom-ip-prefix.png) **CustomIpPrefix** ``` import { CustomIpPrefix } from "diagrams-js/azure/other"; ``` ![DashboardHub](/resources/azure/other/dashboard-hub.png) **DashboardHub** ``` import { DashboardHub } from "diagrams-js/azure/other"; ``` ![DataCollectionRules](/resources/azure/other/data-collection-rules.png) **DataCollectionRules** ``` import { DataCollectionRules } from "diagrams-js/azure/other"; ``` ![DatabaseInstanceForSAP](/resources/azure/other/database-instance-for-sap.png) **DatabaseInstanceForSAP** ``` import { DatabaseInstanceForSAP } from "diagrams-js/azure/other"; ``` ![DedicatedHsm](/resources/azure/other/dedicated-hsm.png) **DedicatedHsm** ``` import { DedicatedHsm } from "diagrams-js/azure/other"; ``` ![DefenderCmLocalManager](/resources/azure/other/defender-cm-local-manager.png) **DefenderCmLocalManager** ``` import { DefenderCmLocalManager } from "diagrams-js/azure/other"; ``` ![DefenderDcsController](/resources/azure/other/defender-dcs-controller.png) **DefenderDcsController** ``` import { DefenderDcsController } from "diagrams-js/azure/other"; ``` ![DefenderDistributerControlSystem](/resources/azure/other/defender-distributer-control-system.png) **DefenderDistributerControlSystem** ``` import { DefenderDistributerControlSystem } from "diagrams-js/azure/other"; ``` ![DefenderEngineeringStation](/resources/azure/other/defender-engineering-station.png) **DefenderEngineeringStation** ``` import { DefenderEngineeringStation } from "diagrams-js/azure/other"; ``` ![DefenderExternalManagement](/resources/azure/other/defender-external-management.png) **DefenderExternalManagement** ``` import { DefenderExternalManagement } from "diagrams-js/azure/other"; ``` ![DefenderFreezerMonitor](/resources/azure/other/defender-freezer-monitor.png) **DefenderFreezerMonitor** ``` import { DefenderFreezerMonitor } from "diagrams-js/azure/other"; ``` ![DefenderHistorian](/resources/azure/other/defender-historian.png) **DefenderHistorian** ``` import { DefenderHistorian } from "diagrams-js/azure/other"; ``` ![DefenderHmi](/resources/azure/other/defender-hmi.png) **DefenderHmi** ``` import { DefenderHmi } from "diagrams-js/azure/other"; ``` ![DefenderIndustrialPackagingSystem](/resources/azure/other/defender-industrial-packaging-system.png) **DefenderIndustrialPackagingSystem** ``` import { DefenderIndustrialPackagingSystem } from "diagrams-js/azure/other"; ``` ![DefenderIndustrialPrinter](/resources/azure/other/defender-industrial-printer.png) **DefenderIndustrialPrinter** ``` import { DefenderIndustrialPrinter } from "diagrams-js/azure/other"; ``` ![DefenderIndustrialRobot](/resources/azure/other/defender-industrial-robot.png) **DefenderIndustrialRobot** ``` import { DefenderIndustrialRobot } from "diagrams-js/azure/other"; ``` ![DefenderIndustrialScaleSystem](/resources/azure/other/defender-industrial-scale-system.png) **DefenderIndustrialScaleSystem** ``` import { DefenderIndustrialScaleSystem } from "diagrams-js/azure/other"; ``` ![DefenderMarquee](/resources/azure/other/defender-marquee.png) **DefenderMarquee** ``` import { DefenderMarquee } from "diagrams-js/azure/other"; ``` ![DefenderMeter](/resources/azure/other/defender-meter.png) **DefenderMeter** ``` import { DefenderMeter } from "diagrams-js/azure/other"; ``` ![DefenderPlc](/resources/azure/other/defender-plc.png) **DefenderPlc** ``` import { DefenderPlc } from "diagrams-js/azure/other"; ``` ![DefenderPneumaticDevice](/resources/azure/other/defender-pneumatic-device.png) **DefenderPneumaticDevice** ``` import { DefenderPneumaticDevice } from "diagrams-js/azure/other"; ``` ![DefenderProgramableBoard](/resources/azure/other/defender-programable-board.png) **DefenderProgramableBoard** ``` import { DefenderProgramableBoard } from "diagrams-js/azure/other"; ``` ![DefenderRelay](/resources/azure/other/defender-relay.png) **DefenderRelay** ``` import { DefenderRelay } from "diagrams-js/azure/other"; ``` ![DefenderRobotController](/resources/azure/other/defender-robot-controller.png) **DefenderRobotController** ``` import { DefenderRobotController } from "diagrams-js/azure/other"; ``` ![DefenderRtu](/resources/azure/other/defender-rtu.png) **DefenderRtu** ``` import { DefenderRtu } from "diagrams-js/azure/other"; ``` ![DefenderSensor](/resources/azure/other/defender-sensor.png) **DefenderSensor** ``` import { DefenderSensor } from "diagrams-js/azure/other"; ``` ![DefenderSlot](/resources/azure/other/defender-slot.png) **DefenderSlot** ``` import { DefenderSlot } from "diagrams-js/azure/other"; ``` ![DefenderWebGuidingSystem](/resources/azure/other/defender-web-guiding-system.png) **DefenderWebGuidingSystem** ``` import { DefenderWebGuidingSystem } from "diagrams-js/azure/other"; ``` ![DeviceUpdateIotHub](/resources/azure/other/device-update-iot-hub.png) **DeviceUpdateIotHub** ``` import { DeviceUpdateIotHub } from "diagrams-js/azure/other"; ``` ![DiskPool](/resources/azure/other/disk-pool.png) **DiskPool** ``` import { DiskPool } from "diagrams-js/azure/other"; ``` ![EdgeManagement](/resources/azure/other/edge-management.png) **EdgeManagement** ``` import { EdgeManagement } from "diagrams-js/azure/other"; ``` ![ElasticSan](/resources/azure/other/elastic-san.png) **ElasticSan** ``` import { ElasticSan } from "diagrams-js/azure/other"; ``` ![ExchangeOnPremisesAccess](/resources/azure/other/exchange-on-premises-access.png) **ExchangeOnPremisesAccess** ``` import { ExchangeOnPremisesAccess } from "diagrams-js/azure/other"; ``` ![ExpressRouteTrafficCollector](/resources/azure/other/express-route-traffic-collector.png) **ExpressRouteTrafficCollector** ``` import { ExpressRouteTrafficCollector } from "diagrams-js/azure/other"; ``` ![ExpressrouteDirect](/resources/azure/other/expressroute-direct.png) **ExpressrouteDirect** ``` import { ExpressrouteDirect } from "diagrams-js/azure/other"; ``` ![FhirService](/resources/azure/other/fhir-service.png) **FhirService** ``` import { FhirService } from "diagrams-js/azure/other"; ``` ![Fiji](/resources/azure/other/fiji.png) **Fiji** ``` import { Fiji } from "diagrams-js/azure/other"; ``` ![HdiAksCluster](/resources/azure/other/hdi-aks-cluster.png) **HdiAksCluster** ``` import { HdiAksCluster } from "diagrams-js/azure/other"; ``` ![InstancePools](/resources/azure/other/instance-pools.png) **InstancePools** ``` import { InstancePools } from "diagrams-js/azure/other"; ``` ![InternetAnalyzerProfiles](/resources/azure/other/internet-analyzer-profiles.png) **InternetAnalyzerProfiles** ``` import { InternetAnalyzerProfiles } from "diagrams-js/azure/other"; ``` ![KubernetesFleetManager](/resources/azure/other/kubernetes-fleet-manager.png) **KubernetesFleetManager** ``` import { KubernetesFleetManager } from "diagrams-js/azure/other"; ``` ![LocalNetworkGateways](/resources/azure/other/local-network-gateways.png) **LocalNetworkGateways** ``` import { LocalNetworkGateways } from "diagrams-js/azure/other"; ``` ![LogAnalyticsQueryPack](/resources/azure/other/log-analytics-query-pack.png) **LogAnalyticsQueryPack** ``` import { LogAnalyticsQueryPack } from "diagrams-js/azure/other"; ``` ![ManagedInstanceApacheCassandra](/resources/azure/other/managed-instance-apache-cassandra.png) **ManagedInstanceApacheCassandra** ``` import { ManagedInstanceApacheCassandra } from "diagrams-js/azure/other"; ``` ![MedtechService](/resources/azure/other/medtech-service.png) **MedtechService** ``` import { MedtechService } from "diagrams-js/azure/other"; ``` ![MicrosoftDevBox](/resources/azure/other/microsoft-dev-box.png) **MicrosoftDevBox** ``` import { MicrosoftDevBox } from "diagrams-js/azure/other"; ``` ![MissionLandingZone](/resources/azure/other/mission-landing-zone.png) **MissionLandingZone** ``` import { MissionLandingZone } from "diagrams-js/azure/other"; ``` ![MobileNetworks](/resources/azure/other/mobile-networks.png) **MobileNetworks** ``` import { MobileNetworks } from "diagrams-js/azure/other"; ``` ![ModularDataCenter](/resources/azure/other/modular-data-center.png) **ModularDataCenter** ``` import { ModularDataCenter } from "diagrams-js/azure/other"; ``` ![NetworkManagers](/resources/azure/other/network-managers.png) **NetworkManagers** ``` import { NetworkManagers } from "diagrams-js/azure/other"; ``` ![NetworkSecurityPerimeters](/resources/azure/other/network-security-perimeters.png) **NetworkSecurityPerimeters** ``` import { NetworkSecurityPerimeters } from "diagrams-js/azure/other"; ``` ![OpenSupplyChainPlatform](/resources/azure/other/open-supply-chain-platform.png) **OpenSupplyChainPlatform** ``` import { OpenSupplyChainPlatform } from "diagrams-js/azure/other"; ``` ![PeeringService](/resources/azure/other/peering-service.png) **PeeringService** ``` import { PeeringService } from "diagrams-js/azure/other"; ``` ![Peerings](/resources/azure/other/peerings.png) **Peerings** ``` import { Peerings } from "diagrams-js/azure/other"; ``` ![PrivateEndpoints](/resources/azure/other/private-endpoints.png) **PrivateEndpoints** ``` import { PrivateEndpoints } from "diagrams-js/azure/other"; ``` ![ReservedCapacity](/resources/azure/other/reserved-capacity.png) **ReservedCapacity** ``` import { ReservedCapacity } from "diagrams-js/azure/other"; ``` ![ResourceGuard](/resources/azure/other/resource-guard.png) **ResourceGuard** ``` import { ResourceGuard } from "diagrams-js/azure/other"; ``` ![ResourceMover](/resources/azure/other/resource-mover.png) **ResourceMover** ``` import { ResourceMover } from "diagrams-js/azure/other"; ``` ![Rtos](/resources/azure/other/rtos.png) **Rtos** ``` import { Rtos } from "diagrams-js/azure/other"; ``` ![SavingsPlans](/resources/azure/other/savings-plans.png) **SavingsPlans** ``` import { SavingsPlans } from "diagrams-js/azure/other"; ``` ![ScvmmManagementServers](/resources/azure/other/scvmm-management-servers.png) **ScvmmManagementServers** ``` import { ScvmmManagementServers } from "diagrams-js/azure/other"; ``` ![SonicDash](/resources/azure/other/sonic-dash.png) **SonicDash** ``` import { SonicDash } from "diagrams-js/azure/other"; ``` ![SshKeys](/resources/azure/other/ssh-keys.png) **SshKeys** ``` import { SshKeys } from "diagrams-js/azure/other"; ``` ![StorageFunctions](/resources/azure/other/storage-functions.png) **StorageFunctions** ``` import { StorageFunctions } from "diagrams-js/azure/other"; ``` ![TargetsManagement](/resources/azure/other/targets-management.png) **TargetsManagement** ``` import { TargetsManagement } from "diagrams-js/azure/other"; ``` ![TemplateSpecs](/resources/azure/other/template-specs.png) **TemplateSpecs** ``` import { TemplateSpecs } from "diagrams-js/azure/other"; ``` ![TestBase](/resources/azure/other/test-base.png) **TestBase** ``` import { TestBase } from "diagrams-js/azure/other"; ``` ![UpdateManagementCenter](/resources/azure/other/update-management-center.png) **UpdateManagementCenter** ``` import { UpdateManagementCenter } from "diagrams-js/azure/other"; ``` ![VideoAnalyzers](/resources/azure/other/video-analyzers.png) **VideoAnalyzers** ``` import { VideoAnalyzers } from "diagrams-js/azure/other"; ``` ![VirtualEnclaves](/resources/azure/other/virtual-enclaves.png) **VirtualEnclaves** ``` import { VirtualEnclaves } from "diagrams-js/azure/other"; ``` ![VirtualInstanceForSAP](/resources/azure/other/virtual-instance-for-sap.png) **VirtualInstanceForSAP** ``` import { VirtualInstanceForSAP } from "diagrams-js/azure/other"; ``` ![VirtualVisitsBuilder](/resources/azure/other/virtual-visits-builder.png) **VirtualVisitsBuilder** ``` import { VirtualVisitsBuilder } from "diagrams-js/azure/other"; ``` ![VMAppDefinitions](/resources/azure/other/vm-app-definitions.png) **VMAppDefinitions** ``` import { VMAppDefinitions } from "diagrams-js/azure/other"; ``` ![VMAppVersions](/resources/azure/other/vm-app-versions.png) **VMAppVersions** ``` import { VMAppVersions } from "diagrams-js/azure/other"; ``` ![VMImageVersion](/resources/azure/other/vm-image-version.png) **VMImageVersion** ``` import { VMImageVersion } from "diagrams-js/azure/other"; ``` ![Wac](/resources/azure/other/wac.png) **Wac** ``` import { Wac } from "diagrams-js/azure/other"; ``` ![WebAppDatabase](/resources/azure/other/web-app-database.png) **WebAppDatabase** ``` import { WebAppDatabase } from "diagrams-js/azure/other"; ``` ![WebJobs](/resources/azure/other/web-jobs.png) **WebJobs** ``` import { WebJobs } from "diagrams-js/azure/other"; ``` ![WindowsNotificationServices](/resources/azure/other/windows-notification-services.png) **WindowsNotificationServices** ``` import { WindowsNotificationServices } from "diagrams-js/azure/other"; ``` ![WorkerContainerApp](/resources/azure/other/worker-container-app.png) **WorkerContainerApp** ``` import { WorkerContainerApp } from "diagrams-js/azure/other"; ``` ### azure/security[​](#azuresecurity "Direct link to azure/security") ![ApplicationSecurityGroups](/resources/azure/security/application-security-groups.png) **ApplicationSecurityGroups** ``` import { ApplicationSecurityGroups } from "diagrams-js/azure/security"; ``` ![AzureADAuthenticationMethods](/resources/azure/security/azure-ad-authentication-methods.png) **AzureADAuthenticationMethods** ``` import { AzureADAuthenticationMethods } from "diagrams-js/azure/security"; ``` ![AzureADIdentityProtection](/resources/azure/security/azure-ad-identity-protection.png) **AzureADIdentityProtection** ``` import { AzureADIdentityProtection } from "diagrams-js/azure/security"; ``` ![AzureADPrivlegedIdentityManagement](/resources/azure/security/azure-ad-privleged-identity-management.png) **AzureADPrivlegedIdentityManagement** ``` import { AzureADPrivlegedIdentityManagement } from "diagrams-js/azure/security"; ``` ![AzureADRiskySignins](/resources/azure/security/azure-ad-risky-signins.png) **AzureADRiskySignins** ``` import { AzureADRiskySignins } from "diagrams-js/azure/security"; ``` ![AzureADRiskyUsers](/resources/azure/security/azure-ad-risky-users.png) **AzureADRiskyUsers** ``` import { AzureADRiskyUsers } from "diagrams-js/azure/security"; ``` ![AzureInformationProtection](/resources/azure/security/azure-information-protection.png) **AzureInformationProtection** ``` import { AzureInformationProtection } from "diagrams-js/azure/security"; ``` ![AzureSentinel](/resources/azure/security/azure-sentinel.png) **AzureSentinel** ``` import { AzureSentinel } from "diagrams-js/azure/security"; ``` ![ConditionalAccess](/resources/azure/security/conditional-access.png) **ConditionalAccess** ``` import { ConditionalAccess } from "diagrams-js/azure/security"; ``` ![Defender](/resources/azure/security/defender.png) **Defender** ``` import { Defender } from "diagrams-js/azure/security"; ``` ![Detonation](/resources/azure/security/detonation.png) **Detonation** ``` import { Detonation } from "diagrams-js/azure/security"; ``` ![ExtendedSecurityUpdates](/resources/azure/security/extended-security-updates.png) **ExtendedSecurityUpdates** ``` import { ExtendedSecurityUpdates } from "diagrams-js/azure/security"; ``` ![Extendedsecurityupdates](/resources/azure/security/extendedsecurityupdates.png) **Extendedsecurityupdates** ``` import { Extendedsecurityupdates } from "diagrams-js/azure/security"; ``` ![IdentitySecureScore](/resources/azure/security/identity-secure-score.png) **IdentitySecureScore** ``` import { IdentitySecureScore } from "diagrams-js/azure/security"; ``` ![KeyVaults](/resources/azure/security/key-vaults.png) **KeyVaults** ``` import { KeyVaults } from "diagrams-js/azure/security"; ``` ![MicrosoftDefenderEasm](/resources/azure/security/microsoft-defender-easm.png) **MicrosoftDefenderEasm** ``` import { MicrosoftDefenderEasm } from "diagrams-js/azure/security"; ``` ![MicrosoftDefenderForCloud](/resources/azure/security/microsoft-defender-for-cloud.png) **MicrosoftDefenderForCloud** ``` import { MicrosoftDefenderForCloud } from "diagrams-js/azure/security"; ``` ![MicrosoftDefenderForIot](/resources/azure/security/microsoft-defender-for-iot.png) **MicrosoftDefenderForIot** ``` import { MicrosoftDefenderForIot } from "diagrams-js/azure/security"; ``` ![MultifactorAuthentication](/resources/azure/security/multifactor-authentication.png) **MultifactorAuthentication** ``` import { MultifactorAuthentication } from "diagrams-js/azure/security"; ``` ![SecurityCenter](/resources/azure/security/security-center.png) **SecurityCenter** ``` import { SecurityCenter } from "diagrams-js/azure/security"; ``` ![Sentinel](/resources/azure/security/sentinel.png) **Sentinel** ``` import { Sentinel } from "diagrams-js/azure/security"; ``` ![UserSettings](/resources/azure/security/user-settings.png) **UserSettings** ``` import { UserSettings } from "diagrams-js/azure/security"; ``` ### azure/storage[​](#azurestorage "Direct link to azure/storage") ![ArchiveStorage](/resources/azure/storage/archive-storage.png) **ArchiveStorage** ``` import { ArchiveStorage } from "diagrams-js/azure/storage"; ``` ![AzureDataboxGateway](/resources/azure/storage/azure-databox-gateway.png) **AzureDataboxGateway** ``` import { AzureDataboxGateway } from "diagrams-js/azure/storage"; ``` ![AzureFileshares](/resources/azure/storage/azure-fileshares.png) **AzureFileshares** ``` import { AzureFileshares } from "diagrams-js/azure/storage"; ``` ![AzureHcpCache](/resources/azure/storage/azure-hcp-cache.png) **AzureHcpCache** ``` import { AzureHcpCache } from "diagrams-js/azure/storage"; ``` ![AzureNetappFiles](/resources/azure/storage/azure-netapp-files.png) **AzureNetappFiles** ``` import { AzureNetappFiles } from "diagrams-js/azure/storage"; ``` ![AzureStackEdge](/resources/azure/storage/azure-stack-edge.png) **AzureStackEdge** ``` import { AzureStackEdge } from "diagrams-js/azure/storage"; ``` ![Azurefxtedgefiler](/resources/azure/storage/azurefxtedgefiler.png) **Azurefxtedgefiler** ``` import { Azurefxtedgefiler } from "diagrams-js/azure/storage"; ``` ![BlobStorage](/resources/azure/storage/blob-storage.png) **BlobStorage** ``` import { BlobStorage } from "diagrams-js/azure/storage"; ``` ![DataBoxEdgeDataBoxGateway](/resources/azure/storage/data-box-edge-data-box-gateway.png) **DataBoxEdgeDataBoxGateway** ``` import { DataBoxEdgeDataBoxGateway } from "diagrams-js/azure/storage"; ``` ![DataBox](/resources/azure/storage/data-box.png) **DataBox** ``` import { DataBox } from "diagrams-js/azure/storage"; ``` ![DataLakeStorageGen1](/resources/azure/storage/data-lake-storage-gen1.png) **DataLakeStorageGen1** ``` import { DataLakeStorageGen1 } from "diagrams-js/azure/storage"; ``` ![DataLakeStorage](/resources/azure/storage/data-lake-storage.png) **DataLakeStorage** ``` import { DataLakeStorage } from "diagrams-js/azure/storage"; ``` ![DataShareInvitations](/resources/azure/storage/data-share-invitations.png) **DataShareInvitations** ``` import { DataShareInvitations } from "diagrams-js/azure/storage"; ``` ![DataShares](/resources/azure/storage/data-shares.png) **DataShares** ``` import { DataShares } from "diagrams-js/azure/storage"; ``` ![GeneralStorage](/resources/azure/storage/general-storage.png) **GeneralStorage** ``` import { GeneralStorage } from "diagrams-js/azure/storage"; ``` ![ImportExportJobs](/resources/azure/storage/import-export-jobs.png) **ImportExportJobs** ``` import { ImportExportJobs } from "diagrams-js/azure/storage"; ``` ![NetappFiles](/resources/azure/storage/netapp-files.png) **NetappFiles** ``` import { NetappFiles } from "diagrams-js/azure/storage"; ``` ![QueuesStorage](/resources/azure/storage/queues-storage.png) **QueuesStorage** ``` import { QueuesStorage } from "diagrams-js/azure/storage"; ``` ![RecoveryServicesVaults](/resources/azure/storage/recovery-services-vaults.png) **RecoveryServicesVaults** ``` import { RecoveryServicesVaults } from "diagrams-js/azure/storage"; ``` ![StorageAccountsClassic](/resources/azure/storage/storage-accounts-classic.png) **StorageAccountsClassic** ``` import { StorageAccountsClassic } from "diagrams-js/azure/storage"; ``` ![StorageAccounts](/resources/azure/storage/storage-accounts.png) **StorageAccounts** ``` import { StorageAccounts } from "diagrams-js/azure/storage"; ``` ![StorageExplorer](/resources/azure/storage/storage-explorer.png) **StorageExplorer** ``` import { StorageExplorer } from "diagrams-js/azure/storage"; ``` ![StorageSyncServices](/resources/azure/storage/storage-sync-services.png) **StorageSyncServices** ``` import { StorageSyncServices } from "diagrams-js/azure/storage"; ``` ![StorsimpleDataManagers](/resources/azure/storage/storsimple-data-managers.png) **StorsimpleDataManagers** ``` import { StorsimpleDataManagers } from "diagrams-js/azure/storage"; ``` ![StorsimpleDeviceManagers](/resources/azure/storage/storsimple-device-managers.png) **StorsimpleDeviceManagers** ``` import { StorsimpleDeviceManagers } from "diagrams-js/azure/storage"; ``` ![TableStorage](/resources/azure/storage/table-storage.png) **TableStorage** ``` import { TableStorage } from "diagrams-js/azure/storage"; ``` ### azure/web[​](#azureweb "Direct link to azure/web") ![APICenter](/resources/azure/web/api-center.png) **APICenter** ``` import { APICenter } from "diagrams-js/azure/web"; ``` ![APIConnections](/resources/azure/web/api-connections.png) **APIConnections** ``` import { APIConnections } from "diagrams-js/azure/web"; ``` ![APIManagementServices](/resources/azure/web/api-management-services.png) **APIManagementServices** ``` import { APIManagementServices } from "diagrams-js/azure/web"; ``` ![AppServiceCertificates](/resources/azure/web/app-service-certificates.png) **AppServiceCertificates** ``` import { AppServiceCertificates } from "diagrams-js/azure/web"; ``` ![AppServiceDomains](/resources/azure/web/app-service-domains.png) **AppServiceDomains** ``` import { AppServiceDomains } from "diagrams-js/azure/web"; ``` ![AppServiceEnvironments](/resources/azure/web/app-service-environments.png) **AppServiceEnvironments** ``` import { AppServiceEnvironments } from "diagrams-js/azure/web"; ``` ![AppServicePlans](/resources/azure/web/app-service-plans.png) **AppServicePlans** ``` import { AppServicePlans } from "diagrams-js/azure/web"; ``` ![AppServices](/resources/azure/web/app-services.png) **AppServices** ``` import { AppServices } from "diagrams-js/azure/web"; ``` ![AppSpace](/resources/azure/web/app-space.png) **AppSpace** ``` import { AppSpace } from "diagrams-js/azure/web"; ``` ![AzureMediaService](/resources/azure/web/azure-media-service.png) **AzureMediaService** ``` import { AzureMediaService } from "diagrams-js/azure/web"; ``` ![AzureSpringApps](/resources/azure/web/azure-spring-apps.png) **AzureSpringApps** ``` import { AzureSpringApps } from "diagrams-js/azure/web"; ``` ![CognitiveSearch](/resources/azure/web/cognitive-search.png) **CognitiveSearch** ``` import { CognitiveSearch } from "diagrams-js/azure/web"; ``` ![CognitiveServices](/resources/azure/web/cognitive-services.png) **CognitiveServices** ``` import { CognitiveServices } from "diagrams-js/azure/web"; ``` ![FrontDoorAndCDNProfiles](/resources/azure/web/front-door-and-cdn-profiles.png) **FrontDoorAndCDNProfiles** ``` import { FrontDoorAndCDNProfiles } from "diagrams-js/azure/web"; ``` ![MediaServices](/resources/azure/web/media-services.png) **MediaServices** ``` import { MediaServices } from "diagrams-js/azure/web"; ``` ![NotificationHubNamespaces](/resources/azure/web/notification-hub-namespaces.png) **NotificationHubNamespaces** ``` import { NotificationHubNamespaces } from "diagrams-js/azure/web"; ``` ![PowerPlatform](/resources/azure/web/power-platform.png) **PowerPlatform** ``` import { PowerPlatform } from "diagrams-js/azure/web"; ``` ![Search](/resources/azure/web/search.png) **Search** ``` import { Search } from "diagrams-js/azure/web"; ``` ![Signalr](/resources/azure/web/signalr.png) **Signalr** ``` import { Signalr } from "diagrams-js/azure/web"; ``` ![StaticApps](/resources/azure/web/static-apps.png) **StaticApps** ``` import { StaticApps } from "diagrams-js/azure/web"; ``` --- # C4 Model The C4 model is a simple way to visualize software architecture at different levels of detail. diagrams-js provides support for creating C4 diagrams including Context, Container, Component, and Code diagrams. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Person, Container, Database, System, Relationship, SystemBoundary } from "diagrams-js/c4"; const diagram = Diagram("Container Diagram", { direction: "TB" }); // External user const user = diagram.add(Person("User", "System user", true)); // System boundary containing internal containers const system = SystemBoundary("My Application", diagram); const webApp = system.add(Container("Web App", "React", "User interface")); const api = system.add(Container("API", "Node.js", "Business logic")); const db = system.add(Database("Database", "PostgreSQL", "Data storage")); // Relationships user.to(Relationship("Uses"), webApp); webApp.to(Relationship("Calls"), api); api.to(Relationship("Reads/Writes"), db); const svg = await diagram.render(); diagram.destroy(); ``` ## Node Reference[​](#node-reference "Direct link to Node Reference") ### Person[​](#person "Direct link to Person") Represents a person (user, actor, role, or persona). ``` import { Person } from "diagrams-js/c4"; // Internal person (blue) const user = diagram.add(Person("User", "Description")); // External person (gray) const externalUser = diagram.add(Person("External User", "Description", true)); ``` **Parameters:** * `name` - The name of the person * `description` - Optional description text * `external` - Whether this is an external person (default: false) * `options` - Additional Graphviz node attributes ### Container[​](#container "Direct link to Container") Represents a software container (applications, web apps, microservices, etc.). ``` import { Container } from "diagrams-js/c4"; const webApp = diagram.add(Container("Web App", "React", "User interface")); const api = diagram.add(Container("API", "Node.js")); ``` **Parameters:** * `name` - The name of the container * `technology` - Optional technology (e.g., "Java", "Node.js", "React") * `description` - Optional description text * `options` - Additional Graphviz node attributes ### Database[​](#database "Direct link to Database") Represents a data storage container (databases, file systems, etc.). ``` import { Database } from "diagrams-js/c4"; const db = diagram.add(Database("Main DB", "PostgreSQL", "Primary data store")); ``` **Parameters:** * `name` - The name of the database * `technology` - Optional technology (e.g., "PostgreSQL", "MongoDB") * `description` - Optional description text * `options` - Additional Graphviz node attributes ### System[​](#system "Direct link to System") Represents a software system. ``` import { System } from "diagrams-js/c4"; // Internal system (blue) const core = diagram.add(System("Core System", "Main business logic")); // External system (gray) const external = diagram.add(System("Payment Gateway", "External service", true)); ``` **Parameters:** * `name` - The name of the system * `description` - Optional description text * `external` - Whether this is an external system (default: false) * `options` - Additional Graphviz node attributes ### SystemBoundary[​](#systemboundary "Direct link to SystemBoundary") Creates a boundary (cluster) to group related containers or components. ``` import { SystemBoundary, Container } from "diagrams-js/c4"; const boundary = SystemBoundary("My System", diagram); const container = boundary.add(Container("Web App")); ``` **Parameters:** * `label` - The name/label of the boundary * `diagram` - The diagram instance * `options` - Additional Graphviz graph attributes ### Relationship[​](#relationship "Direct link to Relationship") Creates a relationship (edge) between C4 elements. ``` import { Relationship } from "diagrams-js/c4"; node1.to(Relationship("Uses"), node2); node1.to(Relationship(), node3); // Unlabeled relationship ``` **Parameters:** * `label` - Optional relationship label/description * `options` - Additional Graphviz edge attributes ## Styling[​](#styling "Direct link to Styling") C4 nodes use the following default styling: * **Internal elements** (Person, System, Container): Dodger blue (`dodgerblue4` for Person/System, `dodgerblue3` for Container) * **External elements**: Gray (`gray60`) * **Database**: Cylinder shape with bottom-aligned label * **Person**: Rounded rectangle * **Relationships**: Dashed lines in gray (`gray60`) * **System Boundaries**: Dashed borders with white background All elements support custom Graphviz attributes through the `options` parameter. ## Complete Example[​](#complete-example "Direct link to Complete Example") Here's a complete C4 Container diagram example: ``` import { Diagram } from "diagrams-js"; import { Person, Container, Database, System, Relationship, SystemBoundary } from "diagrams-js/c4"; const diagram = Diagram("Container diagram for Internet Banking System", { direction: "TB", curvestyle: "spline", }); const customer = diagram.add(Person("Personal Banking Customer", "A customer of the bank, with personal bank accounts.")); const bankingSystem = SystemBoundary("Internet Banking System", diagram); const webApp = bankingSystem.add(Container( "Web Application", "Java and Spring MVC", "Delivers the static content and the Internet banking single page application." )); const spa = bankingSystem.add(Container( "Single-Page Application", "Javascript and Angular", "Provides all of the Internet banking functionality to customers via their web browser." )); const mobile = bankingSystem.add(Container( "Mobile App", "Xamarin", "Provides a limited subset of the Internet banking functionality to customers via their mobile device." )); const api = bankingSystem.add(Container( "API Application", "Java and Spring MVC", "Provides Internet banking functionality via a JSON/HTTPS API." )); const db = bankingSystem.add(Database( "Database", "Oracle Database Schema", "Stores user registration information, hashed authentication credentials, access logs, etc." )); const email = diagram.add(System( "E-mail System", "The internal Microsoft Exchange e-mail system.", true )); const mainframe = diagram.add(System( "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.", true )); customer.to(Relationship("Visits bigbank.com/ib using [HTTPS]"), webApp); customer.to(Relationship("Views account balances, and makes payments using"), [spa, mobile]); webApp.to(Relationship("Delivers to the customer's web browser"), spa); spa.to(Relationship("Make API calls to [JSON/HTTPS]"), api); mobile.to(Relationship("Make API calls to [JSON/HTTPS]"), api); api.to(Relationship("reads from and writes to"), db); api.to(Relationship("Sends email using [SMTP]"), email); api.to(Relationship("Makes API calls to [XML/HTTPS]"), mainframe); customer.from(Relationship("Sends e-mails to"), email); const svg = await diagram.render(); diagram.destroy(); ``` --- # DigitalOcean Node classes list for the DigitalOcean provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Containers, Docker, DropletConnect } from "diagrams-js/digitalocean/compute"; import { DbaasPrimaryStandbyMore, DbaasPrimary, DbaasReadOnly, } from "diagrams-js/digitalocean/database"; const diagram = Diagram("DigitalOcean Architecture", { direction: "TB" }); const node1 = diagram.add(Containers("Node 1")); const node2 = diagram.add(DbaasPrimaryStandbyMore("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/digitalocean) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### digitalocean/compute[​](#digitaloceancompute "Direct link to digitalocean/compute") ![Containers](/resources/digitalocean/compute/containers.png) **Containers** ``` import { Containers } from "diagrams-js/digitalocean/compute"; ``` ![Docker](/resources/digitalocean/compute/docker.png) **Docker** ``` import { Docker } from "diagrams-js/digitalocean/compute"; ``` ![DropletConnect](/resources/digitalocean/compute/droplet-connect.png) **DropletConnect** ``` import { DropletConnect } from "diagrams-js/digitalocean/compute"; ``` ![DropletSnapshot](/resources/digitalocean/compute/droplet-snapshot.png) **DropletSnapshot** ``` import { DropletSnapshot } from "diagrams-js/digitalocean/compute"; ``` ![Droplet](/resources/digitalocean/compute/droplet.png) **Droplet** ``` import { Droplet } from "diagrams-js/digitalocean/compute"; ``` ![K8sCluster](/resources/digitalocean/compute/k8s-cluster.png) **K8sCluster** ``` import { K8sCluster } from "diagrams-js/digitalocean/compute"; ``` ![K8sNodePool](/resources/digitalocean/compute/k8s-node-pool.png) **K8sNodePool** ``` import { K8sNodePool } from "diagrams-js/digitalocean/compute"; ``` ![K8sNode](/resources/digitalocean/compute/k8s-node.png) **K8sNode** ``` import { K8sNode } from "diagrams-js/digitalocean/compute"; ``` ### digitalocean/database[​](#digitaloceandatabase "Direct link to digitalocean/database") ![DbaasPrimaryStandbyMore](/resources/digitalocean/database/dbaas-primary-standby-more.png) **DbaasPrimaryStandbyMore** ``` import { DbaasPrimaryStandbyMore } from "diagrams-js/digitalocean/database"; ``` ![DbaasPrimary](/resources/digitalocean/database/dbaas-primary.png) **DbaasPrimary** ``` import { DbaasPrimary } from "diagrams-js/digitalocean/database"; ``` ![DbaasReadOnly](/resources/digitalocean/database/dbaas-read-only.png) **DbaasReadOnly** ``` import { DbaasReadOnly } from "diagrams-js/digitalocean/database"; ``` ![DbaasStandby](/resources/digitalocean/database/dbaas-standby.png) **DbaasStandby** ``` import { DbaasStandby } from "diagrams-js/digitalocean/database"; ``` ### digitalocean/network[​](#digitaloceannetwork "Direct link to digitalocean/network") ![Certificate](/resources/digitalocean/network/certificate.png) **Certificate** ``` import { Certificate } from "diagrams-js/digitalocean/network"; ``` ![DomainRegistration](/resources/digitalocean/network/domain-registration.png) **DomainRegistration** ``` import { DomainRegistration } from "diagrams-js/digitalocean/network"; ``` ![Domain](/resources/digitalocean/network/domain.png) **Domain** ``` import { Domain } from "diagrams-js/digitalocean/network"; ``` ![Firewall](/resources/digitalocean/network/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/digitalocean/network"; ``` ![FloatingIp](/resources/digitalocean/network/floating-ip.png) **FloatingIp** ``` import { FloatingIp } from "diagrams-js/digitalocean/network"; ``` ![InternetGateway](/resources/digitalocean/network/internet-gateway.png) **InternetGateway** ``` import { InternetGateway } from "diagrams-js/digitalocean/network"; ``` ![LoadBalancer](/resources/digitalocean/network/load-balancer.png) **LoadBalancer** ``` import { LoadBalancer } from "diagrams-js/digitalocean/network"; ``` ![ManagedVpn](/resources/digitalocean/network/managed-vpn.png) **ManagedVpn** ``` import { ManagedVpn } from "diagrams-js/digitalocean/network"; ``` ![Vpc](/resources/digitalocean/network/vpc.png) **Vpc** ``` import { Vpc } from "diagrams-js/digitalocean/network"; ``` ### digitalocean/storage[​](#digitaloceanstorage "Direct link to digitalocean/storage") ![Folder](/resources/digitalocean/storage/folder.png) **Folder** ``` import { Folder } from "diagrams-js/digitalocean/storage"; ``` ![Space](/resources/digitalocean/storage/space.png) **Space** ``` import { Space } from "diagrams-js/digitalocean/storage"; ``` ![VolumeSnapshot](/resources/digitalocean/storage/volume-snapshot.png) **VolumeSnapshot** ``` import { VolumeSnapshot } from "diagrams-js/digitalocean/storage"; ``` ![Volume](/resources/digitalocean/storage/volume.png) **Volume** ``` import { Volume } from "diagrams-js/digitalocean/storage"; ``` --- # Elastic Node classes list for the Elastic provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Agent, Endpoint, Fleet } from "diagrams-js/elastic/agent"; import { APM, Auditbeat, Filebeat } from "diagrams-js/elastic/beats"; const diagram = Diagram("Elastic Architecture", { direction: "TB" }); const node1 = diagram.add(Agent("Node 1")); const node2 = diagram.add(APM("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/elastic) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### elastic/agent[​](#elasticagent "Direct link to elastic/agent") ![Agent](/resources/elastic/agent/agent.png) **Agent** ``` import { Agent } from "diagrams-js/elastic/agent"; ``` ![Endpoint](/resources/elastic/agent/endpoint.png) **Endpoint** ``` import { Endpoint } from "diagrams-js/elastic/agent"; ``` ![Fleet](/resources/elastic/agent/fleet.png) **Fleet** ``` import { Fleet } from "diagrams-js/elastic/agent"; ``` ![Integrations](/resources/elastic/agent/integrations.png) **Integrations** ``` import { Integrations } from "diagrams-js/elastic/agent"; ``` ### elastic/beats[​](#elasticbeats "Direct link to elastic/beats") ![APM](/resources/elastic/beats/apm.png) **APM** ``` import { APM } from "diagrams-js/elastic/beats"; ``` ![Auditbeat](/resources/elastic/beats/auditbeat.png) **Auditbeat** ``` import { Auditbeat } from "diagrams-js/elastic/beats"; ``` ![Filebeat](/resources/elastic/beats/filebeat.png) **Filebeat** ``` import { Filebeat } from "diagrams-js/elastic/beats"; ``` ![Functionbeat](/resources/elastic/beats/functionbeat.png) **Functionbeat** ``` import { Functionbeat } from "diagrams-js/elastic/beats"; ``` ![Heartbeat](/resources/elastic/beats/heartbeat.png) **Heartbeat** ``` import { Heartbeat } from "diagrams-js/elastic/beats"; ``` ![Metricbeat](/resources/elastic/beats/metricbeat.png) **Metricbeat** ``` import { Metricbeat } from "diagrams-js/elastic/beats"; ``` ![Packetbeat](/resources/elastic/beats/packetbeat.png) **Packetbeat** ``` import { Packetbeat } from "diagrams-js/elastic/beats"; ``` ![Winlogbeat](/resources/elastic/beats/winlogbeat.png) **Winlogbeat** ``` import { Winlogbeat } from "diagrams-js/elastic/beats"; ``` ### elastic/elasticsearch[​](#elasticelasticsearch "Direct link to elastic/elasticsearch") ![Alerting](/resources/elastic/elasticsearch/alerting.png) **Alerting** ``` import { Alerting } from "diagrams-js/elastic/elasticsearch"; ``` ![Beats](/resources/elastic/elasticsearch/beats.png) **Beats** ``` import { Beats } from "diagrams-js/elastic/elasticsearch"; ``` ![Elasticsearch](/resources/elastic/elasticsearch/elasticsearch.png) **Elasticsearch** ``` import { Elasticsearch } from "diagrams-js/elastic/elasticsearch"; ``` ![Kibana](/resources/elastic/elasticsearch/kibana.png) **Kibana** ``` import { Kibana } from "diagrams-js/elastic/elasticsearch"; ``` ![LogstashPipeline](/resources/elastic/elasticsearch/logstash-pipeline.png) **LogstashPipeline** ``` import { LogstashPipeline } from "diagrams-js/elastic/elasticsearch"; ``` ![Logstash](/resources/elastic/elasticsearch/logstash.png) **Logstash** ``` import { Logstash } from "diagrams-js/elastic/elasticsearch"; ``` ![MachineLearning](/resources/elastic/elasticsearch/machine-learning.png) **MachineLearning** ``` import { MachineLearning } from "diagrams-js/elastic/elasticsearch"; ``` ![MapServices](/resources/elastic/elasticsearch/map-services.png) **MapServices** ``` import { MapServices } from "diagrams-js/elastic/elasticsearch"; ``` ![Maps](/resources/elastic/elasticsearch/maps.png) **Maps** ``` import { Maps } from "diagrams-js/elastic/elasticsearch"; ``` ![Monitoring](/resources/elastic/elasticsearch/monitoring.png) **Monitoring** ``` import { Monitoring } from "diagrams-js/elastic/elasticsearch"; ``` ![SearchableSnapshots](/resources/elastic/elasticsearch/searchable-snapshots.png) **SearchableSnapshots** ``` import { SearchableSnapshots } from "diagrams-js/elastic/elasticsearch"; ``` ![SecuritySettings](/resources/elastic/elasticsearch/security-settings.png) **SecuritySettings** ``` import { SecuritySettings } from "diagrams-js/elastic/elasticsearch"; ``` ![SQL](/resources/elastic/elasticsearch/sql.png) **SQL** ``` import { SQL } from "diagrams-js/elastic/elasticsearch"; ``` ![Stack](/resources/elastic/elasticsearch/stack.png) **Stack** ``` import { Stack } from "diagrams-js/elastic/elasticsearch"; ``` ### elastic/enterprisesearch[​](#elasticenterprisesearch "Direct link to elastic/enterprisesearch") ![AppSearch](/resources/elastic/enterprisesearch/app-search.png) **AppSearch** ``` import { AppSearch } from "diagrams-js/elastic/enterprisesearch"; ``` ![Crawler](/resources/elastic/enterprisesearch/crawler.png) **Crawler** ``` import { Crawler } from "diagrams-js/elastic/enterprisesearch"; ``` ![EnterpriseSearch](/resources/elastic/enterprisesearch/enterprise-search.png) **EnterpriseSearch** ``` import { EnterpriseSearch } from "diagrams-js/elastic/enterprisesearch"; ``` ![SiteSearch](/resources/elastic/enterprisesearch/site-search.png) **SiteSearch** ``` import { SiteSearch } from "diagrams-js/elastic/enterprisesearch"; ``` ![WorkplaceSearch](/resources/elastic/enterprisesearch/workplace-search.png) **WorkplaceSearch** ``` import { WorkplaceSearch } from "diagrams-js/elastic/enterprisesearch"; ``` ### elastic/observability[​](#elasticobservability "Direct link to elastic/observability") ![APM](/resources/elastic/observability/apm.png) **APM** ``` import { APM } from "diagrams-js/elastic/observability"; ``` ![Logs](/resources/elastic/observability/logs.png) **Logs** ``` import { Logs } from "diagrams-js/elastic/observability"; ``` ![Metrics](/resources/elastic/observability/metrics.png) **Metrics** ``` import { Metrics } from "diagrams-js/elastic/observability"; ``` ![Observability](/resources/elastic/observability/observability.png) **Observability** ``` import { Observability } from "diagrams-js/elastic/observability"; ``` ![Uptime](/resources/elastic/observability/uptime.png) **Uptime** ``` import { Uptime } from "diagrams-js/elastic/observability"; ``` ### elastic/orchestration[​](#elasticorchestration "Direct link to elastic/orchestration") ![ECE](/resources/elastic/orchestration/ece.png) **ECE** ``` import { ECE } from "diagrams-js/elastic/orchestration"; ``` ![ECK](/resources/elastic/orchestration/eck.png) **ECK** ``` import { ECK } from "diagrams-js/elastic/orchestration"; ``` ### elastic/saas[​](#elasticsaas "Direct link to elastic/saas") ![Cloud](/resources/elastic/saas/cloud.png) **Cloud** ``` import { Cloud } from "diagrams-js/elastic/saas"; ``` ![Elastic](/resources/elastic/saas/elastic.png) **Elastic** ``` import { Elastic } from "diagrams-js/elastic/saas"; ``` ### elastic/security[​](#elasticsecurity "Direct link to elastic/security") ![Endpoint](/resources/elastic/security/endpoint.png) **Endpoint** ``` import { Endpoint } from "diagrams-js/elastic/security"; ``` ![Security](/resources/elastic/security/security.png) **Security** ``` import { Security } from "diagrams-js/elastic/security"; ``` ![SIEM](/resources/elastic/security/siem.png) **SIEM** ``` import { SIEM } from "diagrams-js/elastic/security"; ``` ![Xdr](/resources/elastic/security/xdr.png) **Xdr** ``` import { Xdr } from "diagrams-js/elastic/security"; ``` --- # Firebase Node classes list for the Firebase provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Firebase } from "diagrams-js/firebase/base"; import { Authentication, Firestore, Functions } from "diagrams-js/firebase/develop"; const diagram = Diagram("Firebase Architecture", { direction: "TB" }); const node1 = diagram.add(Firebase("Node 1")); const node2 = diagram.add(Authentication("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/firebase) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### firebase/base[​](#firebasebase "Direct link to firebase/base") ![Firebase](/resources/firebase/base/firebase.png) **Firebase** ``` import { Firebase } from "diagrams-js/firebase/base"; ``` ### firebase/develop[​](#firebasedevelop "Direct link to firebase/develop") ![Authentication](/resources/firebase/develop/authentication.png) **Authentication** ``` import { Authentication } from "diagrams-js/firebase/develop"; ``` ![Firestore](/resources/firebase/develop/firestore.png) **Firestore** ``` import { Firestore } from "diagrams-js/firebase/develop"; ``` ![Functions](/resources/firebase/develop/functions.png) **Functions** ``` import { Functions } from "diagrams-js/firebase/develop"; ``` ![Hosting](/resources/firebase/develop/hosting.png) **Hosting** ``` import { Hosting } from "diagrams-js/firebase/develop"; ``` ![MLKit](/resources/firebase/develop/ml-kit.png) **MLKit** ``` import { MLKit } from "diagrams-js/firebase/develop"; ``` ![RealtimeDatabase](/resources/firebase/develop/realtime-database.png) **RealtimeDatabase** ``` import { RealtimeDatabase } from "diagrams-js/firebase/develop"; ``` ![Storage](/resources/firebase/develop/storage.png) **Storage** ``` import { Storage } from "diagrams-js/firebase/develop"; ``` ### firebase/extentions[​](#firebaseextentions "Direct link to firebase/extentions") ![Extensions](/resources/firebase/extentions/extensions.png) **Extensions** ``` import { Extensions } from "diagrams-js/firebase/extentions"; ``` ### firebase/grow[​](#firebasegrow "Direct link to firebase/grow") ![ABTesting](/resources/firebase/grow/ab-testing.png) **ABTesting** ``` import { ABTesting } from "diagrams-js/firebase/grow"; ``` ![AppIndexing](/resources/firebase/grow/app-indexing.png) **AppIndexing** ``` import { AppIndexing } from "diagrams-js/firebase/grow"; ``` ![DynamicLinks](/resources/firebase/grow/dynamic-links.png) **DynamicLinks** ``` import { DynamicLinks } from "diagrams-js/firebase/grow"; ``` ![InAppMessaging](/resources/firebase/grow/in-app-messaging.png) **InAppMessaging** ``` import { InAppMessaging } from "diagrams-js/firebase/grow"; ``` ![Invites](/resources/firebase/grow/invites.png) **Invites** ``` import { Invites } from "diagrams-js/firebase/grow"; ``` ![Messaging](/resources/firebase/grow/messaging.png) **Messaging** ``` import { Messaging } from "diagrams-js/firebase/grow"; ``` ![Predictions](/resources/firebase/grow/predictions.png) **Predictions** ``` import { Predictions } from "diagrams-js/firebase/grow"; ``` ![RemoteConfig](/resources/firebase/grow/remote-config.png) **RemoteConfig** ``` import { RemoteConfig } from "diagrams-js/firebase/grow"; ``` ### firebase/quality[​](#firebasequality "Direct link to firebase/quality") ![AppDistribution](/resources/firebase/quality/app-distribution.png) **AppDistribution** ``` import { AppDistribution } from "diagrams-js/firebase/quality"; ``` ![CrashReporting](/resources/firebase/quality/crash-reporting.png) **CrashReporting** ``` import { CrashReporting } from "diagrams-js/firebase/quality"; ``` ![Crashlytics](/resources/firebase/quality/crashlytics.png) **Crashlytics** ``` import { Crashlytics } from "diagrams-js/firebase/quality"; ``` ![PerformanceMonitoring](/resources/firebase/quality/performance-monitoring.png) **PerformanceMonitoring** ``` import { PerformanceMonitoring } from "diagrams-js/firebase/quality"; ``` ![TestLab](/resources/firebase/quality/test-lab.png) **TestLab** ``` import { TestLab } from "diagrams-js/firebase/quality"; ``` --- # GCP Node classes list for the GCP provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Bigquery, Composer, DataCatalog } from "diagrams-js/gcp/analytics"; import { APIGateway, Apigee, Endpoints } from "diagrams-js/gcp/api"; const diagram = Diagram("GCP Architecture", { direction: "TB" }); const node1 = diagram.add(Bigquery("Node 1")); const node2 = diagram.add(APIGateway("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/gcp) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### gcp/analytics[​](#gcpanalytics "Direct link to gcp/analytics") ![Bigquery](/resources/gcp/analytics/bigquery.png) **Bigquery** ``` import { Bigquery } from "diagrams-js/gcp/analytics"; ``` ![Composer](/resources/gcp/analytics/composer.png) **Composer** ``` import { Composer } from "diagrams-js/gcp/analytics"; ``` ![DataCatalog](/resources/gcp/analytics/data-catalog.png) **DataCatalog** ``` import { DataCatalog } from "diagrams-js/gcp/analytics"; ``` ![DataFusion](/resources/gcp/analytics/data-fusion.png) **DataFusion** ``` import { DataFusion } from "diagrams-js/gcp/analytics"; ``` ![Dataflow](/resources/gcp/analytics/dataflow.png) **Dataflow** ``` import { Dataflow } from "diagrams-js/gcp/analytics"; ``` ![Datalab](/resources/gcp/analytics/datalab.png) **Datalab** ``` import { Datalab } from "diagrams-js/gcp/analytics"; ``` ![Dataprep](/resources/gcp/analytics/dataprep.png) **Dataprep** ``` import { Dataprep } from "diagrams-js/gcp/analytics"; ``` ![Dataproc](/resources/gcp/analytics/dataproc.png) **Dataproc** ``` import { Dataproc } from "diagrams-js/gcp/analytics"; ``` ![Genomics](/resources/gcp/analytics/genomics.png) **Genomics** ``` import { Genomics } from "diagrams-js/gcp/analytics"; ``` ![Looker](/resources/gcp/analytics/looker.png) **Looker** ``` import { Looker } from "diagrams-js/gcp/analytics"; ``` ![Pubsub](/resources/gcp/analytics/pubsub.png) **Pubsub** ``` import { Pubsub } from "diagrams-js/gcp/analytics"; ``` ### gcp/api[​](#gcpapi "Direct link to gcp/api") ![APIGateway](/resources/gcp/api/api-gateway.png) **APIGateway** ``` import { APIGateway } from "diagrams-js/gcp/api"; ``` ![Apigee](/resources/gcp/api/apigee.png) **Apigee** ``` import { Apigee } from "diagrams-js/gcp/api"; ``` ![Endpoints](/resources/gcp/api/endpoints.png) **Endpoints** ``` import { Endpoints } from "diagrams-js/gcp/api"; ``` ### gcp/compute[​](#gcpcompute "Direct link to gcp/compute") ![AppEngine](/resources/gcp/compute/app-engine.png) **AppEngine** ``` import { AppEngine } from "diagrams-js/gcp/compute"; ``` ![BinaryAuthorization](/resources/gcp/compute/binary-authorization.png) **BinaryAuthorization** ``` import { BinaryAuthorization } from "diagrams-js/gcp/compute"; ``` ![ComputeEngine](/resources/gcp/compute/compute-engine.png) **ComputeEngine** ``` import { ComputeEngine } from "diagrams-js/gcp/compute"; ``` ![ContainerOptimizedOS](/resources/gcp/compute/container-optimized-os.png) **ContainerOptimizedOS** ``` import { ContainerOptimizedOS } from "diagrams-js/gcp/compute"; ``` ![Functions](/resources/gcp/compute/functions.png) **Functions** ``` import { Functions } from "diagrams-js/gcp/compute"; ``` ![GKEOnPrem](/resources/gcp/compute/gke-on-prem.png) **GKEOnPrem** ``` import { GKEOnPrem } from "diagrams-js/gcp/compute"; ``` ![GPU](/resources/gcp/compute/gpu.png) **GPU** ``` import { GPU } from "diagrams-js/gcp/compute"; ``` ![KubernetesEngine](/resources/gcp/compute/kubernetes-engine.png) **KubernetesEngine** ``` import { KubernetesEngine } from "diagrams-js/gcp/compute"; ``` ![OSConfigurationManagement](/resources/gcp/compute/os-configuration-management.png) **OSConfigurationManagement** ``` import { OSConfigurationManagement } from "diagrams-js/gcp/compute"; ``` ![OSInventoryManagement](/resources/gcp/compute/os-inventory-management.png) **OSInventoryManagement** ``` import { OSInventoryManagement } from "diagrams-js/gcp/compute"; ``` ![OSPatchManagement](/resources/gcp/compute/os-patch-management.png) **OSPatchManagement** ``` import { OSPatchManagement } from "diagrams-js/gcp/compute"; ``` ![Run](/resources/gcp/compute/run.png) **Run** ``` import { Run } from "diagrams-js/gcp/compute"; ``` ### gcp/database[​](#gcpdatabase "Direct link to gcp/database") ![Bigtable](/resources/gcp/database/bigtable.png) **Bigtable** ``` import { Bigtable } from "diagrams-js/gcp/database"; ``` ![Datastore](/resources/gcp/database/datastore.png) **Datastore** ``` import { Datastore } from "diagrams-js/gcp/database"; ``` ![Firestore](/resources/gcp/database/firestore.png) **Firestore** ``` import { Firestore } from "diagrams-js/gcp/database"; ``` ![Memorystore](/resources/gcp/database/memorystore.png) **Memorystore** ``` import { Memorystore } from "diagrams-js/gcp/database"; ``` ![Spanner](/resources/gcp/database/spanner.png) **Spanner** ``` import { Spanner } from "diagrams-js/gcp/database"; ``` ![SQL](/resources/gcp/database/sql.png) **SQL** ``` import { SQL } from "diagrams-js/gcp/database"; ``` ### gcp/devtools[​](#gcpdevtools "Direct link to gcp/devtools") ![Build](/resources/gcp/devtools/build.png) **Build** ``` import { Build } from "diagrams-js/gcp/devtools"; ``` ![CloudShell](/resources/gcp/devtools/cloud-shell.png) **CloudShell** ``` import { CloudShell } from "diagrams-js/gcp/devtools"; ``` ![CodeForIntellij](/resources/gcp/devtools/code-for-intellij.png) **CodeForIntellij** ``` import { CodeForIntellij } from "diagrams-js/gcp/devtools"; ``` ![Code](/resources/gcp/devtools/code.png) **Code** ``` import { Code } from "diagrams-js/gcp/devtools"; ``` ![ContainerRegistry](/resources/gcp/devtools/container-registry.png) **ContainerRegistry** ``` import { ContainerRegistry } from "diagrams-js/gcp/devtools"; ``` ![GradleAppEnginePlugin](/resources/gcp/devtools/gradle-app-engine-plugin.png) **GradleAppEnginePlugin** ``` import { GradleAppEnginePlugin } from "diagrams-js/gcp/devtools"; ``` ![IdePlugins](/resources/gcp/devtools/ide-plugins.png) **IdePlugins** ``` import { IdePlugins } from "diagrams-js/gcp/devtools"; ``` ![MavenAppEnginePlugin](/resources/gcp/devtools/maven-app-engine-plugin.png) **MavenAppEnginePlugin** ``` import { MavenAppEnginePlugin } from "diagrams-js/gcp/devtools"; ``` ![Scheduler](/resources/gcp/devtools/scheduler.png) **Scheduler** ``` import { Scheduler } from "diagrams-js/gcp/devtools"; ``` ![SDK](/resources/gcp/devtools/sdk.png) **SDK** ``` import { SDK } from "diagrams-js/gcp/devtools"; ``` ![ServiceCatalog](/resources/gcp/devtools/service-catalog.png) **ServiceCatalog** ``` import { ServiceCatalog } from "diagrams-js/gcp/devtools"; ``` ![SourceRepositories](/resources/gcp/devtools/source-repositories.png) **SourceRepositories** ``` import { SourceRepositories } from "diagrams-js/gcp/devtools"; ``` ![Tasks](/resources/gcp/devtools/tasks.png) **Tasks** ``` import { Tasks } from "diagrams-js/gcp/devtools"; ``` ![TestLab](/resources/gcp/devtools/test-lab.png) **TestLab** ``` import { TestLab } from "diagrams-js/gcp/devtools"; ``` ![ToolsForEclipse](/resources/gcp/devtools/tools-for-eclipse.png) **ToolsForEclipse** ``` import { ToolsForEclipse } from "diagrams-js/gcp/devtools"; ``` ![ToolsForPowershell](/resources/gcp/devtools/tools-for-powershell.png) **ToolsForPowershell** ``` import { ToolsForPowershell } from "diagrams-js/gcp/devtools"; ``` ![ToolsForVisualStudio](/resources/gcp/devtools/tools-for-visual-studio.png) **ToolsForVisualStudio** ``` import { ToolsForVisualStudio } from "diagrams-js/gcp/devtools"; ``` ### gcp/iot[​](#gcpiot "Direct link to gcp/iot") ![IotCore](/resources/gcp/iot/iot-core.png) **IotCore** ``` import { IotCore } from "diagrams-js/gcp/iot"; ``` ### gcp/management[​](#gcpmanagement "Direct link to gcp/management") ![Billing](/resources/gcp/management/billing.png) **Billing** ``` import { Billing } from "diagrams-js/gcp/management"; ``` ![Project](/resources/gcp/management/project.png) **Project** ``` import { Project } from "diagrams-js/gcp/management"; ``` ![Quotas](/resources/gcp/management/quotas.png) **Quotas** ``` import { Quotas } from "diagrams-js/gcp/management"; ``` ![Support](/resources/gcp/management/support.png) **Support** ``` import { Support } from "diagrams-js/gcp/management"; ``` ### gcp/migration[​](#gcpmigration "Direct link to gcp/migration") ![MigrateComputeEngine](/resources/gcp/migration/migrate-compute-engine.png) **MigrateComputeEngine** ``` import { MigrateComputeEngine } from "diagrams-js/gcp/migration"; ``` ![TransferAppliance](/resources/gcp/migration/transfer-appliance.png) **TransferAppliance** ``` import { TransferAppliance } from "diagrams-js/gcp/migration"; ``` ### gcp/ml[​](#gcpml "Direct link to gcp/ml") ![AdvancedSolutionsLab](/resources/gcp/ml/advanced-solutions-lab.png) **AdvancedSolutionsLab** ``` import { AdvancedSolutionsLab } from "diagrams-js/gcp/ml"; ``` ![AIHub](/resources/gcp/ml/ai-hub.png) **AIHub** ``` import { AIHub } from "diagrams-js/gcp/ml"; ``` ![AIPlatformDataLabelingService](/resources/gcp/ml/ai-platform-data-labeling-service.png) **AIPlatformDataLabelingService** ``` import { AIPlatformDataLabelingService } from "diagrams-js/gcp/ml"; ``` ![AIPlatform](/resources/gcp/ml/ai-platform.png) **AIPlatform** ``` import { AIPlatform } from "diagrams-js/gcp/ml"; ``` ![AutomlNaturalLanguage](/resources/gcp/ml/automl-natural-language.png) **AutomlNaturalLanguage** ``` import { AutomlNaturalLanguage } from "diagrams-js/gcp/ml"; ``` ![AutomlTables](/resources/gcp/ml/automl-tables.png) **AutomlTables** ``` import { AutomlTables } from "diagrams-js/gcp/ml"; ``` ![AutomlTranslation](/resources/gcp/ml/automl-translation.png) **AutomlTranslation** ``` import { AutomlTranslation } from "diagrams-js/gcp/ml"; ``` ![AutomlVideoIntelligence](/resources/gcp/ml/automl-video-intelligence.png) **AutomlVideoIntelligence** ``` import { AutomlVideoIntelligence } from "diagrams-js/gcp/ml"; ``` ![AutomlVision](/resources/gcp/ml/automl-vision.png) **AutomlVision** ``` import { AutomlVision } from "diagrams-js/gcp/ml"; ``` ![Automl](/resources/gcp/ml/automl.png) **Automl** ``` import { Automl } from "diagrams-js/gcp/ml"; ``` ![DialogFlowEnterpriseEdition](/resources/gcp/ml/dialog-flow-enterprise-edition.png) **DialogFlowEnterpriseEdition** ``` import { DialogFlowEnterpriseEdition } from "diagrams-js/gcp/ml"; ``` ![InferenceAPI](/resources/gcp/ml/inference-api.png) **InferenceAPI** ``` import { InferenceAPI } from "diagrams-js/gcp/ml"; ``` ![JobsAPI](/resources/gcp/ml/jobs-api.png) **JobsAPI** ``` import { JobsAPI } from "diagrams-js/gcp/ml"; ``` ![NaturalLanguageAPI](/resources/gcp/ml/natural-language-api.png) **NaturalLanguageAPI** ``` import { NaturalLanguageAPI } from "diagrams-js/gcp/ml"; ``` ![RecommendationsAI](/resources/gcp/ml/recommendations-ai.png) **RecommendationsAI** ``` import { RecommendationsAI } from "diagrams-js/gcp/ml"; ``` ![SpeechToText](/resources/gcp/ml/speech-to-text.png) **SpeechToText** ``` import { SpeechToText } from "diagrams-js/gcp/ml"; ``` ![TextToSpeech](/resources/gcp/ml/text-to-speech.png) **TextToSpeech** ``` import { TextToSpeech } from "diagrams-js/gcp/ml"; ``` ![TPU](/resources/gcp/ml/tpu.png) **TPU** ``` import { TPU } from "diagrams-js/gcp/ml"; ``` ![TranslationAPI](/resources/gcp/ml/translation-api.png) **TranslationAPI** ``` import { TranslationAPI } from "diagrams-js/gcp/ml"; ``` ![VertexAI](/resources/gcp/ml/vertex-ai.png) **VertexAI** ``` import { VertexAI } from "diagrams-js/gcp/ml"; ``` ![VideoIntelligenceAPI](/resources/gcp/ml/video-intelligence-api.png) **VideoIntelligenceAPI** ``` import { VideoIntelligenceAPI } from "diagrams-js/gcp/ml"; ``` ![VisionAPI](/resources/gcp/ml/vision-api.png) **VisionAPI** ``` import { VisionAPI } from "diagrams-js/gcp/ml"; ``` ### gcp/network[​](#gcpnetwork "Direct link to gcp/network") ![Armor](/resources/gcp/network/armor.png) **Armor** ``` import { Armor } from "diagrams-js/gcp/network"; ``` ![CDN](/resources/gcp/network/cdn.png) **CDN** ``` import { CDN } from "diagrams-js/gcp/network"; ``` ![CloudIDS](/resources/gcp/network/cloud-ids.png) **CloudIDS** ``` import { CloudIDS } from "diagrams-js/gcp/network"; ``` ![DedicatedInterconnect](/resources/gcp/network/dedicated-interconnect.png) **DedicatedInterconnect** ``` import { DedicatedInterconnect } from "diagrams-js/gcp/network"; ``` ![DNS](/resources/gcp/network/dns.png) **DNS** ``` import { DNS } from "diagrams-js/gcp/network"; ``` ![ExternalIpAddresses](/resources/gcp/network/external-ip-addresses.png) **ExternalIpAddresses** ``` import { ExternalIpAddresses } from "diagrams-js/gcp/network"; ``` ![FirewallRules](/resources/gcp/network/firewall-rules.png) **FirewallRules** ``` import { FirewallRules } from "diagrams-js/gcp/network"; ``` ![LoadBalancing](/resources/gcp/network/load-balancing.png) **LoadBalancing** ``` import { LoadBalancing } from "diagrams-js/gcp/network"; ``` ![NAT](/resources/gcp/network/nat.png) **NAT** ``` import { NAT } from "diagrams-js/gcp/network"; ``` ![NetworkConnectivityCenter](/resources/gcp/network/network-connectivity-center.png) **NetworkConnectivityCenter** ``` import { NetworkConnectivityCenter } from "diagrams-js/gcp/network"; ``` ![NetworkIntelligenceCenter](/resources/gcp/network/network-intelligence-center.png) **NetworkIntelligenceCenter** ``` import { NetworkIntelligenceCenter } from "diagrams-js/gcp/network"; ``` ![NetworkSecurity](/resources/gcp/network/network-security.png) **NetworkSecurity** ``` import { NetworkSecurity } from "diagrams-js/gcp/network"; ``` ![NetworkTiers](/resources/gcp/network/network-tiers.png) **NetworkTiers** ``` import { NetworkTiers } from "diagrams-js/gcp/network"; ``` ![NetworkTopology](/resources/gcp/network/network-topology.png) **NetworkTopology** ``` import { NetworkTopology } from "diagrams-js/gcp/network"; ``` ![Network](/resources/gcp/network/network.png) **Network** ``` import { Network } from "diagrams-js/gcp/network"; ``` ![PartnerInterconnect](/resources/gcp/network/partner-interconnect.png) **PartnerInterconnect** ``` import { PartnerInterconnect } from "diagrams-js/gcp/network"; ``` ![PremiumNetworkTier](/resources/gcp/network/premium-network-tier.png) **PremiumNetworkTier** ``` import { PremiumNetworkTier } from "diagrams-js/gcp/network"; ``` ![PrivateServiceConnect](/resources/gcp/network/private-service-connect.png) **PrivateServiceConnect** ``` import { PrivateServiceConnect } from "diagrams-js/gcp/network"; ``` ![Router](/resources/gcp/network/router.png) **Router** ``` import { Router } from "diagrams-js/gcp/network"; ``` ![Routes](/resources/gcp/network/routes.png) **Routes** ``` import { Routes } from "diagrams-js/gcp/network"; ``` ![ServiceMesh](/resources/gcp/network/service-mesh.png) **ServiceMesh** ``` import { ServiceMesh } from "diagrams-js/gcp/network"; ``` ![StandardNetworkTier](/resources/gcp/network/standard-network-tier.png) **StandardNetworkTier** ``` import { StandardNetworkTier } from "diagrams-js/gcp/network"; ``` ![TrafficDirector](/resources/gcp/network/traffic-director.png) **TrafficDirector** ``` import { TrafficDirector } from "diagrams-js/gcp/network"; ``` ![VirtualPrivateCloud](/resources/gcp/network/virtual-private-cloud.png) **VirtualPrivateCloud** ``` import { VirtualPrivateCloud } from "diagrams-js/gcp/network"; ``` ![VPN](/resources/gcp/network/vpn.png) **VPN** ``` import { VPN } from "diagrams-js/gcp/network"; ``` ### gcp/operations[​](#gcpoperations "Direct link to gcp/operations") ![Logging](/resources/gcp/operations/logging.png) **Logging** ``` import { Logging } from "diagrams-js/gcp/operations"; ``` ![Monitoring](/resources/gcp/operations/monitoring.png) **Monitoring** ``` import { Monitoring } from "diagrams-js/gcp/operations"; ``` ### gcp/security[​](#gcpsecurity "Direct link to gcp/security") ![AccessContextManager](/resources/gcp/security/access-context-manager.png) **AccessContextManager** ``` import { AccessContextManager } from "diagrams-js/gcp/security"; ``` ![AssuredWorkloads](/resources/gcp/security/assured-workloads.png) **AssuredWorkloads** ``` import { AssuredWorkloads } from "diagrams-js/gcp/security"; ``` ![CertificateAuthorityService](/resources/gcp/security/certificate-authority-service.png) **CertificateAuthorityService** ``` import { CertificateAuthorityService } from "diagrams-js/gcp/security"; ``` ![CertificateManager](/resources/gcp/security/certificate-manager.png) **CertificateManager** ``` import { CertificateManager } from "diagrams-js/gcp/security"; ``` ![CloudAssetInventory](/resources/gcp/security/cloud-asset-inventory.png) **CloudAssetInventory** ``` import { CloudAssetInventory } from "diagrams-js/gcp/security"; ``` ![Iam](/resources/gcp/security/iam.png) **Iam** ``` import { Iam } from "diagrams-js/gcp/security"; ``` ![IAP](/resources/gcp/security/iap.png) **IAP** ``` import { IAP } from "diagrams-js/gcp/security"; ``` ![KeyManagementService](/resources/gcp/security/key-management-service.png) **KeyManagementService** ``` import { KeyManagementService } from "diagrams-js/gcp/security"; ``` ![ResourceManager](/resources/gcp/security/resource-manager.png) **ResourceManager** ``` import { ResourceManager } from "diagrams-js/gcp/security"; ``` ![SecretManager](/resources/gcp/security/secret-manager.png) **SecretManager** ``` import { SecretManager } from "diagrams-js/gcp/security"; ``` ![SecurityCommandCenter](/resources/gcp/security/security-command-center.png) **SecurityCommandCenter** ``` import { SecurityCommandCenter } from "diagrams-js/gcp/security"; ``` ![SecurityHealthAdvisor](/resources/gcp/security/security-health-advisor.png) **SecurityHealthAdvisor** ``` import { SecurityHealthAdvisor } from "diagrams-js/gcp/security"; ``` ![SecurityScanner](/resources/gcp/security/security-scanner.png) **SecurityScanner** ``` import { SecurityScanner } from "diagrams-js/gcp/security"; ``` ### gcp/storage[​](#gcpstorage "Direct link to gcp/storage") ![Filestore](/resources/gcp/storage/filestore.png) **Filestore** ``` import { Filestore } from "diagrams-js/gcp/storage"; ``` ![LocalSSD](/resources/gcp/storage/local-ssd.png) **LocalSSD** ``` import { LocalSSD } from "diagrams-js/gcp/storage"; ``` ![PersistentDisk](/resources/gcp/storage/persistent-disk.png) **PersistentDisk** ``` import { PersistentDisk } from "diagrams-js/gcp/storage"; ``` ![Storage](/resources/gcp/storage/storage.png) **Storage** ``` import { Storage } from "diagrams-js/gcp/storage"; ``` --- # Generic Node classes list for the Generic provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Blank } from "diagrams-js/generic/blank"; import { Rack } from "diagrams-js/generic/compute"; const diagram = Diagram("Generic Architecture", { direction: "TB" }); const node1 = diagram.add(Blank("Node 1")); const node2 = diagram.add(Rack("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/generic) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### generic/blank[​](#genericblank "Direct link to generic/blank") ![Blank](/resources/generic/blank/blank.png) **Blank** ``` import { Blank } from "diagrams-js/generic/blank"; ``` ### generic/compute[​](#genericcompute "Direct link to generic/compute") ![Rack](/resources/generic/compute/rack.png) **Rack** ``` import { Rack } from "diagrams-js/generic/compute"; ``` ### generic/database[​](#genericdatabase "Direct link to generic/database") ![SQL](/resources/generic/database/sql.png) **SQL** ``` import { SQL } from "diagrams-js/generic/database"; ``` ### generic/device[​](#genericdevice "Direct link to generic/device") ![Mobile](/resources/generic/device/mobile.png) **Mobile** ``` import { Mobile } from "diagrams-js/generic/device"; ``` ![Tablet](/resources/generic/device/tablet.png) **Tablet** ``` import { Tablet } from "diagrams-js/generic/device"; ``` ### generic/network[​](#genericnetwork "Direct link to generic/network") ![Firewall](/resources/generic/network/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/generic/network"; ``` ![Router](/resources/generic/network/router.png) **Router** ``` import { Router } from "diagrams-js/generic/network"; ``` ![Subnet](/resources/generic/network/subnet.png) **Subnet** ``` import { Subnet } from "diagrams-js/generic/network"; ``` ![Switch](/resources/generic/network/switch.png) **Switch** ``` import { Switch } from "diagrams-js/generic/network"; ``` ![VPN](/resources/generic/network/vpn.png) **VPN** ``` import { VPN } from "diagrams-js/generic/network"; ``` ### generic/os[​](#genericos "Direct link to generic/os") ![Android](/resources/generic/os/android.png) **Android** ``` import { Android } from "diagrams-js/generic/os"; ``` ![Centos](/resources/generic/os/centos.png) **Centos** ``` import { Centos } from "diagrams-js/generic/os"; ``` ![Debian](/resources/generic/os/debian.png) **Debian** ``` import { Debian } from "diagrams-js/generic/os"; ``` ![IOS](/resources/generic/os/ios.png) **IOS** ``` import { IOS } from "diagrams-js/generic/os"; ``` ![LinuxGeneral](/resources/generic/os/linux-general.png) **LinuxGeneral** ``` import { LinuxGeneral } from "diagrams-js/generic/os"; ``` ![Raspbian](/resources/generic/os/raspbian.png) **Raspbian** ``` import { Raspbian } from "diagrams-js/generic/os"; ``` ![RedHat](/resources/generic/os/red-hat.png) **RedHat** ``` import { RedHat } from "diagrams-js/generic/os"; ``` ![Suse](/resources/generic/os/suse.png) **Suse** ``` import { Suse } from "diagrams-js/generic/os"; ``` ![Ubuntu](/resources/generic/os/ubuntu.png) **Ubuntu** ``` import { Ubuntu } from "diagrams-js/generic/os"; ``` ![Windows](/resources/generic/os/windows.png) **Windows** ``` import { Windows } from "diagrams-js/generic/os"; ``` ### generic/place[​](#genericplace "Direct link to generic/place") ![Datacenter](/resources/generic/place/datacenter.png) **Datacenter** ``` import { Datacenter } from "diagrams-js/generic/place"; ``` ### generic/storage[​](#genericstorage "Direct link to generic/storage") ![Storage](/resources/generic/storage/storage.png) **Storage** ``` import { Storage } from "diagrams-js/generic/storage"; ``` ### generic/virtualization[​](#genericvirtualization "Direct link to generic/virtualization") ![Qemu](/resources/generic/virtualization/qemu.png) **Qemu** ``` import { Qemu } from "diagrams-js/generic/virtualization"; ``` ![Virtualbox](/resources/generic/virtualization/virtualbox.png) **Virtualbox** ``` import { Virtualbox } from "diagrams-js/generic/virtualization"; ``` ![Vmware](/resources/generic/virtualization/vmware.png) **Vmware** ``` import { Vmware } from "diagrams-js/generic/virtualization"; ``` ![XEN](/resources/generic/virtualization/xen.png) **XEN** ``` import { XEN } from "diagrams-js/generic/virtualization"; ``` --- # GIS Node classes list for the GIS provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Gdal, Imposm, Lastools } from "diagrams-js/gis/cli"; import { BAN, Here, IGN } from "diagrams-js/gis/data"; const diagram = Diagram("GIS Architecture", { direction: "TB" }); const node1 = diagram.add(Gdal("Node 1")); const node2 = diagram.add(BAN("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/gis) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### gis/cli[​](#giscli "Direct link to gis/cli") ![Gdal](/resources/gis/cli/gdal.png) **Gdal** ``` import { Gdal } from "diagrams-js/gis/cli"; ``` ![Imposm](/resources/gis/cli/imposm.png) **Imposm** ``` import { Imposm } from "diagrams-js/gis/cli"; ``` ![Lastools](/resources/gis/cli/lastools.png) **Lastools** ``` import { Lastools } from "diagrams-js/gis/cli"; ``` ![Mapnik](/resources/gis/cli/mapnik.png) **Mapnik** ``` import { Mapnik } from "diagrams-js/gis/cli"; ``` ![Mdal](/resources/gis/cli/mdal.png) **Mdal** ``` import { Mdal } from "diagrams-js/gis/cli"; ``` ![Pdal](/resources/gis/cli/pdal.png) **Pdal** ``` import { Pdal } from "diagrams-js/gis/cli"; ``` ### gis/data[​](#gisdata "Direct link to gis/data") ![BAN](/resources/gis/data/ban.png) **BAN** ``` import { BAN } from "diagrams-js/gis/data"; ``` ![Here](/resources/gis/data/here.png) **Here** ``` import { Here } from "diagrams-js/gis/data"; ``` ![IGN](/resources/gis/data/ign.png) **IGN** ``` import { IGN } from "diagrams-js/gis/data"; ``` ![Openstreetmap](/resources/gis/data/openstreetmap.png) **Openstreetmap** ``` import { Openstreetmap } from "diagrams-js/gis/data"; ``` ![Overturemaps](/resources/gis/data/overturemaps.png) **Overturemaps** ``` import { Overturemaps } from "diagrams-js/gis/data"; ``` ### gis/database[​](#gisdatabase "Direct link to gis/database") ![Postgis](/resources/gis/database/postgis.png) **Postgis** ``` import { Postgis } from "diagrams-js/gis/database"; ``` ### gis/desktop[​](#gisdesktop "Direct link to gis/desktop") ![Maptunik](/resources/gis/desktop/maptunik.png) **Maptunik** ``` import { Maptunik } from "diagrams-js/gis/desktop"; ``` ![QGIS](/resources/gis/desktop/qgis.png) **QGIS** ``` import { QGIS } from "diagrams-js/gis/desktop"; ``` ### gis/format[​](#gisformat "Direct link to gis/format") ![Geopackage](/resources/gis/format/geopackage.png) **Geopackage** ``` import { Geopackage } from "diagrams-js/gis/format"; ``` ![Geoparquet](/resources/gis/format/geoparquet.png) **Geoparquet** ``` import { Geoparquet } from "diagrams-js/gis/format"; ``` ### gis/geocoding[​](#gisgeocoding "Direct link to gis/geocoding") ![Addok](/resources/gis/geocoding/addok.png) **Addok** ``` import { Addok } from "diagrams-js/gis/geocoding"; ``` ![Gisgraphy](/resources/gis/geocoding/gisgraphy.png) **Gisgraphy** ``` import { Gisgraphy } from "diagrams-js/gis/geocoding"; ``` ![Nominatim](/resources/gis/geocoding/nominatim.png) **Nominatim** ``` import { Nominatim } from "diagrams-js/gis/geocoding"; ``` ![Pelias](/resources/gis/geocoding/pelias.png) **Pelias** ``` import { Pelias } from "diagrams-js/gis/geocoding"; ``` ### gis/java[​](#gisjava "Direct link to gis/java") ![Geotools](/resources/gis/java/geotools.png) **Geotools** ``` import { Geotools } from "diagrams-js/gis/java"; ``` ### gis/javascript[​](#gisjavascript "Direct link to gis/javascript") ![Cesium](/resources/gis/javascript/cesium.png) **Cesium** ``` import { Cesium } from "diagrams-js/gis/javascript"; ``` ![Geostyler](/resources/gis/javascript/geostyler.png) **Geostyler** ``` import { Geostyler } from "diagrams-js/gis/javascript"; ``` ![Keplerjs](/resources/gis/javascript/keplerjs.png) **Keplerjs** ``` import { Keplerjs } from "diagrams-js/gis/javascript"; ``` ![Leaflet](/resources/gis/javascript/leaflet.png) **Leaflet** ``` import { Leaflet } from "diagrams-js/gis/javascript"; ``` ![Maplibre](/resources/gis/javascript/maplibre.png) **Maplibre** ``` import { Maplibre } from "diagrams-js/gis/javascript"; ``` ![OlExt](/resources/gis/javascript/ol-ext.png) **OlExt** ``` import { OlExt } from "diagrams-js/gis/javascript"; ``` ![Openlayers](/resources/gis/javascript/openlayers.png) **Openlayers** ``` import { Openlayers } from "diagrams-js/gis/javascript"; ``` ![Turfjs](/resources/gis/javascript/turfjs.png) **Turfjs** ``` import { Turfjs } from "diagrams-js/gis/javascript"; ``` ### gis/mobile[​](#gismobile "Direct link to gis/mobile") ![Mergin](/resources/gis/mobile/mergin.png) **Mergin** ``` import { Mergin } from "diagrams-js/gis/mobile"; ``` ![Qfield](/resources/gis/mobile/qfield.png) **Qfield** ``` import { Qfield } from "diagrams-js/gis/mobile"; ``` ![Smash](/resources/gis/mobile/smash.png) **Smash** ``` import { Smash } from "diagrams-js/gis/mobile"; ``` ### gis/ogc[​](#gisogc "Direct link to gis/ogc") ![OGC](/resources/gis/ogc/ogc.png) **OGC** ``` import { OGC } from "diagrams-js/gis/ogc"; ``` ![WFS](/resources/gis/ogc/wfs.png) **WFS** ``` import { WFS } from "diagrams-js/gis/ogc"; ``` ![WMS](/resources/gis/ogc/wms.png) **WMS** ``` import { WMS } from "diagrams-js/gis/ogc"; ``` ### gis/organization[​](#gisorganization "Direct link to gis/organization") ![Osgeo](/resources/gis/organization/osgeo.png) **Osgeo** ``` import { Osgeo } from "diagrams-js/gis/organization"; ``` ### gis/python[​](#gispython "Direct link to gis/python") ![Geopandas](/resources/gis/python/geopandas.png) **Geopandas** ``` import { Geopandas } from "diagrams-js/gis/python"; ``` ![Pysal](/resources/gis/python/pysal.png) **Pysal** ``` import { Pysal } from "diagrams-js/gis/python"; ``` ### gis/routing[​](#gisrouting "Direct link to gis/routing") ![Graphhopper](/resources/gis/routing/graphhopper.png) **Graphhopper** ``` import { Graphhopper } from "diagrams-js/gis/routing"; ``` ![Osrm](/resources/gis/routing/osrm.png) **Osrm** ``` import { Osrm } from "diagrams-js/gis/routing"; ``` ![Pgrouting](/resources/gis/routing/pgrouting.png) **Pgrouting** ``` import { Pgrouting } from "diagrams-js/gis/routing"; ``` ![Valhalla](/resources/gis/routing/valhalla.png) **Valhalla** ``` import { Valhalla } from "diagrams-js/gis/routing"; ``` ### gis/server[​](#gisserver "Direct link to gis/server") ![Actinia](/resources/gis/server/actinia.png) **Actinia** ``` import { Actinia } from "diagrams-js/gis/server"; ``` ![Baremaps](/resources/gis/server/baremaps.png) **Baremaps** ``` import { Baremaps } from "diagrams-js/gis/server"; ``` ![Deegree](/resources/gis/server/deegree.png) **Deegree** ``` import { Deegree } from "diagrams-js/gis/server"; ``` ![G3wSuite](/resources/gis/server/g3w-suite.png) **G3wSuite** ``` import { G3wSuite } from "diagrams-js/gis/server"; ``` ![Geohealthcheck](/resources/gis/server/geohealthcheck.png) **Geohealthcheck** ``` import { Geohealthcheck } from "diagrams-js/gis/server"; ``` ![Geomapfish](/resources/gis/server/geomapfish.png) **Geomapfish** ``` import { Geomapfish } from "diagrams-js/gis/server"; ``` ![Geomesa](/resources/gis/server/geomesa.png) **Geomesa** ``` import { Geomesa } from "diagrams-js/gis/server"; ``` ![Geonetwork](/resources/gis/server/geonetwork.png) **Geonetwork** ``` import { Geonetwork } from "diagrams-js/gis/server"; ``` ![Geonode](/resources/gis/server/geonode.png) **Geonode** ``` import { Geonode } from "diagrams-js/gis/server"; ``` ![Georchestra](/resources/gis/server/georchestra.png) **Georchestra** ``` import { Georchestra } from "diagrams-js/gis/server"; ``` ![Geoserver](/resources/gis/server/geoserver.png) **Geoserver** ``` import { Geoserver } from "diagrams-js/gis/server"; ``` ![Geowebcache](/resources/gis/server/geowebcache.png) **Geowebcache** ``` import { Geowebcache } from "diagrams-js/gis/server"; ``` ![Kepler](/resources/gis/server/kepler.png) **Kepler** ``` import { Kepler } from "diagrams-js/gis/server"; ``` ![Mapproxy](/resources/gis/server/mapproxy.png) **Mapproxy** ``` import { Mapproxy } from "diagrams-js/gis/server"; ``` ![Mapserver](/resources/gis/server/mapserver.png) **Mapserver** ``` import { Mapserver } from "diagrams-js/gis/server"; ``` ![Mapstore](/resources/gis/server/mapstore.png) **Mapstore** ``` import { Mapstore } from "diagrams-js/gis/server"; ``` ![Mviewer](/resources/gis/server/mviewer.png) **Mviewer** ``` import { Mviewer } from "diagrams-js/gis/server"; ``` ![Pg\_tileserv](/resources/gis/server/pg_tileserv.png) **Pg\_tileserv** ``` import { Pg_tileserv } from "diagrams-js/gis/server"; ``` ![Pycsw](/resources/gis/server/pycsw.png) **Pycsw** ``` import { Pycsw } from "diagrams-js/gis/server"; ``` ![Pygeoapi](/resources/gis/server/pygeoapi.png) **Pygeoapi** ``` import { Pygeoapi } from "diagrams-js/gis/server"; ``` ![QGISServer](/resources/gis/server/qgis-server.png) **QGISServer** ``` import { QGISServer } from "diagrams-js/gis/server"; ``` ![Zooproject](/resources/gis/server/zooproject.png) **Zooproject** ``` import { Zooproject } from "diagrams-js/gis/server"; ``` --- # IBM Node classes list for the IBM provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Analytics, DataIntegration, DataRepositories } from "diagrams-js/ibm/analytics"; import { ActionableInsight, Annotate, ApiDeveloperPortal } from "diagrams-js/ibm/applications"; const diagram = Diagram("IBM Architecture", { direction: "TB" }); const node1 = diagram.add(Analytics("Node 1")); const node2 = diagram.add(ActionableInsight("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/ibm) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### ibm/analytics[​](#ibmanalytics "Direct link to ibm/analytics") ![Analytics](/resources/ibm/analytics/analytics.png) **Analytics** ``` import { Analytics } from "diagrams-js/ibm/analytics"; ``` ![DataIntegration](/resources/ibm/analytics/data-integration.png) **DataIntegration** ``` import { DataIntegration } from "diagrams-js/ibm/analytics"; ``` ![DataRepositories](/resources/ibm/analytics/data-repositories.png) **DataRepositories** ``` import { DataRepositories } from "diagrams-js/ibm/analytics"; ``` ![DeviceAnalytics](/resources/ibm/analytics/device-analytics.png) **DeviceAnalytics** ``` import { DeviceAnalytics } from "diagrams-js/ibm/analytics"; ``` ![StreamingComputing](/resources/ibm/analytics/streaming-computing.png) **StreamingComputing** ``` import { StreamingComputing } from "diagrams-js/ibm/analytics"; ``` ### ibm/applications[​](#ibmapplications "Direct link to ibm/applications") ![ActionableInsight](/resources/ibm/applications/actionable-insight.png) **ActionableInsight** ``` import { ActionableInsight } from "diagrams-js/ibm/applications"; ``` ![Annotate](/resources/ibm/applications/annotate.png) **Annotate** ``` import { Annotate } from "diagrams-js/ibm/applications"; ``` ![ApiDeveloperPortal](/resources/ibm/applications/api-developer-portal.png) **ApiDeveloperPortal** ``` import { ApiDeveloperPortal } from "diagrams-js/ibm/applications"; ``` ![ApiPolyglotRuntimes](/resources/ibm/applications/api-polyglot-runtimes.png) **ApiPolyglotRuntimes** ``` import { ApiPolyglotRuntimes } from "diagrams-js/ibm/applications"; ``` ![AppServer](/resources/ibm/applications/app-server.png) **AppServer** ``` import { AppServer } from "diagrams-js/ibm/applications"; ``` ![ApplicationLogic](/resources/ibm/applications/application-logic.png) **ApplicationLogic** ``` import { ApplicationLogic } from "diagrams-js/ibm/applications"; ``` ![EnterpriseApplications](/resources/ibm/applications/enterprise-applications.png) **EnterpriseApplications** ``` import { EnterpriseApplications } from "diagrams-js/ibm/applications"; ``` ![Index](/resources/ibm/applications/index.png) **Index** ``` import { Index } from "diagrams-js/ibm/applications"; ``` ![IotApplication](/resources/ibm/applications/iot-application.png) **IotApplication** ``` import { IotApplication } from "diagrams-js/ibm/applications"; ``` ![Microservice](/resources/ibm/applications/microservice.png) **Microservice** ``` import { Microservice } from "diagrams-js/ibm/applications"; ``` ![MobileApp](/resources/ibm/applications/mobile-app.png) **MobileApp** ``` import { MobileApp } from "diagrams-js/ibm/applications"; ``` ![Ontology](/resources/ibm/applications/ontology.png) **Ontology** ``` import { Ontology } from "diagrams-js/ibm/applications"; ``` ![OpenSourceTools](/resources/ibm/applications/open-source-tools.png) **OpenSourceTools** ``` import { OpenSourceTools } from "diagrams-js/ibm/applications"; ``` ![RuntimeServices](/resources/ibm/applications/runtime-services.png) **RuntimeServices** ``` import { RuntimeServices } from "diagrams-js/ibm/applications"; ``` ![SaasApplications](/resources/ibm/applications/saas-applications.png) **SaasApplications** ``` import { SaasApplications } from "diagrams-js/ibm/applications"; ``` ![ServiceBroker](/resources/ibm/applications/service-broker.png) **ServiceBroker** ``` import { ServiceBroker } from "diagrams-js/ibm/applications"; ``` ![SpeechToText](/resources/ibm/applications/speech-to-text.png) **SpeechToText** ``` import { SpeechToText } from "diagrams-js/ibm/applications"; ``` ![VisualRecognition](/resources/ibm/applications/visual-recognition.png) **VisualRecognition** ``` import { VisualRecognition } from "diagrams-js/ibm/applications"; ``` ![Visualization](/resources/ibm/applications/visualization.png) **Visualization** ``` import { Visualization } from "diagrams-js/ibm/applications"; ``` ### ibm/blockchain[​](#ibmblockchain "Direct link to ibm/blockchain") ![BlockchainDeveloper](/resources/ibm/blockchain/blockchain-developer.png) **BlockchainDeveloper** ``` import { BlockchainDeveloper } from "diagrams-js/ibm/blockchain"; ``` ![Blockchain](/resources/ibm/blockchain/blockchain.png) **Blockchain** ``` import { Blockchain } from "diagrams-js/ibm/blockchain"; ``` ![CertificateAuthority](/resources/ibm/blockchain/certificate-authority.png) **CertificateAuthority** ``` import { CertificateAuthority } from "diagrams-js/ibm/blockchain"; ``` ![ClientApplication](/resources/ibm/blockchain/client-application.png) **ClientApplication** ``` import { ClientApplication } from "diagrams-js/ibm/blockchain"; ``` ![Communication](/resources/ibm/blockchain/communication.png) **Communication** ``` import { Communication } from "diagrams-js/ibm/blockchain"; ``` ![Consensus](/resources/ibm/blockchain/consensus.png) **Consensus** ``` import { Consensus } from "diagrams-js/ibm/blockchain"; ``` ![EventListener](/resources/ibm/blockchain/event-listener.png) **EventListener** ``` import { EventListener } from "diagrams-js/ibm/blockchain"; ``` ![Event](/resources/ibm/blockchain/event.png) **Event** ``` import { Event } from "diagrams-js/ibm/blockchain"; ``` ![ExistingEnterpriseSystems](/resources/ibm/blockchain/existing-enterprise-systems.png) **ExistingEnterpriseSystems** ``` import { ExistingEnterpriseSystems } from "diagrams-js/ibm/blockchain"; ``` ![HyperledgerFabric](/resources/ibm/blockchain/hyperledger-fabric.png) **HyperledgerFabric** ``` import { HyperledgerFabric } from "diagrams-js/ibm/blockchain"; ``` ![KeyManagement](/resources/ibm/blockchain/key-management.png) **KeyManagement** ``` import { KeyManagement } from "diagrams-js/ibm/blockchain"; ``` ![Ledger](/resources/ibm/blockchain/ledger.png) **Ledger** ``` import { Ledger } from "diagrams-js/ibm/blockchain"; ``` ![MembershipServicesProviderApi](/resources/ibm/blockchain/membership-services-provider-api.png) **MembershipServicesProviderApi** ``` import { MembershipServicesProviderApi } from "diagrams-js/ibm/blockchain"; ``` ![Membership](/resources/ibm/blockchain/membership.png) **Membership** ``` import { Membership } from "diagrams-js/ibm/blockchain"; ``` ![MessageBus](/resources/ibm/blockchain/message-bus.png) **MessageBus** ``` import { MessageBus } from "diagrams-js/ibm/blockchain"; ``` ![Node](/resources/ibm/blockchain/node.png) **Node** ``` import { Node } from "diagrams-js/ibm/blockchain"; ``` ![Services](/resources/ibm/blockchain/services.png) **Services** ``` import { Services } from "diagrams-js/ibm/blockchain"; ``` ![SmartContract](/resources/ibm/blockchain/smart-contract.png) **SmartContract** ``` import { SmartContract } from "diagrams-js/ibm/blockchain"; ``` ![TransactionManager](/resources/ibm/blockchain/transaction-manager.png) **TransactionManager** ``` import { TransactionManager } from "diagrams-js/ibm/blockchain"; ``` ![Wallet](/resources/ibm/blockchain/wallet.png) **Wallet** ``` import { Wallet } from "diagrams-js/ibm/blockchain"; ``` ### ibm/compute[​](#ibmcompute "Direct link to ibm/compute") ![BareMetalServer](/resources/ibm/compute/bare-metal-server.png) **BareMetalServer** ``` import { BareMetalServer } from "diagrams-js/ibm/compute"; ``` ![ImageService](/resources/ibm/compute/image-service.png) **ImageService** ``` import { ImageService } from "diagrams-js/ibm/compute"; ``` ![Instance](/resources/ibm/compute/instance.png) **Instance** ``` import { Instance } from "diagrams-js/ibm/compute"; ``` ![Key](/resources/ibm/compute/key.png) **Key** ``` import { Key } from "diagrams-js/ibm/compute"; ``` ![PowerInstance](/resources/ibm/compute/power-instance.png) **PowerInstance** ``` import { PowerInstance } from "diagrams-js/ibm/compute"; ``` ### ibm/data[​](#ibmdata "Direct link to ibm/data") ![Caches](/resources/ibm/data/caches.png) **Caches** ``` import { Caches } from "diagrams-js/ibm/data"; ``` ![Cloud](/resources/ibm/data/cloud.png) **Cloud** ``` import { Cloud } from "diagrams-js/ibm/data"; ``` ![ConversationTrainedDeployed](/resources/ibm/data/conversation-trained-deployed.png) **ConversationTrainedDeployed** ``` import { ConversationTrainedDeployed } from "diagrams-js/ibm/data"; ``` ![DataServices](/resources/ibm/data/data-services.png) **DataServices** ``` import { DataServices } from "diagrams-js/ibm/data"; ``` ![DataSources](/resources/ibm/data/data-sources.png) **DataSources** ``` import { DataSources } from "diagrams-js/ibm/data"; ``` ![DeviceIdentityService](/resources/ibm/data/device-identity-service.png) **DeviceIdentityService** ``` import { DeviceIdentityService } from "diagrams-js/ibm/data"; ``` ![DeviceRegistry](/resources/ibm/data/device-registry.png) **DeviceRegistry** ``` import { DeviceRegistry } from "diagrams-js/ibm/data"; ``` ![EnterpriseData](/resources/ibm/data/enterprise-data.png) **EnterpriseData** ``` import { EnterpriseData } from "diagrams-js/ibm/data"; ``` ![EnterpriseUserDirectory](/resources/ibm/data/enterprise-user-directory.png) **EnterpriseUserDirectory** ``` import { EnterpriseUserDirectory } from "diagrams-js/ibm/data"; ``` ![FileRepository](/resources/ibm/data/file-repository.png) **FileRepository** ``` import { FileRepository } from "diagrams-js/ibm/data"; ``` ![GroundTruth](/resources/ibm/data/ground-truth.png) **GroundTruth** ``` import { GroundTruth } from "diagrams-js/ibm/data"; ``` ![Model](/resources/ibm/data/model.png) **Model** ``` import { Model } from "diagrams-js/ibm/data"; ``` ![TmsDataInterface](/resources/ibm/data/tms-data-interface.png) **TmsDataInterface** ``` import { TmsDataInterface } from "diagrams-js/ibm/data"; ``` ### ibm/devops[​](#ibmdevops "Direct link to ibm/devops") ![ArtifactManagement](/resources/ibm/devops/artifact-management.png) **ArtifactManagement** ``` import { ArtifactManagement } from "diagrams-js/ibm/devops"; ``` ![BuildTest](/resources/ibm/devops/build-test.png) **BuildTest** ``` import { BuildTest } from "diagrams-js/ibm/devops"; ``` ![CodeEditor](/resources/ibm/devops/code-editor.png) **CodeEditor** ``` import { CodeEditor } from "diagrams-js/ibm/devops"; ``` ![CollaborativeDevelopment](/resources/ibm/devops/collaborative-development.png) **CollaborativeDevelopment** ``` import { CollaborativeDevelopment } from "diagrams-js/ibm/devops"; ``` ![ConfigurationManagement](/resources/ibm/devops/configuration-management.png) **ConfigurationManagement** ``` import { ConfigurationManagement } from "diagrams-js/ibm/devops"; ``` ![ContinuousDeploy](/resources/ibm/devops/continuous-deploy.png) **ContinuousDeploy** ``` import { ContinuousDeploy } from "diagrams-js/ibm/devops"; ``` ![ContinuousTesting](/resources/ibm/devops/continuous-testing.png) **ContinuousTesting** ``` import { ContinuousTesting } from "diagrams-js/ibm/devops"; ``` ![Devops](/resources/ibm/devops/devops.png) **Devops** ``` import { Devops } from "diagrams-js/ibm/devops"; ``` ![Provision](/resources/ibm/devops/provision.png) **Provision** ``` import { Provision } from "diagrams-js/ibm/devops"; ``` ![ReleaseManagement](/resources/ibm/devops/release-management.png) **ReleaseManagement** ``` import { ReleaseManagement } from "diagrams-js/ibm/devops"; ``` ### ibm/general[​](#ibmgeneral "Direct link to ibm/general") ![CloudMessaging](/resources/ibm/general/cloud-messaging.png) **CloudMessaging** ``` import { CloudMessaging } from "diagrams-js/ibm/general"; ``` ![CloudServices](/resources/ibm/general/cloud-services.png) **CloudServices** ``` import { CloudServices } from "diagrams-js/ibm/general"; ``` ![Cloudant](/resources/ibm/general/cloudant.png) **Cloudant** ``` import { Cloudant } from "diagrams-js/ibm/general"; ``` ![CognitiveServices](/resources/ibm/general/cognitive-services.png) **CognitiveServices** ``` import { CognitiveServices } from "diagrams-js/ibm/general"; ``` ![DataSecurity](/resources/ibm/general/data-security.png) **DataSecurity** ``` import { DataSecurity } from "diagrams-js/ibm/general"; ``` ![Enterprise](/resources/ibm/general/enterprise.png) **Enterprise** ``` import { Enterprise } from "diagrams-js/ibm/general"; ``` ![GovernanceRiskCompliance](/resources/ibm/general/governance-risk-compliance.png) **GovernanceRiskCompliance** ``` import { GovernanceRiskCompliance } from "diagrams-js/ibm/general"; ``` ![IBMContainers](/resources/ibm/general/ibm-containers.png) **IBMContainers** ``` import { IBMContainers } from "diagrams-js/ibm/general"; ``` ![IBMPublicCloud](/resources/ibm/general/ibm-public-cloud.png) **IBMPublicCloud** ``` import { IBMPublicCloud } from "diagrams-js/ibm/general"; ``` ![IdentityAccessManagement](/resources/ibm/general/identity-access-management.png) **IdentityAccessManagement** ``` import { IdentityAccessManagement } from "diagrams-js/ibm/general"; ``` ![IdentityProvider](/resources/ibm/general/identity-provider.png) **IdentityProvider** ``` import { IdentityProvider } from "diagrams-js/ibm/general"; ``` ![InfrastructureSecurity](/resources/ibm/general/infrastructure-security.png) **InfrastructureSecurity** ``` import { InfrastructureSecurity } from "diagrams-js/ibm/general"; ``` ![Internet](/resources/ibm/general/internet.png) **Internet** ``` import { Internet } from "diagrams-js/ibm/general"; ``` ![IotCloud](/resources/ibm/general/iot-cloud.png) **IotCloud** ``` import { IotCloud } from "diagrams-js/ibm/general"; ``` ![MicroservicesApplication](/resources/ibm/general/microservices-application.png) **MicroservicesApplication** ``` import { MicroservicesApplication } from "diagrams-js/ibm/general"; ``` ![MicroservicesMesh](/resources/ibm/general/microservices-mesh.png) **MicroservicesMesh** ``` import { MicroservicesMesh } from "diagrams-js/ibm/general"; ``` ![MonitoringLogging](/resources/ibm/general/monitoring-logging.png) **MonitoringLogging** ``` import { MonitoringLogging } from "diagrams-js/ibm/general"; ``` ![Monitoring](/resources/ibm/general/monitoring.png) **Monitoring** ``` import { Monitoring } from "diagrams-js/ibm/general"; ``` ![ObjectStorage](/resources/ibm/general/object-storage.png) **ObjectStorage** ``` import { ObjectStorage } from "diagrams-js/ibm/general"; ``` ![OfflineCapabilities](/resources/ibm/general/offline-capabilities.png) **OfflineCapabilities** ``` import { OfflineCapabilities } from "diagrams-js/ibm/general"; ``` ![Openwhisk](/resources/ibm/general/openwhisk.png) **Openwhisk** ``` import { Openwhisk } from "diagrams-js/ibm/general"; ``` ![PeerCloud](/resources/ibm/general/peer-cloud.png) **PeerCloud** ``` import { PeerCloud } from "diagrams-js/ibm/general"; ``` ![RetrieveRank](/resources/ibm/general/retrieve-rank.png) **RetrieveRank** ``` import { RetrieveRank } from "diagrams-js/ibm/general"; ``` ![Scalable](/resources/ibm/general/scalable.png) **Scalable** ``` import { Scalable } from "diagrams-js/ibm/general"; ``` ![ServiceDiscoveryConfiguration](/resources/ibm/general/service-discovery-configuration.png) **ServiceDiscoveryConfiguration** ``` import { ServiceDiscoveryConfiguration } from "diagrams-js/ibm/general"; ``` ![TextToSpeech](/resources/ibm/general/text-to-speech.png) **TextToSpeech** ``` import { TextToSpeech } from "diagrams-js/ibm/general"; ``` ![TransformationConnectivity](/resources/ibm/general/transformation-connectivity.png) **TransformationConnectivity** ``` import { TransformationConnectivity } from "diagrams-js/ibm/general"; ``` ### ibm/infrastructure[​](#ibminfrastructure "Direct link to ibm/infrastructure") ![Channels](/resources/ibm/infrastructure/channels.png) **Channels** ``` import { Channels } from "diagrams-js/ibm/infrastructure"; ``` ![CloudMessaging](/resources/ibm/infrastructure/cloud-messaging.png) **CloudMessaging** ``` import { CloudMessaging } from "diagrams-js/ibm/infrastructure"; ``` ![Dashboard](/resources/ibm/infrastructure/dashboard.png) **Dashboard** ``` import { Dashboard } from "diagrams-js/ibm/infrastructure"; ``` ![Diagnostics](/resources/ibm/infrastructure/diagnostics.png) **Diagnostics** ``` import { Diagnostics } from "diagrams-js/ibm/infrastructure"; ``` ![EdgeServices](/resources/ibm/infrastructure/edge-services.png) **EdgeServices** ``` import { EdgeServices } from "diagrams-js/ibm/infrastructure"; ``` ![EnterpriseMessaging](/resources/ibm/infrastructure/enterprise-messaging.png) **EnterpriseMessaging** ``` import { EnterpriseMessaging } from "diagrams-js/ibm/infrastructure"; ``` ![EventFeed](/resources/ibm/infrastructure/event-feed.png) **EventFeed** ``` import { EventFeed } from "diagrams-js/ibm/infrastructure"; ``` ![InfrastructureServices](/resources/ibm/infrastructure/infrastructure-services.png) **InfrastructureServices** ``` import { InfrastructureServices } from "diagrams-js/ibm/infrastructure"; ``` ![InterserviceCommunication](/resources/ibm/infrastructure/interservice-communication.png) **InterserviceCommunication** ``` import { InterserviceCommunication } from "diagrams-js/ibm/infrastructure"; ``` ![LoadBalancingRouting](/resources/ibm/infrastructure/load-balancing-routing.png) **LoadBalancingRouting** ``` import { LoadBalancingRouting } from "diagrams-js/ibm/infrastructure"; ``` ![MicroservicesMesh](/resources/ibm/infrastructure/microservices-mesh.png) **MicroservicesMesh** ``` import { MicroservicesMesh } from "diagrams-js/ibm/infrastructure"; ``` ![MobileBackend](/resources/ibm/infrastructure/mobile-backend.png) **MobileBackend** ``` import { MobileBackend } from "diagrams-js/ibm/infrastructure"; ``` ![MobileProviderNetwork](/resources/ibm/infrastructure/mobile-provider-network.png) **MobileProviderNetwork** ``` import { MobileProviderNetwork } from "diagrams-js/ibm/infrastructure"; ``` ![MonitoringLogging](/resources/ibm/infrastructure/monitoring-logging.png) **MonitoringLogging** ``` import { MonitoringLogging } from "diagrams-js/ibm/infrastructure"; ``` ![Monitoring](/resources/ibm/infrastructure/monitoring.png) **Monitoring** ``` import { Monitoring } from "diagrams-js/ibm/infrastructure"; ``` ![PeerServices](/resources/ibm/infrastructure/peer-services.png) **PeerServices** ``` import { PeerServices } from "diagrams-js/ibm/infrastructure"; ``` ![ServiceDiscoveryConfiguration](/resources/ibm/infrastructure/service-discovery-configuration.png) **ServiceDiscoveryConfiguration** ``` import { ServiceDiscoveryConfiguration } from "diagrams-js/ibm/infrastructure"; ``` ![TransformationConnectivity](/resources/ibm/infrastructure/transformation-connectivity.png) **TransformationConnectivity** ``` import { TransformationConnectivity } from "diagrams-js/ibm/infrastructure"; ``` ### ibm/management[​](#ibmmanagement "Direct link to ibm/management") ![AlertNotification](/resources/ibm/management/alert-notification.png) **AlertNotification** ``` import { AlertNotification } from "diagrams-js/ibm/management"; ``` ![ApiManagement](/resources/ibm/management/api-management.png) **ApiManagement** ``` import { ApiManagement } from "diagrams-js/ibm/management"; ``` ![CloudManagement](/resources/ibm/management/cloud-management.png) **CloudManagement** ``` import { CloudManagement } from "diagrams-js/ibm/management"; ``` ![ClusterManagement](/resources/ibm/management/cluster-management.png) **ClusterManagement** ``` import { ClusterManagement } from "diagrams-js/ibm/management"; ``` ![ContentManagement](/resources/ibm/management/content-management.png) **ContentManagement** ``` import { ContentManagement } from "diagrams-js/ibm/management"; ``` ![DataServices](/resources/ibm/management/data-services.png) **DataServices** ``` import { DataServices } from "diagrams-js/ibm/management"; ``` ![DeviceManagement](/resources/ibm/management/device-management.png) **DeviceManagement** ``` import { DeviceManagement } from "diagrams-js/ibm/management"; ``` ![InformationGovernance](/resources/ibm/management/information-governance.png) **InformationGovernance** ``` import { InformationGovernance } from "diagrams-js/ibm/management"; ``` ![ItServiceManagement](/resources/ibm/management/it-service-management.png) **ItServiceManagement** ``` import { ItServiceManagement } from "diagrams-js/ibm/management"; ``` ![Management](/resources/ibm/management/management.png) **Management** ``` import { Management } from "diagrams-js/ibm/management"; ``` ![MonitoringMetrics](/resources/ibm/management/monitoring-metrics.png) **MonitoringMetrics** ``` import { MonitoringMetrics } from "diagrams-js/ibm/management"; ``` ![ProcessManagement](/resources/ibm/management/process-management.png) **ProcessManagement** ``` import { ProcessManagement } from "diagrams-js/ibm/management"; ``` ![ProviderCloudPortalService](/resources/ibm/management/provider-cloud-portal-service.png) **ProviderCloudPortalService** ``` import { ProviderCloudPortalService } from "diagrams-js/ibm/management"; ``` ![PushNotifications](/resources/ibm/management/push-notifications.png) **PushNotifications** ``` import { PushNotifications } from "diagrams-js/ibm/management"; ``` ![ServiceManagementTools](/resources/ibm/management/service-management-tools.png) **ServiceManagementTools** ``` import { ServiceManagementTools } from "diagrams-js/ibm/management"; ``` ### ibm/network[​](#ibmnetwork "Direct link to ibm/network") ![Bridge](/resources/ibm/network/bridge.png) **Bridge** ``` import { Bridge } from "diagrams-js/ibm/network"; ``` ![DirectLink](/resources/ibm/network/direct-link.png) **DirectLink** ``` import { DirectLink } from "diagrams-js/ibm/network"; ``` ![Enterprise](/resources/ibm/network/enterprise.png) **Enterprise** ``` import { Enterprise } from "diagrams-js/ibm/network"; ``` ![Firewall](/resources/ibm/network/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/ibm/network"; ``` ![FloatingIp](/resources/ibm/network/floating-ip.png) **FloatingIp** ``` import { FloatingIp } from "diagrams-js/ibm/network"; ``` ![Gateway](/resources/ibm/network/gateway.png) **Gateway** ``` import { Gateway } from "diagrams-js/ibm/network"; ``` ![InternetServices](/resources/ibm/network/internet-services.png) **InternetServices** ``` import { InternetServices } from "diagrams-js/ibm/network"; ``` ![LoadBalancerListener](/resources/ibm/network/load-balancer-listener.png) **LoadBalancerListener** ``` import { LoadBalancerListener } from "diagrams-js/ibm/network"; ``` ![LoadBalancerPool](/resources/ibm/network/load-balancer-pool.png) **LoadBalancerPool** ``` import { LoadBalancerPool } from "diagrams-js/ibm/network"; ``` ![LoadBalancer](/resources/ibm/network/load-balancer.png) **LoadBalancer** ``` import { LoadBalancer } from "diagrams-js/ibm/network"; ``` ![LoadBalancingRouting](/resources/ibm/network/load-balancing-routing.png) **LoadBalancingRouting** ``` import { LoadBalancingRouting } from "diagrams-js/ibm/network"; ``` ![PublicGateway](/resources/ibm/network/public-gateway.png) **PublicGateway** ``` import { PublicGateway } from "diagrams-js/ibm/network"; ``` ![Region](/resources/ibm/network/region.png) **Region** ``` import { Region } from "diagrams-js/ibm/network"; ``` ![Router](/resources/ibm/network/router.png) **Router** ``` import { Router } from "diagrams-js/ibm/network"; ``` ![Rules](/resources/ibm/network/rules.png) **Rules** ``` import { Rules } from "diagrams-js/ibm/network"; ``` ![Subnet](/resources/ibm/network/subnet.png) **Subnet** ``` import { Subnet } from "diagrams-js/ibm/network"; ``` ![TransitGateway](/resources/ibm/network/transit-gateway.png) **TransitGateway** ``` import { TransitGateway } from "diagrams-js/ibm/network"; ``` ![Vpc](/resources/ibm/network/vpc.png) **Vpc** ``` import { Vpc } from "diagrams-js/ibm/network"; ``` ![VpnConnection](/resources/ibm/network/vpn-connection.png) **VpnConnection** ``` import { VpnConnection } from "diagrams-js/ibm/network"; ``` ![VpnGateway](/resources/ibm/network/vpn-gateway.png) **VpnGateway** ``` import { VpnGateway } from "diagrams-js/ibm/network"; ``` ![VpnPolicy](/resources/ibm/network/vpn-policy.png) **VpnPolicy** ``` import { VpnPolicy } from "diagrams-js/ibm/network"; ``` ### ibm/security[​](#ibmsecurity "Direct link to ibm/security") ![ApiSecurity](/resources/ibm/security/api-security.png) **ApiSecurity** ``` import { ApiSecurity } from "diagrams-js/ibm/security"; ``` ![BlockchainSecurityService](/resources/ibm/security/blockchain-security-service.png) **BlockchainSecurityService** ``` import { BlockchainSecurityService } from "diagrams-js/ibm/security"; ``` ![DataSecurity](/resources/ibm/security/data-security.png) **DataSecurity** ``` import { DataSecurity } from "diagrams-js/ibm/security"; ``` ![Firewall](/resources/ibm/security/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/ibm/security"; ``` ![Gateway](/resources/ibm/security/gateway.png) **Gateway** ``` import { Gateway } from "diagrams-js/ibm/security"; ``` ![GovernanceRiskCompliance](/resources/ibm/security/governance-risk-compliance.png) **GovernanceRiskCompliance** ``` import { GovernanceRiskCompliance } from "diagrams-js/ibm/security"; ``` ![IdentityAccessManagement](/resources/ibm/security/identity-access-management.png) **IdentityAccessManagement** ``` import { IdentityAccessManagement } from "diagrams-js/ibm/security"; ``` ![IdentityProvider](/resources/ibm/security/identity-provider.png) **IdentityProvider** ``` import { IdentityProvider } from "diagrams-js/ibm/security"; ``` ![InfrastructureSecurity](/resources/ibm/security/infrastructure-security.png) **InfrastructureSecurity** ``` import { InfrastructureSecurity } from "diagrams-js/ibm/security"; ``` ![PhysicalSecurity](/resources/ibm/security/physical-security.png) **PhysicalSecurity** ``` import { PhysicalSecurity } from "diagrams-js/ibm/security"; ``` ![SecurityMonitoringIntelligence](/resources/ibm/security/security-monitoring-intelligence.png) **SecurityMonitoringIntelligence** ``` import { SecurityMonitoringIntelligence } from "diagrams-js/ibm/security"; ``` ![SecurityServices](/resources/ibm/security/security-services.png) **SecurityServices** ``` import { SecurityServices } from "diagrams-js/ibm/security"; ``` ![TrustendComputing](/resources/ibm/security/trustend-computing.png) **TrustendComputing** ``` import { TrustendComputing } from "diagrams-js/ibm/security"; ``` ![Vpn](/resources/ibm/security/vpn.png) **Vpn** ``` import { Vpn } from "diagrams-js/ibm/security"; ``` ### ibm/social[​](#ibmsocial "Direct link to ibm/social") ![Communities](/resources/ibm/social/communities.png) **Communities** ``` import { Communities } from "diagrams-js/ibm/social"; ``` ![FileSync](/resources/ibm/social/file-sync.png) **FileSync** ``` import { FileSync } from "diagrams-js/ibm/social"; ``` ![LiveCollaboration](/resources/ibm/social/live-collaboration.png) **LiveCollaboration** ``` import { LiveCollaboration } from "diagrams-js/ibm/social"; ``` ![Messaging](/resources/ibm/social/messaging.png) **Messaging** ``` import { Messaging } from "diagrams-js/ibm/social"; ``` ![Networking](/resources/ibm/social/networking.png) **Networking** ``` import { Networking } from "diagrams-js/ibm/social"; ``` ### ibm/storage[​](#ibmstorage "Direct link to ibm/storage") ![BlockStorage](/resources/ibm/storage/block-storage.png) **BlockStorage** ``` import { BlockStorage } from "diagrams-js/ibm/storage"; ``` ![ObjectStorage](/resources/ibm/storage/object-storage.png) **ObjectStorage** ``` import { ObjectStorage } from "diagrams-js/ibm/storage"; ``` ### ibm/user[​](#ibmuser "Direct link to ibm/user") ![Browser](/resources/ibm/user/browser.png) **Browser** ``` import { Browser } from "diagrams-js/ibm/user"; ``` ![Device](/resources/ibm/user/device.png) **Device** ``` import { Device } from "diagrams-js/ibm/user"; ``` ![IntegratedDigitalExperiences](/resources/ibm/user/integrated-digital-experiences.png) **IntegratedDigitalExperiences** ``` import { IntegratedDigitalExperiences } from "diagrams-js/ibm/user"; ``` ![PhysicalEntity](/resources/ibm/user/physical-entity.png) **PhysicalEntity** ``` import { PhysicalEntity } from "diagrams-js/ibm/user"; ``` ![Sensor](/resources/ibm/user/sensor.png) **Sensor** ``` import { Sensor } from "diagrams-js/ibm/user"; ``` ![User](/resources/ibm/user/user.png) **User** ``` import { User } from "diagrams-js/ibm/user"; ``` --- # Kubernetes Node classes list for the Kubernetes provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { ChaosMesh, LitmusChaos } from "diagrams-js/k8s/chaos"; import { HPA, Limits, Quota } from "diagrams-js/k8s/clusterconfig"; const diagram = Diagram("Kubernetes Architecture", { direction: "TB" }); const node1 = diagram.add(ChaosMesh("Node 1")); const node2 = diagram.add(HPA("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/k8s) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### k8s/chaos[​](#k8schaos "Direct link to k8s/chaos") ![ChaosMesh](/resources/k8s/chaos/chaos-mesh.png) **ChaosMesh** ``` import { ChaosMesh } from "diagrams-js/k8s/chaos"; ``` ![LitmusChaos](/resources/k8s/chaos/litmus-chaos.png) **LitmusChaos** ``` import { LitmusChaos } from "diagrams-js/k8s/chaos"; ``` ### k8s/clusterconfig[​](#k8sclusterconfig "Direct link to k8s/clusterconfig") ![HPA](/resources/k8s/clusterconfig/hpa.png) **HPA** ``` import { HPA } from "diagrams-js/k8s/clusterconfig"; ``` ![Limits](/resources/k8s/clusterconfig/limits.png) **Limits** ``` import { Limits } from "diagrams-js/k8s/clusterconfig"; ``` ![Quota](/resources/k8s/clusterconfig/quota.png) **Quota** ``` import { Quota } from "diagrams-js/k8s/clusterconfig"; ``` ### k8s/compute[​](#k8scompute "Direct link to k8s/compute") ![Cronjob](/resources/k8s/compute/cronjob.png) **Cronjob** ``` import { Cronjob } from "diagrams-js/k8s/compute"; ``` ![Deploy](/resources/k8s/compute/deploy.png) **Deploy** ``` import { Deploy } from "diagrams-js/k8s/compute"; ``` ![DS](/resources/k8s/compute/ds.png) **DS** ``` import { DS } from "diagrams-js/k8s/compute"; ``` ![Job](/resources/k8s/compute/job.png) **Job** ``` import { Job } from "diagrams-js/k8s/compute"; ``` ![Pod](/resources/k8s/compute/pod.png) **Pod** ``` import { Pod } from "diagrams-js/k8s/compute"; ``` ![RS](/resources/k8s/compute/rs.png) **RS** ``` import { RS } from "diagrams-js/k8s/compute"; ``` ![STS](/resources/k8s/compute/sts.png) **STS** ``` import { STS } from "diagrams-js/k8s/compute"; ``` ### k8s/controlplane[​](#k8scontrolplane "Direct link to k8s/controlplane") ![API](/resources/k8s/controlplane/api.png) **API** ``` import { API } from "diagrams-js/k8s/controlplane"; ``` **CCM** ``` import { CCM } from "diagrams-js/k8s/controlplane"; ``` **CM** ``` import { CM } from "diagrams-js/k8s/controlplane"; ``` ![KProxy](/resources/k8s/controlplane/k-proxy.png) **KProxy** ``` import { KProxy } from "diagrams-js/k8s/controlplane"; ``` ![Kubelet](/resources/k8s/controlplane/kubelet.png) **Kubelet** ``` import { Kubelet } from "diagrams-js/k8s/controlplane"; ``` ![Sched](/resources/k8s/controlplane/sched.png) **Sched** ``` import { Sched } from "diagrams-js/k8s/controlplane"; ``` ### k8s/ecosystem[​](#k8secosystem "Direct link to k8s/ecosystem") ![ExternalDns](/resources/k8s/ecosystem/external-dns.png) **ExternalDns** ``` import { ExternalDns } from "diagrams-js/k8s/ecosystem"; ``` ![Helm](/resources/k8s/ecosystem/helm.png) **Helm** ``` import { Helm } from "diagrams-js/k8s/ecosystem"; ``` ![Krew](/resources/k8s/ecosystem/krew.png) **Krew** ``` import { Krew } from "diagrams-js/k8s/ecosystem"; ``` ![Kustomize](/resources/k8s/ecosystem/kustomize.png) **Kustomize** ``` import { Kustomize } from "diagrams-js/k8s/ecosystem"; ``` ### k8s/group[​](#k8sgroup "Direct link to k8s/group") ![NS](/resources/k8s/group/ns.png) **NS** ``` import { NS } from "diagrams-js/k8s/group"; ``` ### k8s/infra[​](#k8sinfra "Direct link to k8s/infra") ![ETCD](/resources/k8s/infra/etcd.png) **ETCD** ``` import { ETCD } from "diagrams-js/k8s/infra"; ``` ![Master](/resources/k8s/infra/master.png) **Master** ``` import { Master } from "diagrams-js/k8s/infra"; ``` ![Node](/resources/k8s/infra/node.png) **Node** ``` import { Node } from "diagrams-js/k8s/infra"; ``` ### k8s/network[​](#k8snetwork "Direct link to k8s/network") ![Ep](/resources/k8s/network/ep.png) **Ep** ``` import { Ep } from "diagrams-js/k8s/network"; ``` ![Ing](/resources/k8s/network/ing.png) **Ing** ``` import { Ing } from "diagrams-js/k8s/network"; ``` ![Netpol](/resources/k8s/network/netpol.png) **Netpol** ``` import { Netpol } from "diagrams-js/k8s/network"; ``` ![SVC](/resources/k8s/network/svc.png) **SVC** ``` import { SVC } from "diagrams-js/k8s/network"; ``` ### k8s/others[​](#k8sothers "Direct link to k8s/others") ![CRD](/resources/k8s/others/crd.png) **CRD** ``` import { CRD } from "diagrams-js/k8s/others"; ``` ![PSP](/resources/k8s/others/psp.png) **PSP** ``` import { PSP } from "diagrams-js/k8s/others"; ``` ### k8s/podconfig[​](#k8spodconfig "Direct link to k8s/podconfig") ![CM](/resources/k8s/podconfig/cm.png) **CM** ``` import { CM } from "diagrams-js/k8s/podconfig"; ``` ![Secret](/resources/k8s/podconfig/secret.png) **Secret** ``` import { Secret } from "diagrams-js/k8s/podconfig"; ``` ### k8s/rbac[​](#k8srbac "Direct link to k8s/rbac") ![CRole](/resources/k8s/rbac/c-role.png) **CRole** ``` import { CRole } from "diagrams-js/k8s/rbac"; ``` ![CRB](/resources/k8s/rbac/crb.png) **CRB** ``` import { CRB } from "diagrams-js/k8s/rbac"; ``` ![Group](/resources/k8s/rbac/group.png) **Group** ``` import { Group } from "diagrams-js/k8s/rbac"; ``` ![RB](/resources/k8s/rbac/rb.png) **RB** ``` import { RB } from "diagrams-js/k8s/rbac"; ``` ![Role](/resources/k8s/rbac/role.png) **Role** ``` import { Role } from "diagrams-js/k8s/rbac"; ``` ![SA](/resources/k8s/rbac/sa.png) **SA** ``` import { SA } from "diagrams-js/k8s/rbac"; ``` ![User](/resources/k8s/rbac/user.png) **User** ``` import { User } from "diagrams-js/k8s/rbac"; ``` ### k8s/storage[​](#k8sstorage "Direct link to k8s/storage") ![PV](/resources/k8s/storage/pv.png) **PV** ``` import { PV } from "diagrams-js/k8s/storage"; ``` ![PVC](/resources/k8s/storage/pvc.png) **PVC** ``` import { PVC } from "diagrams-js/k8s/storage"; ``` ![SC](/resources/k8s/storage/sc.png) **SC** ``` import { SC } from "diagrams-js/k8s/storage"; ``` ![Vol](/resources/k8s/storage/vol.png) **Vol** ``` import { Vol } from "diagrams-js/k8s/storage"; ``` --- # OCI Node classes list for the OCI provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { AutoscaleWhite, Autoscale, BMWhite } from "diagrams-js/oci/compute"; import { BackboneWhite, Backbone, CDNWhite } from "diagrams-js/oci/connectivity"; const diagram = Diagram("OCI Architecture", { direction: "TB" }); const node1 = diagram.add(AutoscaleWhite("Node 1")); const node2 = diagram.add(BackboneWhite("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/oci) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### oci/compute[​](#ocicompute "Direct link to oci/compute") ![AutoscaleWhite](/resources/oci/compute/autoscale-white.png) **AutoscaleWhite** ``` import { AutoscaleWhite } from "diagrams-js/oci/compute"; ``` ![Autoscale](/resources/oci/compute/autoscale.png) **Autoscale** ``` import { Autoscale } from "diagrams-js/oci/compute"; ``` ![BMWhite](/resources/oci/compute/bm-white.png) **BMWhite** ``` import { BMWhite } from "diagrams-js/oci/compute"; ``` ![BM](/resources/oci/compute/bm.png) **BM** ``` import { BM } from "diagrams-js/oci/compute"; ``` ![ContainerWhite](/resources/oci/compute/container-white.png) **ContainerWhite** ``` import { ContainerWhite } from "diagrams-js/oci/compute"; ``` ![Container](/resources/oci/compute/container.png) **Container** ``` import { Container } from "diagrams-js/oci/compute"; ``` ![FunctionsWhite](/resources/oci/compute/functions-white.png) **FunctionsWhite** ``` import { FunctionsWhite } from "diagrams-js/oci/compute"; ``` ![Functions](/resources/oci/compute/functions.png) **Functions** ``` import { Functions } from "diagrams-js/oci/compute"; ``` ![InstancePoolsWhite](/resources/oci/compute/instance-pools-white.png) **InstancePoolsWhite** ``` import { InstancePoolsWhite } from "diagrams-js/oci/compute"; ``` ![InstancePools](/resources/oci/compute/instance-pools.png) **InstancePools** ``` import { InstancePools } from "diagrams-js/oci/compute"; ``` ![OCIRWhite](/resources/oci/compute/ocir-white.png) **OCIRWhite** ``` import { OCIRWhite } from "diagrams-js/oci/compute"; ``` ![OCIR](/resources/oci/compute/ocir.png) **OCIR** ``` import { OCIR } from "diagrams-js/oci/compute"; ``` ![OKEWhite](/resources/oci/compute/oke-white.png) **OKEWhite** ``` import { OKEWhite } from "diagrams-js/oci/compute"; ``` ![OKE](/resources/oci/compute/oke.png) **OKE** ``` import { OKE } from "diagrams-js/oci/compute"; ``` ![VMWhite](/resources/oci/compute/vm-white.png) **VMWhite** ``` import { VMWhite } from "diagrams-js/oci/compute"; ``` ![VM](/resources/oci/compute/vm.png) **VM** ``` import { VM } from "diagrams-js/oci/compute"; ``` ### oci/connectivity[​](#ociconnectivity "Direct link to oci/connectivity") ![BackboneWhite](/resources/oci/connectivity/backbone-white.png) **BackboneWhite** ``` import { BackboneWhite } from "diagrams-js/oci/connectivity"; ``` ![Backbone](/resources/oci/connectivity/backbone.png) **Backbone** ``` import { Backbone } from "diagrams-js/oci/connectivity"; ``` ![CDNWhite](/resources/oci/connectivity/cdn-white.png) **CDNWhite** ``` import { CDNWhite } from "diagrams-js/oci/connectivity"; ``` ![CDN](/resources/oci/connectivity/cdn.png) **CDN** ``` import { CDN } from "diagrams-js/oci/connectivity"; ``` ![CustomerDatacenter](/resources/oci/connectivity/customer-datacenter.png) **CustomerDatacenter** ``` import { CustomerDatacenter } from "diagrams-js/oci/connectivity"; ``` ![CustomerDatacntrWhite](/resources/oci/connectivity/customer-datacntr-white.png) **CustomerDatacntrWhite** ``` import { CustomerDatacntrWhite } from "diagrams-js/oci/connectivity"; ``` ![CustomerPremisesWhite](/resources/oci/connectivity/customer-premises-white.png) **CustomerPremisesWhite** ``` import { CustomerPremisesWhite } from "diagrams-js/oci/connectivity"; ``` ![CustomerPremises](/resources/oci/connectivity/customer-premises.png) **CustomerPremises** ``` import { CustomerPremises } from "diagrams-js/oci/connectivity"; ``` ![DisconnectedRegionsWhite](/resources/oci/connectivity/disconnected-regions-white.png) **DisconnectedRegionsWhite** ``` import { DisconnectedRegionsWhite } from "diagrams-js/oci/connectivity"; ``` ![DisconnectedRegions](/resources/oci/connectivity/disconnected-regions.png) **DisconnectedRegions** ``` import { DisconnectedRegions } from "diagrams-js/oci/connectivity"; ``` ![DNSWhite](/resources/oci/connectivity/dns-white.png) **DNSWhite** ``` import { DNSWhite } from "diagrams-js/oci/connectivity"; ``` ![DNS](/resources/oci/connectivity/dns.png) **DNS** ``` import { DNS } from "diagrams-js/oci/connectivity"; ``` ![FastConnectWhite](/resources/oci/connectivity/fast-connect-white.png) **FastConnectWhite** ``` import { FastConnectWhite } from "diagrams-js/oci/connectivity"; ``` ![FastConnect](/resources/oci/connectivity/fast-connect.png) **FastConnect** ``` import { FastConnect } from "diagrams-js/oci/connectivity"; ``` ![NATGatewayWhite](/resources/oci/connectivity/nat-gateway-white.png) **NATGatewayWhite** ``` import { NATGatewayWhite } from "diagrams-js/oci/connectivity"; ``` ![NATGateway](/resources/oci/connectivity/nat-gateway.png) **NATGateway** ``` import { NATGateway } from "diagrams-js/oci/connectivity"; ``` ![VPNWhite](/resources/oci/connectivity/vpn-white.png) **VPNWhite** ``` import { VPNWhite } from "diagrams-js/oci/connectivity"; ``` ![VPN](/resources/oci/connectivity/vpn.png) **VPN** ``` import { VPN } from "diagrams-js/oci/connectivity"; ``` ### oci/database[​](#ocidatabase "Direct link to oci/database") ![AutonomousWhite](/resources/oci/database/autonomous-white.png) **AutonomousWhite** ``` import { AutonomousWhite } from "diagrams-js/oci/database"; ``` ![Autonomous](/resources/oci/database/autonomous.png) **Autonomous** ``` import { Autonomous } from "diagrams-js/oci/database"; ``` ![BigdataServiceWhite](/resources/oci/database/bigdata-service-white.png) **BigdataServiceWhite** ``` import { BigdataServiceWhite } from "diagrams-js/oci/database"; ``` ![BigdataService](/resources/oci/database/bigdata-service.png) **BigdataService** ``` import { BigdataService } from "diagrams-js/oci/database"; ``` ![DatabaseServiceWhite](/resources/oci/database/database-service-white.png) **DatabaseServiceWhite** ``` import { DatabaseServiceWhite } from "diagrams-js/oci/database"; ``` ![DatabaseService](/resources/oci/database/database-service.png) **DatabaseService** ``` import { DatabaseService } from "diagrams-js/oci/database"; ``` ![DataflowApacheWhite](/resources/oci/database/dataflow-apache-white.png) **DataflowApacheWhite** ``` import { DataflowApacheWhite } from "diagrams-js/oci/database"; ``` ![DataflowApache](/resources/oci/database/dataflow-apache.png) **DataflowApache** ``` import { DataflowApache } from "diagrams-js/oci/database"; ``` ![DcatWhite](/resources/oci/database/dcat-white.png) **DcatWhite** ``` import { DcatWhite } from "diagrams-js/oci/database"; ``` ![Dcat](/resources/oci/database/dcat.png) **Dcat** ``` import { Dcat } from "diagrams-js/oci/database"; ``` ![DisWhite](/resources/oci/database/dis-white.png) **DisWhite** ``` import { DisWhite } from "diagrams-js/oci/database"; ``` ![Dis](/resources/oci/database/dis.png) **Dis** ``` import { Dis } from "diagrams-js/oci/database"; ``` ![DMSWhite](/resources/oci/database/dms-white.png) **DMSWhite** ``` import { DMSWhite } from "diagrams-js/oci/database"; ``` ![DMS](/resources/oci/database/dms.png) **DMS** ``` import { DMS } from "diagrams-js/oci/database"; ``` ![ScienceWhite](/resources/oci/database/science-white.png) **ScienceWhite** ``` import { ScienceWhite } from "diagrams-js/oci/database"; ``` ![Science](/resources/oci/database/science.png) **Science** ``` import { Science } from "diagrams-js/oci/database"; ``` ![StreamWhite](/resources/oci/database/stream-white.png) **StreamWhite** ``` import { StreamWhite } from "diagrams-js/oci/database"; ``` ![Stream](/resources/oci/database/stream.png) **Stream** ``` import { Stream } from "diagrams-js/oci/database"; ``` ### oci/devops[​](#ocidevops "Direct link to oci/devops") ![APIGatewayWhite](/resources/oci/devops/api-gateway-white.png) **APIGatewayWhite** ``` import { APIGatewayWhite } from "diagrams-js/oci/devops"; ``` ![APIGateway](/resources/oci/devops/api-gateway.png) **APIGateway** ``` import { APIGateway } from "diagrams-js/oci/devops"; ``` ![APIServiceWhite](/resources/oci/devops/api-service-white.png) **APIServiceWhite** ``` import { APIServiceWhite } from "diagrams-js/oci/devops"; ``` ![APIService](/resources/oci/devops/api-service.png) **APIService** ``` import { APIService } from "diagrams-js/oci/devops"; ``` ![ResourceMgmtWhite](/resources/oci/devops/resource-mgmt-white.png) **ResourceMgmtWhite** ``` import { ResourceMgmtWhite } from "diagrams-js/oci/devops"; ``` ![ResourceMgmt](/resources/oci/devops/resource-mgmt.png) **ResourceMgmt** ``` import { ResourceMgmt } from "diagrams-js/oci/devops"; ``` ### oci/governance[​](#ocigovernance "Direct link to oci/governance") ![AuditWhite](/resources/oci/governance/audit-white.png) **AuditWhite** ``` import { AuditWhite } from "diagrams-js/oci/governance"; ``` ![Audit](/resources/oci/governance/audit.png) **Audit** ``` import { Audit } from "diagrams-js/oci/governance"; ``` ![CompartmentsWhite](/resources/oci/governance/compartments-white.png) **CompartmentsWhite** ``` import { CompartmentsWhite } from "diagrams-js/oci/governance"; ``` ![Compartments](/resources/oci/governance/compartments.png) **Compartments** ``` import { Compartments } from "diagrams-js/oci/governance"; ``` ![GroupsWhite](/resources/oci/governance/groups-white.png) **GroupsWhite** ``` import { GroupsWhite } from "diagrams-js/oci/governance"; ``` ![Groups](/resources/oci/governance/groups.png) **Groups** ``` import { Groups } from "diagrams-js/oci/governance"; ``` ![LoggingWhite](/resources/oci/governance/logging-white.png) **LoggingWhite** ``` import { LoggingWhite } from "diagrams-js/oci/governance"; ``` ![Logging](/resources/oci/governance/logging.png) **Logging** ``` import { Logging } from "diagrams-js/oci/governance"; ``` ![OCIDWhite](/resources/oci/governance/ocid-white.png) **OCIDWhite** ``` import { OCIDWhite } from "diagrams-js/oci/governance"; ``` ![OCID](/resources/oci/governance/ocid.png) **OCID** ``` import { OCID } from "diagrams-js/oci/governance"; ``` ![PoliciesWhite](/resources/oci/governance/policies-white.png) **PoliciesWhite** ``` import { PoliciesWhite } from "diagrams-js/oci/governance"; ``` ![Policies](/resources/oci/governance/policies.png) **Policies** ``` import { Policies } from "diagrams-js/oci/governance"; ``` ![TaggingWhite](/resources/oci/governance/tagging-white.png) **TaggingWhite** ``` import { TaggingWhite } from "diagrams-js/oci/governance"; ``` ![Tagging](/resources/oci/governance/tagging.png) **Tagging** ``` import { Tagging } from "diagrams-js/oci/governance"; ``` ### oci/monitoring[​](#ocimonitoring "Direct link to oci/monitoring") ![AlarmWhite](/resources/oci/monitoring/alarm-white.png) **AlarmWhite** ``` import { AlarmWhite } from "diagrams-js/oci/monitoring"; ``` ![Alarm](/resources/oci/monitoring/alarm.png) **Alarm** ``` import { Alarm } from "diagrams-js/oci/monitoring"; ``` ![EmailWhite](/resources/oci/monitoring/email-white.png) **EmailWhite** ``` import { EmailWhite } from "diagrams-js/oci/monitoring"; ``` ![Email](/resources/oci/monitoring/email.png) **Email** ``` import { Email } from "diagrams-js/oci/monitoring"; ``` ![EventsWhite](/resources/oci/monitoring/events-white.png) **EventsWhite** ``` import { EventsWhite } from "diagrams-js/oci/monitoring"; ``` ![Events](/resources/oci/monitoring/events.png) **Events** ``` import { Events } from "diagrams-js/oci/monitoring"; ``` ![HealthCheckWhite](/resources/oci/monitoring/health-check-white.png) **HealthCheckWhite** ``` import { HealthCheckWhite } from "diagrams-js/oci/monitoring"; ``` ![HealthCheck](/resources/oci/monitoring/health-check.png) **HealthCheck** ``` import { HealthCheck } from "diagrams-js/oci/monitoring"; ``` ![NotificationsWhite](/resources/oci/monitoring/notifications-white.png) **NotificationsWhite** ``` import { NotificationsWhite } from "diagrams-js/oci/monitoring"; ``` ![Notifications](/resources/oci/monitoring/notifications.png) **Notifications** ``` import { Notifications } from "diagrams-js/oci/monitoring"; ``` ![QueueWhite](/resources/oci/monitoring/queue-white.png) **QueueWhite** ``` import { QueueWhite } from "diagrams-js/oci/monitoring"; ``` ![Queue](/resources/oci/monitoring/queue.png) **Queue** ``` import { Queue } from "diagrams-js/oci/monitoring"; ``` ![SearchWhite](/resources/oci/monitoring/search-white.png) **SearchWhite** ``` import { SearchWhite } from "diagrams-js/oci/monitoring"; ``` ![Search](/resources/oci/monitoring/search.png) **Search** ``` import { Search } from "diagrams-js/oci/monitoring"; ``` ![TelemetryWhite](/resources/oci/monitoring/telemetry-white.png) **TelemetryWhite** ``` import { TelemetryWhite } from "diagrams-js/oci/monitoring"; ``` ![Telemetry](/resources/oci/monitoring/telemetry.png) **Telemetry** ``` import { Telemetry } from "diagrams-js/oci/monitoring"; ``` ![WorkflowWhite](/resources/oci/monitoring/workflow-white.png) **WorkflowWhite** ``` import { WorkflowWhite } from "diagrams-js/oci/monitoring"; ``` ![Workflow](/resources/oci/monitoring/workflow.png) **Workflow** ``` import { Workflow } from "diagrams-js/oci/monitoring"; ``` ### oci/network[​](#ocinetwork "Direct link to oci/network") ![DrgWhite](/resources/oci/network/drg-white.png) **DrgWhite** ``` import { DrgWhite } from "diagrams-js/oci/network"; ``` ![Drg](/resources/oci/network/drg.png) **Drg** ``` import { Drg } from "diagrams-js/oci/network"; ``` ![FirewallWhite](/resources/oci/network/firewall-white.png) **FirewallWhite** ``` import { FirewallWhite } from "diagrams-js/oci/network"; ``` ![Firewall](/resources/oci/network/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/oci/network"; ``` ![InternetGatewayWhite](/resources/oci/network/internet-gateway-white.png) **InternetGatewayWhite** ``` import { InternetGatewayWhite } from "diagrams-js/oci/network"; ``` ![InternetGateway](/resources/oci/network/internet-gateway.png) **InternetGateway** ``` import { InternetGateway } from "diagrams-js/oci/network"; ``` ![LoadBalancerWhite](/resources/oci/network/load-balancer-white.png) **LoadBalancerWhite** ``` import { LoadBalancerWhite } from "diagrams-js/oci/network"; ``` ![LoadBalancer](/resources/oci/network/load-balancer.png) **LoadBalancer** ``` import { LoadBalancer } from "diagrams-js/oci/network"; ``` ![RouteTableWhite](/resources/oci/network/route-table-white.png) **RouteTableWhite** ``` import { RouteTableWhite } from "diagrams-js/oci/network"; ``` ![RouteTable](/resources/oci/network/route-table.png) **RouteTable** ``` import { RouteTable } from "diagrams-js/oci/network"; ``` ![SecurityListsWhite](/resources/oci/network/security-lists-white.png) **SecurityListsWhite** ``` import { SecurityListsWhite } from "diagrams-js/oci/network"; ``` ![SecurityLists](/resources/oci/network/security-lists.png) **SecurityLists** ``` import { SecurityLists } from "diagrams-js/oci/network"; ``` ![ServiceGatewayWhite](/resources/oci/network/service-gateway-white.png) **ServiceGatewayWhite** ``` import { ServiceGatewayWhite } from "diagrams-js/oci/network"; ``` ![ServiceGateway](/resources/oci/network/service-gateway.png) **ServiceGateway** ``` import { ServiceGateway } from "diagrams-js/oci/network"; ``` ![VcnWhite](/resources/oci/network/vcn-white.png) **VcnWhite** ``` import { VcnWhite } from "diagrams-js/oci/network"; ``` ![Vcn](/resources/oci/network/vcn.png) **Vcn** ``` import { Vcn } from "diagrams-js/oci/network"; ``` ### oci/security[​](#ocisecurity "Direct link to oci/security") ![CloudGuardWhite](/resources/oci/security/cloud-guard-white.png) **CloudGuardWhite** ``` import { CloudGuardWhite } from "diagrams-js/oci/security"; ``` ![CloudGuard](/resources/oci/security/cloud-guard.png) **CloudGuard** ``` import { CloudGuard } from "diagrams-js/oci/security"; ``` ![DDOSWhite](/resources/oci/security/ddos-white.png) **DDOSWhite** ``` import { DDOSWhite } from "diagrams-js/oci/security"; ``` ![DDOS](/resources/oci/security/ddos.png) **DDOS** ``` import { DDOS } from "diagrams-js/oci/security"; ``` ![EncryptionWhite](/resources/oci/security/encryption-white.png) **EncryptionWhite** ``` import { EncryptionWhite } from "diagrams-js/oci/security"; ``` ![Encryption](/resources/oci/security/encryption.png) **Encryption** ``` import { Encryption } from "diagrams-js/oci/security"; ``` ![IDAccessWhite](/resources/oci/security/id-access-white.png) **IDAccessWhite** ``` import { IDAccessWhite } from "diagrams-js/oci/security"; ``` ![IDAccess](/resources/oci/security/id-access.png) **IDAccess** ``` import { IDAccess } from "diagrams-js/oci/security"; ``` ![KeyManagementWhite](/resources/oci/security/key-management-white.png) **KeyManagementWhite** ``` import { KeyManagementWhite } from "diagrams-js/oci/security"; ``` ![KeyManagement](/resources/oci/security/key-management.png) **KeyManagement** ``` import { KeyManagement } from "diagrams-js/oci/security"; ``` ![MaxSecurityZoneWhite](/resources/oci/security/max-security-zone-white.png) **MaxSecurityZoneWhite** ``` import { MaxSecurityZoneWhite } from "diagrams-js/oci/security"; ``` ![MaxSecurityZone](/resources/oci/security/max-security-zone.png) **MaxSecurityZone** ``` import { MaxSecurityZone } from "diagrams-js/oci/security"; ``` ![VaultWhite](/resources/oci/security/vault-white.png) **VaultWhite** ``` import { VaultWhite } from "diagrams-js/oci/security"; ``` ![Vault](/resources/oci/security/vault.png) **Vault** ``` import { Vault } from "diagrams-js/oci/security"; ``` ![WAFWhite](/resources/oci/security/waf-white.png) **WAFWhite** ``` import { WAFWhite } from "diagrams-js/oci/security"; ``` ![WAF](/resources/oci/security/waf.png) **WAF** ``` import { WAF } from "diagrams-js/oci/security"; ``` ### oci/storage[​](#ocistorage "Direct link to oci/storage") ![BackupRestoreWhite](/resources/oci/storage/backup-restore-white.png) **BackupRestoreWhite** ``` import { BackupRestoreWhite } from "diagrams-js/oci/storage"; ``` ![BackupRestore](/resources/oci/storage/backup-restore.png) **BackupRestore** ``` import { BackupRestore } from "diagrams-js/oci/storage"; ``` ![BlockStorageCloneWhite](/resources/oci/storage/block-storage-clone-white.png) **BlockStorageCloneWhite** ``` import { BlockStorageCloneWhite } from "diagrams-js/oci/storage"; ``` ![BlockStorageClone](/resources/oci/storage/block-storage-clone.png) **BlockStorageClone** ``` import { BlockStorageClone } from "diagrams-js/oci/storage"; ``` ![BlockStorageWhite](/resources/oci/storage/block-storage-white.png) **BlockStorageWhite** ``` import { BlockStorageWhite } from "diagrams-js/oci/storage"; ``` ![BlockStorage](/resources/oci/storage/block-storage.png) **BlockStorage** ``` import { BlockStorage } from "diagrams-js/oci/storage"; ``` ![BucketsWhite](/resources/oci/storage/buckets-white.png) **BucketsWhite** ``` import { BucketsWhite } from "diagrams-js/oci/storage"; ``` ![Buckets](/resources/oci/storage/buckets.png) **Buckets** ``` import { Buckets } from "diagrams-js/oci/storage"; ``` ![DataTransferWhite](/resources/oci/storage/data-transfer-white.png) **DataTransferWhite** ``` import { DataTransferWhite } from "diagrams-js/oci/storage"; ``` ![DataTransfer](/resources/oci/storage/data-transfer.png) **DataTransfer** ``` import { DataTransfer } from "diagrams-js/oci/storage"; ``` ![ElasticPerformanceWhite](/resources/oci/storage/elastic-performance-white.png) **ElasticPerformanceWhite** ``` import { ElasticPerformanceWhite } from "diagrams-js/oci/storage"; ``` ![ElasticPerformance](/resources/oci/storage/elastic-performance.png) **ElasticPerformance** ``` import { ElasticPerformance } from "diagrams-js/oci/storage"; ``` ![FileStorageWhite](/resources/oci/storage/file-storage-white.png) **FileStorageWhite** ``` import { FileStorageWhite } from "diagrams-js/oci/storage"; ``` ![FileStorage](/resources/oci/storage/file-storage.png) **FileStorage** ``` import { FileStorage } from "diagrams-js/oci/storage"; ``` ![ObjectStorageWhite](/resources/oci/storage/object-storage-white.png) **ObjectStorageWhite** ``` import { ObjectStorageWhite } from "diagrams-js/oci/storage"; ``` ![ObjectStorage](/resources/oci/storage/object-storage.png) **ObjectStorage** ``` import { ObjectStorage } from "diagrams-js/oci/storage"; ``` ![StorageGatewayWhite](/resources/oci/storage/storage-gateway-white.png) **StorageGatewayWhite** ``` import { StorageGatewayWhite } from "diagrams-js/oci/storage"; ``` ![StorageGateway](/resources/oci/storage/storage-gateway.png) **StorageGateway** ``` import { StorageGateway } from "diagrams-js/oci/storage"; ``` --- # On-Premises Node classes list for the On-Premises provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Fluentd, Vector } from "diagrams-js/onprem/aggregator"; import { Beam, Databricks, Dbt } from "diagrams-js/onprem/analytics"; const diagram = Diagram("On-Premises Architecture", { direction: "TB" }); const node1 = diagram.add(Fluentd("Node 1")); const node2 = diagram.add(Beam("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/onprem) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### onprem/aggregator[​](#onpremaggregator "Direct link to onprem/aggregator") ![Fluentd](/resources/onprem/aggregator/fluentd.png) **Fluentd** ``` import { Fluentd } from "diagrams-js/onprem/aggregator"; ``` ![Vector](/resources/onprem/aggregator/vector.png) **Vector** ``` import { Vector } from "diagrams-js/onprem/aggregator"; ``` ### onprem/analytics[​](#onpremanalytics "Direct link to onprem/analytics") ![Beam](/resources/onprem/analytics/beam.png) **Beam** ``` import { Beam } from "diagrams-js/onprem/analytics"; ``` ![Databricks](/resources/onprem/analytics/databricks.png) **Databricks** ``` import { Databricks } from "diagrams-js/onprem/analytics"; ``` ![Dbt](/resources/onprem/analytics/dbt.png) **Dbt** ``` import { Dbt } from "diagrams-js/onprem/analytics"; ``` ![Dremio](/resources/onprem/analytics/dremio.png) **Dremio** ``` import { Dremio } from "diagrams-js/onprem/analytics"; ``` ![Flink](/resources/onprem/analytics/flink.png) **Flink** ``` import { Flink } from "diagrams-js/onprem/analytics"; ``` ![Hadoop](/resources/onprem/analytics/hadoop.png) **Hadoop** ``` import { Hadoop } from "diagrams-js/onprem/analytics"; ``` ![Hive](/resources/onprem/analytics/hive.png) **Hive** ``` import { Hive } from "diagrams-js/onprem/analytics"; ``` ![Metabase](/resources/onprem/analytics/metabase.png) **Metabase** ``` import { Metabase } from "diagrams-js/onprem/analytics"; ``` ![Norikra](/resources/onprem/analytics/norikra.png) **Norikra** ``` import { Norikra } from "diagrams-js/onprem/analytics"; ``` ![Powerbi](/resources/onprem/analytics/powerbi.png) **Powerbi** ``` import { Powerbi } from "diagrams-js/onprem/analytics"; ``` ![Presto](/resources/onprem/analytics/presto.png) **Presto** ``` import { Presto } from "diagrams-js/onprem/analytics"; ``` ![Singer](/resources/onprem/analytics/singer.png) **Singer** ``` import { Singer } from "diagrams-js/onprem/analytics"; ``` ![Spark](/resources/onprem/analytics/spark.png) **Spark** ``` import { Spark } from "diagrams-js/onprem/analytics"; ``` ![Storm](/resources/onprem/analytics/storm.png) **Storm** ``` import { Storm } from "diagrams-js/onprem/analytics"; ``` ![Superset](/resources/onprem/analytics/superset.png) **Superset** ``` import { Superset } from "diagrams-js/onprem/analytics"; ``` ![Tableau](/resources/onprem/analytics/tableau.png) **Tableau** ``` import { Tableau } from "diagrams-js/onprem/analytics"; ``` ![Trino](/resources/onprem/analytics/trino.png) **Trino** ``` import { Trino } from "diagrams-js/onprem/analytics"; ``` ### onprem/auth[​](#onpremauth "Direct link to onprem/auth") ![Boundary](/resources/onprem/auth/boundary.png) **Boundary** ``` import { Boundary } from "diagrams-js/onprem/auth"; ``` ![BuzzfeedSso](/resources/onprem/auth/buzzfeed-sso.png) **BuzzfeedSso** ``` import { BuzzfeedSso } from "diagrams-js/onprem/auth"; ``` ![Oauth2Proxy](/resources/onprem/auth/oauth2-proxy.png) **Oauth2Proxy** ``` import { Oauth2Proxy } from "diagrams-js/onprem/auth"; ``` ### onprem/cd[​](#onpremcd "Direct link to onprem/cd") ![Spinnaker](/resources/onprem/cd/spinnaker.png) **Spinnaker** ``` import { Spinnaker } from "diagrams-js/onprem/cd"; ``` ![TektonCli](/resources/onprem/cd/tekton-cli.png) **TektonCli** ``` import { TektonCli } from "diagrams-js/onprem/cd"; ``` ![Tekton](/resources/onprem/cd/tekton.png) **Tekton** ``` import { Tekton } from "diagrams-js/onprem/cd"; ``` ### onprem/certificates[​](#onpremcertificates "Direct link to onprem/certificates") ![CertManager](/resources/onprem/certificates/cert-manager.png) **CertManager** ``` import { CertManager } from "diagrams-js/onprem/certificates"; ``` ![LetsEncrypt](/resources/onprem/certificates/lets-encrypt.png) **LetsEncrypt** ``` import { LetsEncrypt } from "diagrams-js/onprem/certificates"; ``` ### onprem/ci[​](#onpremci "Direct link to onprem/ci") ![Circleci](/resources/onprem/ci/circleci.png) **Circleci** ``` import { Circleci } from "diagrams-js/onprem/ci"; ``` ![Concourseci](/resources/onprem/ci/concourseci.png) **Concourseci** ``` import { Concourseci } from "diagrams-js/onprem/ci"; ``` ![Droneci](/resources/onprem/ci/droneci.png) **Droneci** ``` import { Droneci } from "diagrams-js/onprem/ci"; ``` ![GithubActions](/resources/onprem/ci/github-actions.png) **GithubActions** ``` import { GithubActions } from "diagrams-js/onprem/ci"; ``` ![Gitlabci](/resources/onprem/ci/gitlabci.png) **Gitlabci** ``` import { Gitlabci } from "diagrams-js/onprem/ci"; ``` ![Jenkins](/resources/onprem/ci/jenkins.png) **Jenkins** ``` import { Jenkins } from "diagrams-js/onprem/ci"; ``` ![Teamcity](/resources/onprem/ci/teamcity.png) **Teamcity** ``` import { Teamcity } from "diagrams-js/onprem/ci"; ``` ![Travisci](/resources/onprem/ci/travisci.png) **Travisci** ``` import { Travisci } from "diagrams-js/onprem/ci"; ``` ![Zuulci](/resources/onprem/ci/zuulci.png) **Zuulci** ``` import { Zuulci } from "diagrams-js/onprem/ci"; ``` ### onprem/client[​](#onpremclient "Direct link to onprem/client") ![Client](/resources/onprem/client/client.png) **Client** ``` import { Client } from "diagrams-js/onprem/client"; ``` ![User](/resources/onprem/client/user.png) **User** ``` import { User } from "diagrams-js/onprem/client"; ``` ![Users](/resources/onprem/client/users.png) **Users** ``` import { Users } from "diagrams-js/onprem/client"; ``` ### onprem/compute[​](#onpremcompute "Direct link to onprem/compute") ![Nomad](/resources/onprem/compute/nomad.png) **Nomad** ``` import { Nomad } from "diagrams-js/onprem/compute"; ``` ![Server](/resources/onprem/compute/server.png) **Server** ``` import { Server } from "diagrams-js/onprem/compute"; ``` ### onprem/container[​](#onpremcontainer "Direct link to onprem/container") ![Containerd](/resources/onprem/container/containerd.png) **Containerd** ``` import { Containerd } from "diagrams-js/onprem/container"; ``` ![Crio](/resources/onprem/container/crio.png) **Crio** ``` import { Crio } from "diagrams-js/onprem/container"; ``` ![Docker](/resources/onprem/container/docker.png) **Docker** ``` import { Docker } from "diagrams-js/onprem/container"; ``` ![Firecracker](/resources/onprem/container/firecracker.png) **Firecracker** ``` import { Firecracker } from "diagrams-js/onprem/container"; ``` ![Gvisor](/resources/onprem/container/gvisor.png) **Gvisor** ``` import { Gvisor } from "diagrams-js/onprem/container"; ``` ![K3s](/resources/onprem/container/k3s.png) **K3s** ``` import { K3s } from "diagrams-js/onprem/container"; ``` ![Lxc](/resources/onprem/container/lxc.png) **Lxc** ``` import { Lxc } from "diagrams-js/onprem/container"; ``` ![Rkt](/resources/onprem/container/rkt.png) **Rkt** ``` import { Rkt } from "diagrams-js/onprem/container"; ``` ### onprem/database[​](#onpremdatabase "Direct link to onprem/database") ![Cassandra](/resources/onprem/database/cassandra.png) **Cassandra** ``` import { Cassandra } from "diagrams-js/onprem/database"; ``` ![Clickhouse](/resources/onprem/database/clickhouse.png) **Clickhouse** ``` import { Clickhouse } from "diagrams-js/onprem/database"; ``` ![Cockroachdb](/resources/onprem/database/cockroachdb.png) **Cockroachdb** ``` import { Cockroachdb } from "diagrams-js/onprem/database"; ``` ![Couchbase](/resources/onprem/database/couchbase.png) **Couchbase** ``` import { Couchbase } from "diagrams-js/onprem/database"; ``` ![Couchdb](/resources/onprem/database/couchdb.png) **Couchdb** ``` import { Couchdb } from "diagrams-js/onprem/database"; ``` ![Dgraph](/resources/onprem/database/dgraph.png) **Dgraph** ``` import { Dgraph } from "diagrams-js/onprem/database"; ``` ![Druid](/resources/onprem/database/druid.png) **Druid** ``` import { Druid } from "diagrams-js/onprem/database"; ``` ![Duckdb](/resources/onprem/database/duckdb.png) **Duckdb** ``` import { Duckdb } from "diagrams-js/onprem/database"; ``` ![Hbase](/resources/onprem/database/hbase.png) **Hbase** ``` import { Hbase } from "diagrams-js/onprem/database"; ``` ![Influxdb](/resources/onprem/database/influxdb.png) **Influxdb** ``` import { Influxdb } from "diagrams-js/onprem/database"; ``` ![Janusgraph](/resources/onprem/database/janusgraph.png) **Janusgraph** ``` import { Janusgraph } from "diagrams-js/onprem/database"; ``` ![Mariadb](/resources/onprem/database/mariadb.png) **Mariadb** ``` import { Mariadb } from "diagrams-js/onprem/database"; ``` ![Mongodb](/resources/onprem/database/mongodb.png) **Mongodb** ``` import { Mongodb } from "diagrams-js/onprem/database"; ``` ![Mssql](/resources/onprem/database/mssql.png) **Mssql** ``` import { Mssql } from "diagrams-js/onprem/database"; ``` ![Mysql](/resources/onprem/database/mysql.png) **Mysql** ``` import { Mysql } from "diagrams-js/onprem/database"; ``` ![Neo4j](/resources/onprem/database/neo4j.png) **Neo4j** ``` import { Neo4j } from "diagrams-js/onprem/database"; ``` ![Oracle](/resources/onprem/database/oracle.png) **Oracle** ``` import { Oracle } from "diagrams-js/onprem/database"; ``` ![Postgresql](/resources/onprem/database/postgresql.png) **Postgresql** ``` import { Postgresql } from "diagrams-js/onprem/database"; ``` ![Qdrant](/resources/onprem/database/qdrant.png) **Qdrant** ``` import { Qdrant } from "diagrams-js/onprem/database"; ``` ![Scylla](/resources/onprem/database/scylla.png) **Scylla** ``` import { Scylla } from "diagrams-js/onprem/database"; ``` ### onprem/dns[​](#onpremdns "Direct link to onprem/dns") ![Coredns](/resources/onprem/dns/coredns.png) **Coredns** ``` import { Coredns } from "diagrams-js/onprem/dns"; ``` ![Powerdns](/resources/onprem/dns/powerdns.png) **Powerdns** ``` import { Powerdns } from "diagrams-js/onprem/dns"; ``` ### onprem/etl[​](#onpremetl "Direct link to onprem/etl") ![Embulk](/resources/onprem/etl/embulk.png) **Embulk** ``` import { Embulk } from "diagrams-js/onprem/etl"; ``` ### onprem/gitops[​](#onpremgitops "Direct link to onprem/gitops") ![Argocd](/resources/onprem/gitops/argocd.png) **Argocd** ``` import { Argocd } from "diagrams-js/onprem/gitops"; ``` ![Flagger](/resources/onprem/gitops/flagger.png) **Flagger** ``` import { Flagger } from "diagrams-js/onprem/gitops"; ``` ![Flux](/resources/onprem/gitops/flux.png) **Flux** ``` import { Flux } from "diagrams-js/onprem/gitops"; ``` ### onprem/groupware[​](#onpremgroupware "Direct link to onprem/groupware") ![Nextcloud](/resources/onprem/groupware/nextcloud.png) **Nextcloud** ``` import { Nextcloud } from "diagrams-js/onprem/groupware"; ``` ### onprem/iac[​](#onpremiac "Direct link to onprem/iac") ![Ansible](/resources/onprem/iac/ansible.png) **Ansible** ``` import { Ansible } from "diagrams-js/onprem/iac"; ``` ![Atlantis](/resources/onprem/iac/atlantis.png) **Atlantis** ``` import { Atlantis } from "diagrams-js/onprem/iac"; ``` ![Awx](/resources/onprem/iac/awx.png) **Awx** ``` import { Awx } from "diagrams-js/onprem/iac"; ``` ![Pulumi](/resources/onprem/iac/pulumi.png) **Pulumi** ``` import { Pulumi } from "diagrams-js/onprem/iac"; ``` ![Puppet](/resources/onprem/iac/puppet.png) **Puppet** ``` import { Puppet } from "diagrams-js/onprem/iac"; ``` ![Terraform](/resources/onprem/iac/terraform.png) **Terraform** ``` import { Terraform } from "diagrams-js/onprem/iac"; ``` ### onprem/identity[​](#onpremidentity "Direct link to onprem/identity") ![Dex](/resources/onprem/identity/dex.png) **Dex** ``` import { Dex } from "diagrams-js/onprem/identity"; ``` ### onprem/inmemory[​](#onpreminmemory "Direct link to onprem/inmemory") ![Aerospike](/resources/onprem/inmemory/aerospike.png) **Aerospike** ``` import { Aerospike } from "diagrams-js/onprem/inmemory"; ``` ![Hazelcast](/resources/onprem/inmemory/hazelcast.png) **Hazelcast** ``` import { Hazelcast } from "diagrams-js/onprem/inmemory"; ``` ![Memcached](/resources/onprem/inmemory/memcached.png) **Memcached** ``` import { Memcached } from "diagrams-js/onprem/inmemory"; ``` ![Redis](/resources/onprem/inmemory/redis.png) **Redis** ``` import { Redis } from "diagrams-js/onprem/inmemory"; ``` ### onprem/logging[​](#onpremlogging "Direct link to onprem/logging") ![Fluentbit](/resources/onprem/logging/fluentbit.png) **Fluentbit** ``` import { Fluentbit } from "diagrams-js/onprem/logging"; ``` ![Graylog](/resources/onprem/logging/graylog.png) **Graylog** ``` import { Graylog } from "diagrams-js/onprem/logging"; ``` ![Loki](/resources/onprem/logging/loki.png) **Loki** ``` import { Loki } from "diagrams-js/onprem/logging"; ``` ![Rsyslog](/resources/onprem/logging/rsyslog.png) **Rsyslog** ``` import { Rsyslog } from "diagrams-js/onprem/logging"; ``` ![SyslogNg](/resources/onprem/logging/syslog-ng.png) **SyslogNg** ``` import { SyslogNg } from "diagrams-js/onprem/logging"; ``` ### onprem/messaging[​](#onpremmessaging "Direct link to onprem/messaging") ![Centrifugo](/resources/onprem/messaging/centrifugo.png) **Centrifugo** ``` import { Centrifugo } from "diagrams-js/onprem/messaging"; ``` ### onprem/mlops[​](#onpremmlops "Direct link to onprem/mlops") ![Mlflow](/resources/onprem/mlops/mlflow.png) **Mlflow** ``` import { Mlflow } from "diagrams-js/onprem/mlops"; ``` ![Polyaxon](/resources/onprem/mlops/polyaxon.png) **Polyaxon** ``` import { Polyaxon } from "diagrams-js/onprem/mlops"; ``` ### onprem/monitoring[​](#onpremmonitoring "Direct link to onprem/monitoring") ![Cortex](/resources/onprem/monitoring/cortex.png) **Cortex** ``` import { Cortex } from "diagrams-js/onprem/monitoring"; ``` ![Datadog](/resources/onprem/monitoring/datadog.png) **Datadog** ``` import { Datadog } from "diagrams-js/onprem/monitoring"; ``` ![Dynatrace](/resources/onprem/monitoring/dynatrace.png) **Dynatrace** ``` import { Dynatrace } from "diagrams-js/onprem/monitoring"; ``` ![Grafana](/resources/onprem/monitoring/grafana.png) **Grafana** ``` import { Grafana } from "diagrams-js/onprem/monitoring"; ``` ![Humio](/resources/onprem/monitoring/humio.png) **Humio** ``` import { Humio } from "diagrams-js/onprem/monitoring"; ``` ![Mimir](/resources/onprem/monitoring/mimir.png) **Mimir** ``` import { Mimir } from "diagrams-js/onprem/monitoring"; ``` ![Nagios](/resources/onprem/monitoring/nagios.png) **Nagios** ``` import { Nagios } from "diagrams-js/onprem/monitoring"; ``` ![Newrelic](/resources/onprem/monitoring/newrelic.png) **Newrelic** ``` import { Newrelic } from "diagrams-js/onprem/monitoring"; ``` ![PrometheusOperator](/resources/onprem/monitoring/prometheus-operator.png) **PrometheusOperator** ``` import { PrometheusOperator } from "diagrams-js/onprem/monitoring"; ``` ![Prometheus](/resources/onprem/monitoring/prometheus.png) **Prometheus** ``` import { Prometheus } from "diagrams-js/onprem/monitoring"; ``` ![Sentry](/resources/onprem/monitoring/sentry.png) **Sentry** ``` import { Sentry } from "diagrams-js/onprem/monitoring"; ``` ![Splunk](/resources/onprem/monitoring/splunk.png) **Splunk** ``` import { Splunk } from "diagrams-js/onprem/monitoring"; ``` ![Thanos](/resources/onprem/monitoring/thanos.png) **Thanos** ``` import { Thanos } from "diagrams-js/onprem/monitoring"; ``` ![Zabbix](/resources/onprem/monitoring/zabbix.png) **Zabbix** ``` import { Zabbix } from "diagrams-js/onprem/monitoring"; ``` ### onprem/network[​](#onpremnetwork "Direct link to onprem/network") ![Ambassador](/resources/onprem/network/ambassador.png) **Ambassador** ``` import { Ambassador } from "diagrams-js/onprem/network"; ``` ![Apache](/resources/onprem/network/apache.png) **Apache** ``` import { Apache } from "diagrams-js/onprem/network"; ``` **Bind9** ``` import { Bind9 } from "diagrams-js/onprem/network"; ``` ![Caddy](/resources/onprem/network/caddy.png) **Caddy** ``` import { Caddy } from "diagrams-js/onprem/network"; ``` ![CiscoRouter](/resources/onprem/network/cisco-router.png) **CiscoRouter** ``` import { CiscoRouter } from "diagrams-js/onprem/network"; ``` ![CiscoSwitchL2](/resources/onprem/network/cisco-switch-l2.png) **CiscoSwitchL2** ``` import { CiscoSwitchL2 } from "diagrams-js/onprem/network"; ``` ![CiscoSwitchL3](/resources/onprem/network/cisco-switch-l3.png) **CiscoSwitchL3** ``` import { CiscoSwitchL3 } from "diagrams-js/onprem/network"; ``` ![Consul](/resources/onprem/network/consul.png) **Consul** ``` import { Consul } from "diagrams-js/onprem/network"; ``` ![Envoy](/resources/onprem/network/envoy.png) **Envoy** ``` import { Envoy } from "diagrams-js/onprem/network"; ``` ![Etcd](/resources/onprem/network/etcd.png) **Etcd** ``` import { Etcd } from "diagrams-js/onprem/network"; ``` ![Glassfish](/resources/onprem/network/glassfish.png) **Glassfish** ``` import { Glassfish } from "diagrams-js/onprem/network"; ``` ![Gunicorn](/resources/onprem/network/gunicorn.png) **Gunicorn** ``` import { Gunicorn } from "diagrams-js/onprem/network"; ``` ![Haproxy](/resources/onprem/network/haproxy.png) **Haproxy** ``` import { Haproxy } from "diagrams-js/onprem/network"; ``` ![Internet](/resources/onprem/network/internet.png) **Internet** ``` import { Internet } from "diagrams-js/onprem/network"; ``` ![Istio](/resources/onprem/network/istio.png) **Istio** ``` import { Istio } from "diagrams-js/onprem/network"; ``` ![Jbossas](/resources/onprem/network/jbossas.png) **Jbossas** ``` import { Jbossas } from "diagrams-js/onprem/network"; ``` ![Jetty](/resources/onprem/network/jetty.png) **Jetty** ``` import { Jetty } from "diagrams-js/onprem/network"; ``` ![Kong](/resources/onprem/network/kong.png) **Kong** ``` import { Kong } from "diagrams-js/onprem/network"; ``` ![Linkerd](/resources/onprem/network/linkerd.png) **Linkerd** ``` import { Linkerd } from "diagrams-js/onprem/network"; ``` ![Mikrotik](/resources/onprem/network/mikrotik.png) **Mikrotik** ``` import { Mikrotik } from "diagrams-js/onprem/network"; ``` ![Nginx](/resources/onprem/network/nginx.png) **Nginx** ``` import { Nginx } from "diagrams-js/onprem/network"; ``` ![Ocelot](/resources/onprem/network/ocelot.png) **Ocelot** ``` import { Ocelot } from "diagrams-js/onprem/network"; ``` ![OpenServiceMesh](/resources/onprem/network/open-service-mesh.png) **OpenServiceMesh** ``` import { OpenServiceMesh } from "diagrams-js/onprem/network"; ``` ![Opnsense](/resources/onprem/network/opnsense.png) **Opnsense** ``` import { Opnsense } from "diagrams-js/onprem/network"; ``` ![Pfsense](/resources/onprem/network/pfsense.png) **Pfsense** ``` import { Pfsense } from "diagrams-js/onprem/network"; ``` ![Pomerium](/resources/onprem/network/pomerium.png) **Pomerium** ``` import { Pomerium } from "diagrams-js/onprem/network"; ``` ![Powerdns](/resources/onprem/network/powerdns.png) **Powerdns** ``` import { Powerdns } from "diagrams-js/onprem/network"; ``` ![Tomcat](/resources/onprem/network/tomcat.png) **Tomcat** ``` import { Tomcat } from "diagrams-js/onprem/network"; ``` ![Traefik](/resources/onprem/network/traefik.png) **Traefik** ``` import { Traefik } from "diagrams-js/onprem/network"; ``` ![Tyk](/resources/onprem/network/tyk.png) **Tyk** ``` import { Tyk } from "diagrams-js/onprem/network"; ``` ![Vyos](/resources/onprem/network/vyos.png) **Vyos** ``` import { Vyos } from "diagrams-js/onprem/network"; ``` ![Wildfly](/resources/onprem/network/wildfly.png) **Wildfly** ``` import { Wildfly } from "diagrams-js/onprem/network"; ``` ![Yarp](/resources/onprem/network/yarp.png) **Yarp** ``` import { Yarp } from "diagrams-js/onprem/network"; ``` ![Zookeeper](/resources/onprem/network/zookeeper.png) **Zookeeper** ``` import { Zookeeper } from "diagrams-js/onprem/network"; ``` ### onprem/proxmox[​](#onpremproxmox "Direct link to onprem/proxmox") ![Pve](/resources/onprem/proxmox/pve.png) **Pve** ``` import { Pve } from "diagrams-js/onprem/proxmox"; ``` ### onprem/queue[​](#onpremqueue "Direct link to onprem/queue") ![Activemq](/resources/onprem/queue/activemq.png) **Activemq** ``` import { Activemq } from "diagrams-js/onprem/queue"; ``` ![Celery](/resources/onprem/queue/celery.png) **Celery** ``` import { Celery } from "diagrams-js/onprem/queue"; ``` ![Emqx](/resources/onprem/queue/emqx.png) **Emqx** ``` import { Emqx } from "diagrams-js/onprem/queue"; ``` ![Kafka](/resources/onprem/queue/kafka.png) **Kafka** ``` import { Kafka } from "diagrams-js/onprem/queue"; ``` ![Nats](/resources/onprem/queue/nats.png) **Nats** ``` import { Nats } from "diagrams-js/onprem/queue"; ``` ![Rabbitmq](/resources/onprem/queue/rabbitmq.png) **Rabbitmq** ``` import { Rabbitmq } from "diagrams-js/onprem/queue"; ``` ![Zeromq](/resources/onprem/queue/zeromq.png) **Zeromq** ``` import { Zeromq } from "diagrams-js/onprem/queue"; ``` ### onprem/registry[​](#onpremregistry "Direct link to onprem/registry") ![Harbor](/resources/onprem/registry/harbor.png) **Harbor** ``` import { Harbor } from "diagrams-js/onprem/registry"; ``` ![Jfrog](/resources/onprem/registry/jfrog.png) **Jfrog** ``` import { Jfrog } from "diagrams-js/onprem/registry"; ``` ### onprem/search[​](#onpremsearch "Direct link to onprem/search") ![Solr](/resources/onprem/search/solr.png) **Solr** ``` import { Solr } from "diagrams-js/onprem/search"; ``` ### onprem/security[​](#onpremsecurity "Direct link to onprem/security") ![Bitwarden](/resources/onprem/security/bitwarden.png) **Bitwarden** ``` import { Bitwarden } from "diagrams-js/onprem/security"; ``` ![Trivy](/resources/onprem/security/trivy.png) **Trivy** ``` import { Trivy } from "diagrams-js/onprem/security"; ``` ![Vault](/resources/onprem/security/vault.png) **Vault** ``` import { Vault } from "diagrams-js/onprem/security"; ``` ### onprem/storage[​](#onpremstorage "Direct link to onprem/storage") ![CephOsd](/resources/onprem/storage/ceph-osd.png) **CephOsd** ``` import { CephOsd } from "diagrams-js/onprem/storage"; ``` ![Ceph](/resources/onprem/storage/ceph.png) **Ceph** ``` import { Ceph } from "diagrams-js/onprem/storage"; ``` ![Glusterfs](/resources/onprem/storage/glusterfs.png) **Glusterfs** ``` import { Glusterfs } from "diagrams-js/onprem/storage"; ``` ![Portworx](/resources/onprem/storage/portworx.png) **Portworx** ``` import { Portworx } from "diagrams-js/onprem/storage"; ``` ### onprem/tracing[​](#onpremtracing "Direct link to onprem/tracing") ![Jaeger](/resources/onprem/tracing/jaeger.png) **Jaeger** ``` import { Jaeger } from "diagrams-js/onprem/tracing"; ``` ![Tempo](/resources/onprem/tracing/tempo.png) **Tempo** ``` import { Tempo } from "diagrams-js/onprem/tracing"; ``` ### onprem/vcs[​](#onpremvcs "Direct link to onprem/vcs") ![Git](/resources/onprem/vcs/git.png) **Git** ``` import { Git } from "diagrams-js/onprem/vcs"; ``` ![Gitea](/resources/onprem/vcs/gitea.png) **Gitea** ``` import { Gitea } from "diagrams-js/onprem/vcs"; ``` ![Github](/resources/onprem/vcs/github.png) **Github** ``` import { Github } from "diagrams-js/onprem/vcs"; ``` ![Gitlab](/resources/onprem/vcs/gitlab.png) **Gitlab** ``` import { Gitlab } from "diagrams-js/onprem/vcs"; ``` ![Svn](/resources/onprem/vcs/svn.png) **Svn** ``` import { Svn } from "diagrams-js/onprem/vcs"; ``` ### onprem/workflow[​](#onpremworkflow "Direct link to onprem/workflow") ![Airflow](/resources/onprem/workflow/airflow.png) **Airflow** ``` import { Airflow } from "diagrams-js/onprem/workflow"; ``` ![Digdag](/resources/onprem/workflow/digdag.png) **Digdag** ``` import { Digdag } from "diagrams-js/onprem/workflow"; ``` ![Kubeflow](/resources/onprem/workflow/kubeflow.png) **Kubeflow** ``` import { Kubeflow } from "diagrams-js/onprem/workflow"; ``` ![Nifi](/resources/onprem/workflow/nifi.png) **Nifi** ``` import { Nifi } from "diagrams-js/onprem/workflow"; ``` --- # OpenStack Node classes list for the OpenStack provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { EC2API } from "diagrams-js/openstack/apiproxies"; import { Freezer, Masakari, Murano } from "diagrams-js/openstack/applicationlifecycle"; const diagram = Diagram("OpenStack Architecture", { direction: "TB" }); const node1 = diagram.add(EC2API("Node 1")); const node2 = diagram.add(Freezer("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/openstack) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### openstack/apiproxies[​](#openstackapiproxies "Direct link to openstack/apiproxies") ![EC2API](/resources/openstack/apiproxies/ec2api.png) **EC2API** ``` import { EC2API } from "diagrams-js/openstack/apiproxies"; ``` ### openstack/applicationlifecycle[​](#openstackapplicationlifecycle "Direct link to openstack/applicationlifecycle") ![Freezer](/resources/openstack/applicationlifecycle/freezer.png) **Freezer** ``` import { Freezer } from "diagrams-js/openstack/applicationlifecycle"; ``` ![Masakari](/resources/openstack/applicationlifecycle/masakari.png) **Masakari** ``` import { Masakari } from "diagrams-js/openstack/applicationlifecycle"; ``` ![Murano](/resources/openstack/applicationlifecycle/murano.png) **Murano** ``` import { Murano } from "diagrams-js/openstack/applicationlifecycle"; ``` ![Solum](/resources/openstack/applicationlifecycle/solum.png) **Solum** ``` import { Solum } from "diagrams-js/openstack/applicationlifecycle"; ``` ### openstack/baremetal[​](#openstackbaremetal "Direct link to openstack/baremetal") ![Cyborg](/resources/openstack/baremetal/cyborg.png) **Cyborg** ``` import { Cyborg } from "diagrams-js/openstack/baremetal"; ``` ![Ironic](/resources/openstack/baremetal/ironic.png) **Ironic** ``` import { Ironic } from "diagrams-js/openstack/baremetal"; ``` ### openstack/billing[​](#openstackbilling "Direct link to openstack/billing") ![Cloudkitty](/resources/openstack/billing/cloudkitty.png) **Cloudkitty** ``` import { Cloudkitty } from "diagrams-js/openstack/billing"; ``` ### openstack/compute[​](#openstackcompute "Direct link to openstack/compute") ![Nova](/resources/openstack/compute/nova.png) **Nova** ``` import { Nova } from "diagrams-js/openstack/compute"; ``` ![Qinling](/resources/openstack/compute/qinling.png) **Qinling** ``` import { Qinling } from "diagrams-js/openstack/compute"; ``` ![Zun](/resources/openstack/compute/zun.png) **Zun** ``` import { Zun } from "diagrams-js/openstack/compute"; ``` ### openstack/containerservices[​](#openstackcontainerservices "Direct link to openstack/containerservices") ![Kuryr](/resources/openstack/containerservices/kuryr.png) **Kuryr** ``` import { Kuryr } from "diagrams-js/openstack/containerservices"; ``` ### openstack/deployment[​](#openstackdeployment "Direct link to openstack/deployment") ![Ansible](/resources/openstack/deployment/ansible.png) **Ansible** ``` import { Ansible } from "diagrams-js/openstack/deployment"; ``` ![Charms](/resources/openstack/deployment/charms.png) **Charms** ``` import { Charms } from "diagrams-js/openstack/deployment"; ``` ![Chef](/resources/openstack/deployment/chef.png) **Chef** ``` import { Chef } from "diagrams-js/openstack/deployment"; ``` ![Helm](/resources/openstack/deployment/helm.png) **Helm** ``` import { Helm } from "diagrams-js/openstack/deployment"; ``` ![Kolla](/resources/openstack/deployment/kolla.png) **Kolla** ``` import { Kolla } from "diagrams-js/openstack/deployment"; ``` ![Tripleo](/resources/openstack/deployment/tripleo.png) **Tripleo** ``` import { Tripleo } from "diagrams-js/openstack/deployment"; ``` ### openstack/frontend[​](#openstackfrontend "Direct link to openstack/frontend") ![Horizon](/resources/openstack/frontend/horizon.png) **Horizon** ``` import { Horizon } from "diagrams-js/openstack/frontend"; ``` ### openstack/monitoring[​](#openstackmonitoring "Direct link to openstack/monitoring") ![Monasca](/resources/openstack/monitoring/monasca.png) **Monasca** ``` import { Monasca } from "diagrams-js/openstack/monitoring"; ``` ![Telemetry](/resources/openstack/monitoring/telemetry.png) **Telemetry** ``` import { Telemetry } from "diagrams-js/openstack/monitoring"; ``` ### openstack/multiregion[​](#openstackmultiregion "Direct link to openstack/multiregion") ![Tricircle](/resources/openstack/multiregion/tricircle.png) **Tricircle** ``` import { Tricircle } from "diagrams-js/openstack/multiregion"; ``` ### openstack/networking[​](#openstacknetworking "Direct link to openstack/networking") ![Designate](/resources/openstack/networking/designate.png) **Designate** ``` import { Designate } from "diagrams-js/openstack/networking"; ``` ![Neutron](/resources/openstack/networking/neutron.png) **Neutron** ``` import { Neutron } from "diagrams-js/openstack/networking"; ``` ![Octavia](/resources/openstack/networking/octavia.png) **Octavia** ``` import { Octavia } from "diagrams-js/openstack/networking"; ``` ### openstack/nfv[​](#openstacknfv "Direct link to openstack/nfv") ![Tacker](/resources/openstack/nfv/tacker.png) **Tacker** ``` import { Tacker } from "diagrams-js/openstack/nfv"; ``` ### openstack/optimization[​](#openstackoptimization "Direct link to openstack/optimization") ![Congress](/resources/openstack/optimization/congress.png) **Congress** ``` import { Congress } from "diagrams-js/openstack/optimization"; ``` ![Rally](/resources/openstack/optimization/rally.png) **Rally** ``` import { Rally } from "diagrams-js/openstack/optimization"; ``` ![Vitrage](/resources/openstack/optimization/vitrage.png) **Vitrage** ``` import { Vitrage } from "diagrams-js/openstack/optimization"; ``` ![Watcher](/resources/openstack/optimization/watcher.png) **Watcher** ``` import { Watcher } from "diagrams-js/openstack/optimization"; ``` ### openstack/orchestration[​](#openstackorchestration "Direct link to openstack/orchestration") ![Blazar](/resources/openstack/orchestration/blazar.png) **Blazar** ``` import { Blazar } from "diagrams-js/openstack/orchestration"; ``` ![Heat](/resources/openstack/orchestration/heat.png) **Heat** ``` import { Heat } from "diagrams-js/openstack/orchestration"; ``` ![Mistral](/resources/openstack/orchestration/mistral.png) **Mistral** ``` import { Mistral } from "diagrams-js/openstack/orchestration"; ``` ![Senlin](/resources/openstack/orchestration/senlin.png) **Senlin** ``` import { Senlin } from "diagrams-js/openstack/orchestration"; ``` ![Zaqar](/resources/openstack/orchestration/zaqar.png) **Zaqar** ``` import { Zaqar } from "diagrams-js/openstack/orchestration"; ``` ### openstack/packaging[​](#openstackpackaging "Direct link to openstack/packaging") ![LOCI](/resources/openstack/packaging/loci.png) **LOCI** ``` import { LOCI } from "diagrams-js/openstack/packaging"; ``` ![Puppet](/resources/openstack/packaging/puppet.png) **Puppet** ``` import { Puppet } from "diagrams-js/openstack/packaging"; ``` ![RPM](/resources/openstack/packaging/rpm.png) **RPM** ``` import { RPM } from "diagrams-js/openstack/packaging"; ``` ### openstack/sharedservices[​](#openstacksharedservices "Direct link to openstack/sharedservices") ![Barbican](/resources/openstack/sharedservices/barbican.png) **Barbican** ``` import { Barbican } from "diagrams-js/openstack/sharedservices"; ``` ![Glance](/resources/openstack/sharedservices/glance.png) **Glance** ``` import { Glance } from "diagrams-js/openstack/sharedservices"; ``` ![Karbor](/resources/openstack/sharedservices/karbor.png) **Karbor** ``` import { Karbor } from "diagrams-js/openstack/sharedservices"; ``` ![Keystone](/resources/openstack/sharedservices/keystone.png) **Keystone** ``` import { Keystone } from "diagrams-js/openstack/sharedservices"; ``` ![Searchlight](/resources/openstack/sharedservices/searchlight.png) **Searchlight** ``` import { Searchlight } from "diagrams-js/openstack/sharedservices"; ``` ### openstack/storage[​](#openstackstorage "Direct link to openstack/storage") ![Cinder](/resources/openstack/storage/cinder.png) **Cinder** ``` import { Cinder } from "diagrams-js/openstack/storage"; ``` ![Manila](/resources/openstack/storage/manila.png) **Manila** ``` import { Manila } from "diagrams-js/openstack/storage"; ``` ![Swift](/resources/openstack/storage/swift.png) **Swift** ``` import { Swift } from "diagrams-js/openstack/storage"; ``` ### openstack/user[​](#openstackuser "Direct link to openstack/user") ![Openstackclient](/resources/openstack/user/openstackclient.png) **Openstackclient** ``` import { Openstackclient } from "diagrams-js/openstack/user"; ``` ### openstack/workloadprovisioning[​](#openstackworkloadprovisioning "Direct link to openstack/workloadprovisioning") ![Magnum](/resources/openstack/workloadprovisioning/magnum.png) **Magnum** ``` import { Magnum } from "diagrams-js/openstack/workloadprovisioning"; ``` ![Sahara](/resources/openstack/workloadprovisioning/sahara.png) **Sahara** ``` import { Sahara } from "diagrams-js/openstack/workloadprovisioning"; ``` ![Trove](/resources/openstack/workloadprovisioning/trove.png) **Trove** ``` import { Trove } from "diagrams-js/openstack/workloadprovisioning"; ``` --- # Outscale Node classes list for the Outscale provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Compute, DirectConnect } from "diagrams-js/outscale/compute"; import { ClientVpn, InternetService, LoadBalancer } from "diagrams-js/outscale/network"; const diagram = Diagram("Outscale Architecture", { direction: "TB" }); const node1 = diagram.add(Compute("Node 1")); const node2 = diagram.add(ClientVpn("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/outscale) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### outscale/compute[​](#outscalecompute "Direct link to outscale/compute") ![Compute](/resources/outscale/compute/compute.png) **Compute** ``` import { Compute } from "diagrams-js/outscale/compute"; ``` ![DirectConnect](/resources/outscale/compute/direct-connect.png) **DirectConnect** ``` import { DirectConnect } from "diagrams-js/outscale/compute"; ``` ### outscale/network[​](#outscalenetwork "Direct link to outscale/network") ![ClientVpn](/resources/outscale/network/client-vpn.png) **ClientVpn** ``` import { ClientVpn } from "diagrams-js/outscale/network"; ``` ![InternetService](/resources/outscale/network/internet-service.png) **InternetService** ``` import { InternetService } from "diagrams-js/outscale/network"; ``` ![LoadBalancer](/resources/outscale/network/load-balancer.png) **LoadBalancer** ``` import { LoadBalancer } from "diagrams-js/outscale/network"; ``` ![NatService](/resources/outscale/network/nat-service.png) **NatService** ``` import { NatService } from "diagrams-js/outscale/network"; ``` ![Net](/resources/outscale/network/net.png) **Net** ``` import { Net } from "diagrams-js/outscale/network"; ``` ![SiteToSiteVpng](/resources/outscale/network/site-to-site-vpng.png) **SiteToSiteVpng** ``` import { SiteToSiteVpng } from "diagrams-js/outscale/network"; ``` ### outscale/security[​](#outscalesecurity "Direct link to outscale/security") ![Firewall](/resources/outscale/security/firewall.png) **Firewall** ``` import { Firewall } from "diagrams-js/outscale/security"; ``` ![IdentityAndAccessManagement](/resources/outscale/security/identity-and-access-management.png) **IdentityAndAccessManagement** ``` import { IdentityAndAccessManagement } from "diagrams-js/outscale/security"; ``` ### outscale/storage[​](#outscalestorage "Direct link to outscale/storage") ![SimpleStorageService](/resources/outscale/storage/simple-storage-service.png) **SimpleStorageService** ``` import { SimpleStorageService } from "diagrams-js/outscale/storage"; ``` ![Storage](/resources/outscale/storage/storage.png) **Storage** ``` import { Storage } from "diagrams-js/outscale/storage"; ``` --- # Programming Node classes list for the Programming provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Action, Collate, Database } from "diagrams-js/programming/flowchart"; import { Angular, Backbone, Camel } from "diagrams-js/programming/framework"; const diagram = Diagram("Programming Architecture", { direction: "TB" }); const node1 = diagram.add(Action("Node 1")); const node2 = diagram.add(Angular("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/programming) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### programming/flowchart[​](#programmingflowchart "Direct link to programming/flowchart") ![Action](/resources/programming/flowchart/action.png) **Action** ``` import { Action } from "diagrams-js/programming/flowchart"; ``` ![Collate](/resources/programming/flowchart/collate.png) **Collate** ``` import { Collate } from "diagrams-js/programming/flowchart"; ``` ![Database](/resources/programming/flowchart/database.png) **Database** ``` import { Database } from "diagrams-js/programming/flowchart"; ``` ![Decision](/resources/programming/flowchart/decision.png) **Decision** ``` import { Decision } from "diagrams-js/programming/flowchart"; ``` ![Delay](/resources/programming/flowchart/delay.png) **Delay** ``` import { Delay } from "diagrams-js/programming/flowchart"; ``` ![Display](/resources/programming/flowchart/display.png) **Display** ``` import { Display } from "diagrams-js/programming/flowchart"; ``` ![Document](/resources/programming/flowchart/document.png) **Document** ``` import { Document } from "diagrams-js/programming/flowchart"; ``` ![InputOutput](/resources/programming/flowchart/input-output.png) **InputOutput** ``` import { InputOutput } from "diagrams-js/programming/flowchart"; ``` ![Inspection](/resources/programming/flowchart/inspection.png) **Inspection** ``` import { Inspection } from "diagrams-js/programming/flowchart"; ``` ![InternalStorage](/resources/programming/flowchart/internal-storage.png) **InternalStorage** ``` import { InternalStorage } from "diagrams-js/programming/flowchart"; ``` ![LoopLimit](/resources/programming/flowchart/loop-limit.png) **LoopLimit** ``` import { LoopLimit } from "diagrams-js/programming/flowchart"; ``` ![ManualInput](/resources/programming/flowchart/manual-input.png) **ManualInput** ``` import { ManualInput } from "diagrams-js/programming/flowchart"; ``` ![ManualLoop](/resources/programming/flowchart/manual-loop.png) **ManualLoop** ``` import { ManualLoop } from "diagrams-js/programming/flowchart"; ``` ![Merge](/resources/programming/flowchart/merge.png) **Merge** ``` import { Merge } from "diagrams-js/programming/flowchart"; ``` ![MultipleDocuments](/resources/programming/flowchart/multiple-documents.png) **MultipleDocuments** ``` import { MultipleDocuments } from "diagrams-js/programming/flowchart"; ``` ![OffPageConnectorLeft](/resources/programming/flowchart/off-page-connector-left.png) **OffPageConnectorLeft** ``` import { OffPageConnectorLeft } from "diagrams-js/programming/flowchart"; ``` ![OffPageConnectorRight](/resources/programming/flowchart/off-page-connector-right.png) **OffPageConnectorRight** ``` import { OffPageConnectorRight } from "diagrams-js/programming/flowchart"; ``` ![Or](/resources/programming/flowchart/or.png) **Or** ``` import { Or } from "diagrams-js/programming/flowchart"; ``` ![PredefinedProcess](/resources/programming/flowchart/predefined-process.png) **PredefinedProcess** ``` import { PredefinedProcess } from "diagrams-js/programming/flowchart"; ``` ![Preparation](/resources/programming/flowchart/preparation.png) **Preparation** ``` import { Preparation } from "diagrams-js/programming/flowchart"; ``` ![Sort](/resources/programming/flowchart/sort.png) **Sort** ``` import { Sort } from "diagrams-js/programming/flowchart"; ``` ![StartEnd](/resources/programming/flowchart/start-end.png) **StartEnd** ``` import { StartEnd } from "diagrams-js/programming/flowchart"; ``` ![StoredData](/resources/programming/flowchart/stored-data.png) **StoredData** ``` import { StoredData } from "diagrams-js/programming/flowchart"; ``` ![SummingJunction](/resources/programming/flowchart/summing-junction.png) **SummingJunction** ``` import { SummingJunction } from "diagrams-js/programming/flowchart"; ``` ### programming/framework[​](#programmingframework "Direct link to programming/framework") ![Angular](/resources/programming/framework/angular.png) **Angular** ``` import { Angular } from "diagrams-js/programming/framework"; ``` ![Backbone](/resources/programming/framework/backbone.png) **Backbone** ``` import { Backbone } from "diagrams-js/programming/framework"; ``` ![Camel](/resources/programming/framework/camel.png) **Camel** ``` import { Camel } from "diagrams-js/programming/framework"; ``` ![Django](/resources/programming/framework/django.png) **Django** ``` import { Django } from "diagrams-js/programming/framework"; ``` ![Dotnet](/resources/programming/framework/dotnet.png) **Dotnet** ``` import { Dotnet } from "diagrams-js/programming/framework"; ``` ![Ember](/resources/programming/framework/ember.png) **Ember** ``` import { Ember } from "diagrams-js/programming/framework"; ``` ![Fastapi](/resources/programming/framework/fastapi.png) **Fastapi** ``` import { Fastapi } from "diagrams-js/programming/framework"; ``` ![Flask](/resources/programming/framework/flask.png) **Flask** ``` import { Flask } from "diagrams-js/programming/framework"; ``` ![Flutter](/resources/programming/framework/flutter.png) **Flutter** ``` import { Flutter } from "diagrams-js/programming/framework"; ``` ![Graphql](/resources/programming/framework/graphql.png) **Graphql** ``` import { Graphql } from "diagrams-js/programming/framework"; ``` ![Hibernate](/resources/programming/framework/hibernate.png) **Hibernate** ``` import { Hibernate } from "diagrams-js/programming/framework"; ``` ![Jhipster](/resources/programming/framework/jhipster.png) **Jhipster** ``` import { Jhipster } from "diagrams-js/programming/framework"; ``` ![Laravel](/resources/programming/framework/laravel.png) **Laravel** ``` import { Laravel } from "diagrams-js/programming/framework"; ``` ![Micronaut](/resources/programming/framework/micronaut.png) **Micronaut** ``` import { Micronaut } from "diagrams-js/programming/framework"; ``` ![Nextjs](/resources/programming/framework/nextjs.png) **Nextjs** ``` import { Nextjs } from "diagrams-js/programming/framework"; ``` ![Phoenix](/resources/programming/framework/phoenix.png) **Phoenix** ``` import { Phoenix } from "diagrams-js/programming/framework"; ``` ![Quarkus](/resources/programming/framework/quarkus.png) **Quarkus** ``` import { Quarkus } from "diagrams-js/programming/framework"; ``` ![Rails](/resources/programming/framework/rails.png) **Rails** ``` import { Rails } from "diagrams-js/programming/framework"; ``` ![React](/resources/programming/framework/react.png) **React** ``` import { React } from "diagrams-js/programming/framework"; ``` ![Spring](/resources/programming/framework/spring.png) **Spring** ``` import { Spring } from "diagrams-js/programming/framework"; ``` ![Sqlpage](/resources/programming/framework/sqlpage.png) **Sqlpage** ``` import { Sqlpage } from "diagrams-js/programming/framework"; ``` ![Starlette](/resources/programming/framework/starlette.png) **Starlette** ``` import { Starlette } from "diagrams-js/programming/framework"; ``` ![Svelte](/resources/programming/framework/svelte.png) **Svelte** ``` import { Svelte } from "diagrams-js/programming/framework"; ``` ![Vercel](/resources/programming/framework/vercel.png) **Vercel** ``` import { Vercel } from "diagrams-js/programming/framework"; ``` ![Vue](/resources/programming/framework/vue.png) **Vue** ``` import { Vue } from "diagrams-js/programming/framework"; ``` ### programming/language[​](#programminglanguage "Direct link to programming/language") ![Bash](/resources/programming/language/bash.png) **Bash** ``` import { Bash } from "diagrams-js/programming/language"; ``` ![C](/resources/programming/language/c.png) **C** ``` import { C } from "diagrams-js/programming/language"; ``` ![Cpp](/resources/programming/language/cpp.png) **Cpp** ``` import { Cpp } from "diagrams-js/programming/language"; ``` ![Csharp](/resources/programming/language/csharp.png) **Csharp** ``` import { Csharp } from "diagrams-js/programming/language"; ``` ![Dart](/resources/programming/language/dart.png) **Dart** ``` import { Dart } from "diagrams-js/programming/language"; ``` ![Elixir](/resources/programming/language/elixir.png) **Elixir** ``` import { Elixir } from "diagrams-js/programming/language"; ``` ![Erlang](/resources/programming/language/erlang.png) **Erlang** ``` import { Erlang } from "diagrams-js/programming/language"; ``` ![Go](/resources/programming/language/go.png) **Go** ``` import { Go } from "diagrams-js/programming/language"; ``` ![Java](/resources/programming/language/java.png) **Java** ``` import { Java } from "diagrams-js/programming/language"; ``` ![Javascript](/resources/programming/language/javascript.png) **Javascript** ``` import { Javascript } from "diagrams-js/programming/language"; ``` ![Kotlin](/resources/programming/language/kotlin.png) **Kotlin** ``` import { Kotlin } from "diagrams-js/programming/language"; ``` ![Latex](/resources/programming/language/latex.png) **Latex** ``` import { Latex } from "diagrams-js/programming/language"; ``` ![Matlab](/resources/programming/language/matlab.png) **Matlab** ``` import { Matlab } from "diagrams-js/programming/language"; ``` ![Nodejs](/resources/programming/language/nodejs.png) **Nodejs** ``` import { Nodejs } from "diagrams-js/programming/language"; ``` ![Php](/resources/programming/language/php.png) **Php** ``` import { Php } from "diagrams-js/programming/language"; ``` ![Python](/resources/programming/language/python.png) **Python** ``` import { Python } from "diagrams-js/programming/language"; ``` ![R](/resources/programming/language/r.png) **R** ``` import { R } from "diagrams-js/programming/language"; ``` ![Ruby](/resources/programming/language/ruby.png) **Ruby** ``` import { Ruby } from "diagrams-js/programming/language"; ``` ![Rust](/resources/programming/language/rust.png) **Rust** ``` import { Rust } from "diagrams-js/programming/language"; ``` ![Scala](/resources/programming/language/scala.png) **Scala** ``` import { Scala } from "diagrams-js/programming/language"; ``` ![Sql](/resources/programming/language/sql.png) **Sql** ``` import { Sql } from "diagrams-js/programming/language"; ``` ![Swift](/resources/programming/language/swift.png) **Swift** ``` import { Swift } from "diagrams-js/programming/language"; ``` ![Typescript](/resources/programming/language/typescript.png) **Typescript** ``` import { Typescript } from "diagrams-js/programming/language"; ``` ### programming/runtime[​](#programmingruntime "Direct link to programming/runtime") ![Dapr](/resources/programming/runtime/dapr.png) **Dapr** ``` import { Dapr } from "diagrams-js/programming/runtime"; ``` --- # SaaS Node classes list for the SaaS provider. ## Example Usage[​](#example-usage "Direct link to Example Usage") ``` import { Diagram } from "diagrams-js"; import { Newrelic, Opsgenie, Pagerduty } from "diagrams-js/saas/alerting"; import { Dataform, Snowflake, Stitch } from "diagrams-js/saas/analytics"; const diagram = Diagram("SaaS Architecture", { direction: "TB" }); const node1 = diagram.add(Newrelic("Node 1")); const node2 = diagram.add(Dataform("Node 2")); node1.to(node2); const svg = await diagram.render(); diagram.destroy(); ``` note All node classes available in the [Python diagrams library](https://diagrams.mingrammer.com/docs/nodes/saas) are also available in diagrams-js with the same class names and structure. ## Node Reference[​](#node-reference "Direct link to Node Reference") ### saas/alerting[​](#saasalerting "Direct link to saas/alerting") ![Newrelic](/resources/saas/alerting/newrelic.png) **Newrelic** ``` import { Newrelic } from "diagrams-js/saas/alerting"; ``` ![Opsgenie](/resources/saas/alerting/opsgenie.png) **Opsgenie** ``` import { Opsgenie } from "diagrams-js/saas/alerting"; ``` ![Pagerduty](/resources/saas/alerting/pagerduty.png) **Pagerduty** ``` import { Pagerduty } from "diagrams-js/saas/alerting"; ``` ![Pushover](/resources/saas/alerting/pushover.png) **Pushover** ``` import { Pushover } from "diagrams-js/saas/alerting"; ``` ![Xmatters](/resources/saas/alerting/xmatters.png) **Xmatters** ``` import { Xmatters } from "diagrams-js/saas/alerting"; ``` ### saas/analytics[​](#saasanalytics "Direct link to saas/analytics") ![Dataform](/resources/saas/analytics/dataform.png) **Dataform** ``` import { Dataform } from "diagrams-js/saas/analytics"; ``` ![Snowflake](/resources/saas/analytics/snowflake.png) **Snowflake** ``` import { Snowflake } from "diagrams-js/saas/analytics"; ``` ![Stitch](/resources/saas/analytics/stitch.png) **Stitch** ``` import { Stitch } from "diagrams-js/saas/analytics"; ``` ### saas/automation[​](#saasautomation "Direct link to saas/automation") ![N8n](/resources/saas/automation/n8n.png) **N8n** ``` import { N8n } from "diagrams-js/saas/automation"; ``` ### saas/cdn[​](#saascdn "Direct link to saas/cdn") ![Akamai](/resources/saas/cdn/akamai.png) **Akamai** ``` import { Akamai } from "diagrams-js/saas/cdn"; ``` ![Cloudflare](/resources/saas/cdn/cloudflare.png) **Cloudflare** ``` import { Cloudflare } from "diagrams-js/saas/cdn"; ``` ![Fastly](/resources/saas/cdn/fastly.png) **Fastly** ``` import { Fastly } from "diagrams-js/saas/cdn"; ``` ![Imperva](/resources/saas/cdn/imperva.png) **Imperva** ``` import { Imperva } from "diagrams-js/saas/cdn"; ``` ### saas/chat[​](#saaschat "Direct link to saas/chat") ![Discord](/resources/saas/chat/discord.png) **Discord** ``` import { Discord } from "diagrams-js/saas/chat"; ``` ![Line](/resources/saas/chat/line.png) **Line** ``` import { Line } from "diagrams-js/saas/chat"; ``` ![Mattermost](/resources/saas/chat/mattermost.png) **Mattermost** ``` import { Mattermost } from "diagrams-js/saas/chat"; ``` ![Messenger](/resources/saas/chat/messenger.png) **Messenger** ``` import { Messenger } from "diagrams-js/saas/chat"; ``` ![RocketChat](/resources/saas/chat/rocket-chat.png) **RocketChat** ``` import { RocketChat } from "diagrams-js/saas/chat"; ``` ![Slack](/resources/saas/chat/slack.png) **Slack** ``` import { Slack } from "diagrams-js/saas/chat"; ``` ![Teams](/resources/saas/chat/teams.png) **Teams** ``` import { Teams } from "diagrams-js/saas/chat"; ``` ![Telegram](/resources/saas/chat/telegram.png) **Telegram** ``` import { Telegram } from "diagrams-js/saas/chat"; ``` ### saas/communication[​](#saascommunication "Direct link to saas/communication") ![Twilio](/resources/saas/communication/twilio.png) **Twilio** ``` import { Twilio } from "diagrams-js/saas/communication"; ``` ### saas/crm[​](#saascrm "Direct link to saas/crm") ![Intercom](/resources/saas/crm/intercom.png) **Intercom** ``` import { Intercom } from "diagrams-js/saas/crm"; ``` ![Zendesk](/resources/saas/crm/zendesk.png) **Zendesk** ``` import { Zendesk } from "diagrams-js/saas/crm"; ``` ### saas/filesharing[​](#saasfilesharing "Direct link to saas/filesharing") ![Nextcloud](/resources/saas/filesharing/nextcloud.png) **Nextcloud** ``` import { Nextcloud } from "diagrams-js/saas/filesharing"; ``` ### saas/identity[​](#saasidentity "Direct link to saas/identity") ![Auth0](/resources/saas/identity/auth0.png) **Auth0** ``` import { Auth0 } from "diagrams-js/saas/identity"; ``` ![Okta](/resources/saas/identity/okta.png) **Okta** ``` import { Okta } from "diagrams-js/saas/identity"; ``` ### saas/logging[​](#saaslogging "Direct link to saas/logging") ![Datadog](/resources/saas/logging/datadog.png) **Datadog** ``` import { Datadog } from "diagrams-js/saas/logging"; ``` ![Newrelic](/resources/saas/logging/newrelic.png) **Newrelic** ``` import { Newrelic } from "diagrams-js/saas/logging"; ``` ![Papertrail](/resources/saas/logging/papertrail.png) **Papertrail** ``` import { Papertrail } from "diagrams-js/saas/logging"; ``` ### saas/media[​](#saasmedia "Direct link to saas/media") ![Cloudinary](/resources/saas/media/cloudinary.png) **Cloudinary** ``` import { Cloudinary } from "diagrams-js/saas/media"; ``` ### saas/payment[​](#saaspayment "Direct link to saas/payment") ![Adyen](/resources/saas/payment/adyen.png) **Adyen** ``` import { Adyen } from "diagrams-js/saas/payment"; ``` ![AmazonPay](/resources/saas/payment/amazon-pay.png) **AmazonPay** ``` import { AmazonPay } from "diagrams-js/saas/payment"; ``` ![Paypal](/resources/saas/payment/paypal.png) **Paypal** ``` import { Paypal } from "diagrams-js/saas/payment"; ``` ![Stripe](/resources/saas/payment/stripe.png) **Stripe** ``` import { Stripe } from "diagrams-js/saas/payment"; ``` ### saas/recommendation[​](#saasrecommendation "Direct link to saas/recommendation") ![Recombee](/resources/saas/recommendation/recombee.png) **Recombee** ``` import { Recombee } from "diagrams-js/saas/recommendation"; ``` ### saas/security[​](#saassecurity "Direct link to saas/security") ![Crowdstrike](/resources/saas/security/crowdstrike.png) **Crowdstrike** ``` import { Crowdstrike } from "diagrams-js/saas/security"; ``` ![Sonarqube](/resources/saas/security/sonarqube.png) **Sonarqube** ``` import { Sonarqube } from "diagrams-js/saas/security"; ``` ### saas/social[​](#saassocial "Direct link to saas/social") ![Facebook](/resources/saas/social/facebook.png) **Facebook** ``` import { Facebook } from "diagrams-js/saas/social"; ``` ![Twitter](/resources/saas/social/twitter.png) **Twitter** ``` import { Twitter } from "diagrams-js/saas/social"; ``` ---