{"id":2816,"date":"2026-08-06T12:59:49","date_gmt":"2026-08-06T04:59:49","guid":{"rendered":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/"},"modified":"2026-08-06T12:59:49","modified_gmt":"2026-08-06T04:59:49","slug":"vpascode-d2-diagram-support-announcement","status":"publish","type":"releases","link":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/","title":{"rendered":"Mitteilung der D2-Diagrammunterst\u00fctzung in VPasCode: Der ultimative kostenlose D2-Editor und Online-D2-Tool"},"content":{"rendered":"<p>Wir freuen uns, eine wichtige Aktualisierung von <strong>VPasCode<\/strong>: vollst\u00e4ndige Unterst\u00fctzung f\u00fcr die <strong>D2<\/strong>Diagramm-as-Code-Sprache! Mit diesem Update k\u00f6nnen Architekten, Entwickler und technische Redakteure deklarative D2-Textskripte sofort in saubere, professionelle visuelle Diagramme ohne jegliche H\u00fcrden umwandeln.<\/p>\n<p>Unabh\u00e4ngig davon, ob Sie komplexe Cloud-Architekturen, Mikroservices-Topologien oder organisatorische Abl\u00e4ufe darstellen, fungiert VPasCode als Ihr bevorzugter <strong>kostenloser D2-Editor<\/strong> und leistungsstarker <strong>Online-D2-Tool<\/strong>. Erleben Sie nahtlose, Echtzeit-Visualisierung direkt in Ihrem Browser.<\/p>\n<p><img fetchpriority=\"high\" alt=\"A screenshot of Visual Paradigm VPasCode editing a D2 code in its D2 editor\" class=\"alignnone wp-image-3564 size-full\" decoding=\"async\" fetchpriority=\"high\" height=\"745\" sizes=\"(max-width: 1192px) 100vw, 1192px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a73f61a158f4.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a73f61a158f4.png 1192w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a73f61a158f4-300x188.png 300w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a73f61a158f4-1024x640.png 1024w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a73f61a158f4-768x480.png 768w\" width=\"1192\"\/><\/p>\n<p>Um mehr \u00fcber unsere Plattformfunktionen und Aktualisierungen zu erfahren, besuchen Sie die offizielle <a href=\"https:\/\/www.vpascode.com\/overview\/\" rel=\"noopener\" target=\"_blank\">VPasCode-Seite<\/a>.<\/p>\n<h2>So funktioniert die D2-Integration in VPasCode<\/h2>\n<p>Die Verwendung von D2 in VPasCode ist schnell, intuitiv und darauf ausgelegt, Ihre Produktivit\u00e4t zu maximieren. Die Arbeitsumgebung verf\u00fcgt \u00fcber eine praktische Seiten-zu-Seite-Anordnung:<\/p>\n<ul>\n<li><strong>Linke Leiste (Code-Editor):<\/strong>F\u00fcgen Sie einfach Ihren D2-Code ein, tippen Sie ihn ein oder bearbeiten Sie ihn. Die automatische Format-Erkennung von VPasCode erkennt Ihren Code sofort, ohne dass Sie manuell die Sprache wechseln m\u00fcssen.<\/li>\n<li><strong>Rechte Leiste (Live-Visualisierer):<\/strong>Beobachten Sie, wie Ihr Diagramm dynamisch in Echtzeit gerendert wird, w\u00e4hrend Sie Text eingeben oder Codebl\u00f6cke \u00e4ndern.<\/li>\n<\/ul>\n<p>Das Video unten zeigt Ihnen, wie Sie ein D2-Diagramm im Visual Paradigm VPasCode-Diagramm-as-Code-Editor erstellen.<\/p>\n<p><iframe allowfullscreen=\"allowfullscreen\" frameborder=\"0\" src=\"https:\/\/www.youtube.com\/embed\/7CEBtQjyjNk?si=BXYAVRGqgwVTLWgY\" style=\"width: 100%; aspect-ratio: 16 \/ 9; height: auto;\" title=\"YouTube video player\"><span class=\"mce_SELRES_start\" data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\">\ufeff<\/span><span class=\"mce_SELRES_start\" data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\">\ufeff<\/span><\/iframe><\/p>\n<p>Bereit, es selbst auszuprobieren? Springen Sie direkt in die Aktion mit unserem <a href=\"https:\/\/www.vpascode.com\/\" rel=\"noopener\" target=\"_blank\">VPasCode-Editor<\/a>.<\/p>\n<h2>Wichtige Funktionen im Rahmen der D2-Unterst\u00fctzung<\/h2>\n<p>Abgesehen von der Echtzeit-Visualisierung bietet unsere neue D2-Integration vielseitige Zusammenarbeits- und Exportoptionen, die sich ideal in Ihren Arbeitsablauf einf\u00fcgen:<\/p>\n<ol>\n<li><strong>Flexible Exportoptionen:<\/strong> Laden Sie Ihre fertigen Diagramme sofort als skalierbare SVG-Vektorgrafiken oder hochaufl\u00f6sende PNG-Bilder f\u00fcr Berichte, Pr\u00e4sentationen und Dokumentation herunter.\n<p id=\"gBVyRNb\"><img alt=\"A screenshot of VPasCode, showing how to export a D2 diagram as image (PNG, SVG)\" class=\"alignnone wp-image-3567 size-full\" decoding=\"async\" height=\"470\" sizes=\"(max-width: 884px) 100vw, 884px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a74148ac959e.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a74148ac959e.png 884w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a74148ac959e-300x160.png 300w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a74148ac959e-768x408.png 768w\" width=\"884\"\/><\/p>\n<\/li>\n<li><strong>Integration der Zwischenablage:<\/strong>Kopieren Sie Ihre gerenderte Diagrammbild schnell und einfach mit einem Klick direkt in Ihre Zwischenablage, um es direkt in Slack, E-Mails oder Textverarbeitungsprogramme einzuf\u00fcgen.<\/li>\n<li><strong>Sofortige URL-Teilung:<\/strong>Teilen Sie Ihre Arbeit problemlos mit Kollegen oder Kunden \u00fcber direkte Hyperlinks. Am besten ist, dass f\u00fcr Betrachter keine Anmeldung erforderlich ist, um Ihre geteilten Diagramme anzusehen.<\/li>\n<\/ol>\n<h2>Demonstration: Erstellen eines grundlegenden Netzwerkdigramms in D2<\/h2>\n<p>Um zu sehen, wie einfach es ist, Systeme mit diesem <strong>kostenlosen D2-Editor<\/strong>, betrachten Sie das folgende Beispiel einer grundlegenden mehrschichtigen Netzarchitektur.<\/p>\n<h3>D2-Quellcode<\/h3>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">D2<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNptjz0PwiAURfcm\/Q+kzprIYsLgZnRw0LS7QXilJC9AgMH+e6WVaD\/Wc+7Nu09qDyJqaxjxWnWxLARqMJFsjwQtl48nR24EeEYuTXOry2JCU4w7tx\/tuqRZpmBiHqQOjJxPzcDoChtyzoaoPHxwfb\/+ojM87t2FjjtgxIEP1syGZJle5UYhjDcy7uDFVSqlCws4LMtU9KiNBF8WecXSfAuxR9i1GpGRatMCUKDVf23ipWgFHKo3KvSCiA==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">D2<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNptjz0PwiAURfcm\/Q+kzprIYsLgZnRw0LS7QXilJC9AgMH+e6WVaD\/Wc+7Nu09qDyJqaxjxWnWxLARqMJFsjwQtl48nR24EeEYuTXOry2JCU4w7tx\/tuqRZpmBiHqQOjJxPzcDoChtyzoaoPHxwfb\/+ojM87t2FjjtgxIEP1syGZJle5UYhjDcy7uDFVSqlCws4LMtU9KiNBF8WecXSfAuxR9i1GpGRatMCUKDVf23ipWgFHKo3KvSCiA==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"language-d2\"><code class=\"language-d2\" data-language=\"d2\" class=\"language-d2\">direction: right\r\nclient -&gt; load_balancer: HTTPS\r\nload_balancer -&gt; app1: HTTP\r\nload_balancer -&gt; app2: HTTP\r\napp1 -&gt; redis: GET\r\napp2 -&gt; redis: GET\r\napp1 -&gt; postgres: SQL\r\napp2 -&gt; postgres: SQL\r\nclient.shape: person\r\nload_balancer.shape: rectangle\r\napp1.shape: hexagon\r\napp2.shape: hexagon\r\nredis.shape: cylinder\r\npostgres.shape: cylinder\r\nredis.style.fill: \"#fee2e2\"\r\npostgres.style.fill: \"#dcfce7\"<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNptjz0PwiAURfcm\/Q+kzprIYsLgZnRw0LS7QXilJC9AgMH+e6WVaD\/Wc+7Nu09qDyJqaxjxWnWxLARqMJFsjwQtl48nR24EeEYuTXOry2JCU4w7tx\/tuqRZpmBiHqQOjJxPzcDoChtyzoaoPHxwfb\/+ojM87t2FjjtgxIEP1syGZJle5UYhjDcy7uDFVSqlCws4LMtU9KiNBF8WecXSfAuxR9i1GpGRatMCUKDVf23ipWgFHKo3KvSCiA==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNptjz0PwiAURfcm\/Q+kzprIYsLgZnRw0LS7QXilJC9AgMH+e6WVaD\/Wc+7Nu09qDyJqaxjxWnWxLARqMJFsjwQtl48nR24EeEYuTXOry2JCU4w7tx\/tuqRZpmBiHqQOjJxPzcDoChtyzoaoPHxwfb\/+ojM87t2FjjtgxIEP1syGZJle5UYhjDcy7uDFVSqlCws4LMtU9KiNBF8WecXSfAuxR9i1GpGRatMCUKDVf23ipWgFHKo3KvSCiA==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<h3>Wie dies in unserem Online-D2-Tool gerendert wird<\/h3>\n<p>Wenn Sie den obigen Skript in VPasCode einf\u00fcgen, verarbeitet die Engine die Beziehungen, Richtung und benutzerdefinierte Formen automatisch:<\/p>\n<ul>\n<li>Der <strong>client<\/strong>wird als eindeutiges Personen-Symbol gestaltet, das HTTPS-Anfragen an ein rechteckiges <strong>load_balancer<\/strong>.<\/li>\n<li>Der Datenverkehr teilt sich klar auf zwei sechseckige Anwendungs-Knoten (<strong>app1<\/strong> und <strong>app2<\/strong>).<\/li>\n<li>Beide Anwendungs-Knoten fragen sicher die Backend-Caching-Ebenen (<strong>redis<\/strong>, gestaltet in einem weichen roten Ton) und relationale Datenbanken (<strong>postgres<\/strong>, gestaltet in einem weichen gr\u00fcnen Ton).<\/li>\n<\/ul>\n<h2>Weitere D2-Diagramm-Beispiele<\/h2>\n<h3>Grundformen<\/h3>\n<p id=\"SAKMCCV\"><img alt=\"\" class=\"alignnone size-full wp-image-3576\" decoding=\"async\" height=\"307\" sizes=\"(max-width: 181px) 100vw, 181px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417a67c6bc.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417a67c6bc.png 181w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417a67c6bc-177x300.png 177w\" width=\"181\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">D2<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNorTi0qSy1S0LVTSM7JTM0rsVLwCAkJ4OUqhounJFkpFJamFlXycsGUVPNyKSgUZyQWpFopFKQWFefngQVKKnNS9dIyc3KsFJSUk9NSjdLSlHi5anm5QEYg60muzMnMS0ktwtSVYphqnpIC0QVxgh6qgrS0NOPkFCUARUE39Q==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">D2<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNorTi0qSy1S0LVTSM7JTM0rsVLwCAkJ4OUqhounJFkpOCalFSWmp\/JywRRV83IpKBRnJBakWikUpBYV5+eBBUoqc1L10jJzcqwUlJST01KN0tKUeLlqeblAhiDriarMycxLSS3C1JVimGqekgLRBXGEHqqCtLQ04+QUJQCcizhe\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"language-d2\"><code class=\"language-d2\" data-language=\"d2\" class=\"language-d2\">\r\nserver -&gt; client: HTTP\r\nserver -&gt; db: Abfrage\r\nclient: {\r\n  shape: person\r\n  style.fill: \"#cfe2ff\"\r\n}\r\ndb: {\r\n  shape: Zylinder\r\n  style.fill: \"#d1e7dd\"\r\n}\r\nserver.style.fill: \"#fff3cd\"\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNorTi0qSy1S0LVTSM7JTM0rsVLwCAkJ4OUqhounJFkpOCalFSWmp\/JywRRV83IpKBRnJBakWikUpBYV5+eBBUoqc1L10jJzcqwUlJST01KN0tKUeLlqeblAhiDriarMycxLSS3C1JVimGqekgLRBXGEHqqCtLQ04+QUJQCcizhe\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNorTi0qSy1S0LVTSM7JTM0rsVLwCAkJ4OUqhounJFkpFJamFlXycsGUVPNyKSgUZyQWpFopFKQWFefngQVKKnNS9dIyc3KsFJSUk9NSjdLSlHi5anm5QEYg60muzMnMS0ktwtSVYphqnpIC0QVxgh6qgrS0NOPkFCUARUE39Q==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<h2>Container<\/h2>\n<p id=\"WMOozNs\"><img loading=\"lazy\" alt=\"\" class=\"alignnone size-full wp-image-3575\" decoding=\"async\" height=\"669\" loading=\"lazy\" sizes=\"auto, (max-width: 370px) 100vw, 370px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417950d8ff.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417950d8ff.png 370w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417950d8ff-166x300.png 166w\" width=\"370\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">D2<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNqVkMEOgjAMhu8kvEODZ0mIBwwHb968KL7A2FpYmNsyZ5AY3l2JSxDCxUvT9M\/\/tX81+s64toBXHAF0WIUO4N4wiwU0+GS10WHme4UpSaUKSDaYU0aUjNIwFmbl0u2Qe6ZrhWt+ItpxMflFlVonb8z1SwzvldQC3RpFZJiLOYUz3uA\/DNqLXLCJ8fkDbA\/fQJdjeQ3pxtnvkeX5NFfCYmVM+7BxNLwByuNhaQ==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">D2<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNrLSy0pzy\/KtlKo5uVSUChPTYKyFBSKMxILUq0UglOTM4pTk7OhgiWVOal6aZk5OVYKSsqp5mmGaWlKIKlaEJFYkImuPQiovQSH9rS0NOPkFIT2lCS9gqLM3MSiSnRToipzMvNSUouwmZJimGqegmpKcmJyRiopZqRZpJinJCLMAIaDgq4dxD9BrsEhUM+BxJAdGRzogyoDtdgxKa0oMT2Vl6sWANIHYRg=\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"language-d2\"><code class=\"language-d2\" data-language=\"d2\" class=\"language-d2\">network: {\r\n  web: {\r\n    shape: Sechseck\r\n    style.fill: \"#e7f1ff\"\r\n  }\r\n  api: {\r\n    shape: Rechteck\r\n    style.fill: \"#fff3cd\"\r\n  }\r\n  db.primary: {\r\n    shape: Zylinder\r\n    style.fill: \"#d1e7dd\"\r\n  }\r\n  db.cache: {\r\n    shape: Zylinder\r\n    style.fill: \"#f8d7da\"\r\n  }\r\n  web -&gt; api: REST\r\n  api -&gt; db.primary: SQL\r\n  api -&gt; db.cache: Abfrage\r\n}<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNrLSy0pzy\/KtlKo5uVSUChPTYKyFBSKMxILUq0UglOTM4pTk7OhgiWVOal6aZk5OVYKSsqp5mmGaWlKIKlaEJFYkImuPQiovQSH9rS0NOPkFIT2lCS9gqLM3MSiSnRToipzMvNSUouwmZJimGqegmpKcmJyRiopZqRZpJinJCLMAIaDgq4dxD9BrsEhUM+BxJAdGRzogyoDtdgxKa0oMT2Vl6sWANIHYRg=\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNqVkMEOgjAMhu8kvEODZ0mIBwwHb968KL7A2FpYmNsyZ5AY3l2JSxDCxUvT9M\/\/tX81+s64toBXHAF0WIUO4N4wiwU0+GS10WHme4UpSaUKSDaYU0aUjNIwFmbl0u2Qe6ZrhWt+ItpxMflFlVonb8z1SwzvldQC3RpFZJiLOYUz3uA\/DNqLXLCJ8fkDbA\/fQJdjeQ3pxtnvkeX5NFfCYmVM+7BxNLwByuNhaQ==\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p><span style=\"font-size: 1.7em; font-weight: bold;\">Stilisiert<\/span><\/p>\n<p id=\"PZEHtiy\"><img loading=\"lazy\" alt=\"\" class=\"alignnone size-full wp-image-3577\" decoding=\"async\" height=\"1015\" loading=\"lazy\" sizes=\"auto, (max-width: 281px) 100vw, 281px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417c197f05.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417c197f05.png 281w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a7417c197f05-83x300.png 83w\" width=\"281\"\/><\/p>\n<p>\u00a0<\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">D2<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNqNkVFrwyAQx98L\/Q5H9pwwOrYwH\/a8hz20tF\/A6plKrAY1DWH0u8\/UmDq2wUBQ\/3f38+7vhVpH4HO9AuCbkhktZDPfAVyLnp0IeNtjVBQdTe9L1I3USABVO+nX9SosOiTSpWMLY8Djcg7EE+1CnUXmqW4ULrofFWZ5AEIqRaB4ECieWF3cA85b0+IU4q91\/fjyI1QOkvvQ9SaDGe0JnI02SbvGw7zRTv63ySo1xo9IBRbfOPyXWdmopOZo\/6AwwbDOKdHM3qGF8g2CqVWws7rZ+H44bPfxgUihWp6pR56+KP5CKsjrbxNO9feMIOUZU+\/73UeOn\/3k1AU7nwP+C5tRlWo=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">D2<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNqNkbFuwyAQhvdIeYeTO9uqUrVWGTp3yJA2mboROGJkAhbGsZwq714cjEPVVqqEBPx393H3c6K2JfC5XADwVc6MFvIw3QHaWp7PSMDZDoOi6GA6l6M+SO0DqOpRvywXftE+kk4Nmxk97uezJ1a08XXvyCqHrJ5lNyhM0gCEVIpAdidQPLAyuwVaZ02NY4g\/l+X9049Q3kvuKgKrBGa0I3A02kTtEg7TRhv5zx6L2BffIxWYfcPwXyb9GJTUHO0fFCYYliklWNm1aCF\/AW9p4c0sria+7nabbXggUKiWR+qQxw8KfxAL0vrrgGP9LcNLacbY+\/ZtneInOzltvZuPHv8F5VeUZw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"language-d2\"><code class=\"language-d2\" data-language=\"d2\" class=\"language-d2\">vars: {\r\n  d2-config: {\r\n    skizze: true\r\n    layout-engine: elk\r\n  }\r\n}\r\naws: {\r\n  vpc: {\r\n    web: {\r\n      shape: Rechteck\r\n      style: {\r\n        fill: \"#fef3c7\"\r\n        stroke: \"#d97706\"\r\n        stroke-width: 2\r\n        font: mono\r\n      }\r\n    }\r\n    api: {\r\n      shape: Rechteck\r\n      style.fill: \"#dbeafe\"\r\n    }\r\n    db: {\r\n      shape: Zylinder\r\n      style.fill: \"#dcfce7\"\r\n    }\r\n  }\r\n}\r\nuser -&gt; aws.vpc.web: HTTPS {\r\n  style.animated: true\r\n}\r\naws.vpc.web -&gt; aws.vpc.api: HTTP\r\naws.vpc.api -&gt; aws.vpc.db: SQL {\r\n  style.stroke-dash: 5\r\n}<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNqNkbFuwyAQhvdIeYeTO9uqUrVWGTp3yJA2mboROGJkAhbGsZwq714cjEPVVqqEBPx393H3c6K2JfC5XADwVc6MFvIw3QHaWp7PSMDZDoOi6GA6l6M+SO0DqOpRvywXftE+kk4Nmxk97uezJ1a08XXvyCqHrJ5lNyhM0gCEVIpAdidQPLAyuwVaZ02NY4g\/l+X9049Q3kvuKgKrBGa0I3A02kTtEg7TRhv5zx6L2BffIxWYfcPwXyb9GJTUHO0fFCYYliklWNm1aCF\/AW9p4c0sria+7nabbXggUKiWR+qQxw8KfxAL0vrrgGP9LcNLacbY+\/ZtneInOzltvZuPHv8F5VeUZw==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNqNkVFrwyAQx98L\/Q5H9pwwOrYwH\/a8hz20tF\/A6plKrAY1DWH0u8\/UmDq2wUBQ\/3f38+7vhVpH4HO9AuCbkhktZDPfAVyLnp0IeNtjVBQdTe9L1I3USABVO+nX9SosOiTSpWMLY8Djcg7EE+1CnUXmqW4ULrofFWZ5AEIqRaB4ECieWF3cA85b0+IU4q91\/fjyI1QOkvvQ9SaDGe0JnI02SbvGw7zRTv63ySo1xo9IBRbfOPyXWdmopOZo\/6AwwbDOKdHM3qGF8g2CqVWws7rZ+H44bPfxgUihWp6pR56+KP5CKsjrbxNO9feMIOUZU+\/73UeOn\/3k1AU7nwP+C5tRlWo=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<h2>Sequenz<\/h2>\n<p id=\"LRvpxDA\"><img loading=\"lazy\" alt=\"\" class=\"alignnone size-full wp-image-3578\" decoding=\"async\" height=\"845\" loading=\"lazy\" sizes=\"auto, (max-width: 402px) 100vw, 402px\" src=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a741847708b9.png\" srcset=\"https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a741847708b9.png 402w, https:\/\/updates.visual-paradigm.com\/wp-content\/uploads\/2026\/08\/img_6a741847708b9-143x300.png 143w\" width=\"402\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">D2<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNorzkgsSLVSKE4tLE3NS06NT8lMTC9KzOXlKi1OLVLQtVNILMi0UnB3DVHQB4kU83IBBUDiKUlWCsGuPq7OIQpavFwpSXC1RfnlCFUgPVYKRgYGCv7eaGYG+AdjNdTTL9g1KATdSAwTDRWci1ITS1JTADJTOJ4=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">D2<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNorzkgsSLVSKE4tLE3Nq4pPyUxML0rMzeXlKi1OLVLQtVNILMi0UnB3DVHQB4kU83IBBUDiKUlWCsGuPq7OIQpavFwpSXC1UamZOal5cHUgXVYKRgYGCv7eaKYG+AdjNdY1My\/t8J50kCHo5mIYa6jgWlRckpqTUwIAa3489w==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"language-d2\"><code class=\"language-d2\" data-language=\"d2\" class=\"language-d2\">shape: sequenz_diagramm\r\nuser -&gt; api: GET \/users\r\napi -&gt; db: SELECT *\r\ndb -&gt; api: Zeilen\r\napi -&gt; user: 200 OK\r\nuser -&gt; api: POST \/users\r\napi -&gt; db: Einf\u00fcgen\r\ndb -&gt; api: Zeile\r\napi -&gt; user: 201 Erstellt<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#d2:eNorzkgsSLVSKE4tLE3Nq4pPyUxML0rMzeXlKi1OLVLQtVNILMi0UnB3DVHQB4kU83IBBUDiKUlWCsGuPq7OIQpavFwpSXC1UamZOal5cHUgXVYKRgYGCv7eaKYG+AdjNdY1My\/t8J50kCHo5mIYa6jgWlRckpqTUwIAa3489w==\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit D2 in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/#d2:eNorzkgsSLVSKE4tLE3NS06NT8lMTC9KzOXlKi1OLVLQtVNILMi0UnB3DVHQB4kU83IBBUDiKUlWCsGuPq7OIQpavFwpSXC1RfnlCFUgPVYKRgYGCv7eaGYG+AdjNdTTL9g1KATdSAwTDRWci1ITS1JTADJTOJ4=\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>D2 in VPasCode bearbeiten<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p>Hinweise: Sie m\u00f6chten m\u00f6glicherweise ein Sequenzdiagramm mit PlantUML erstellen. Sehen Sie nach, wie dies geht unter:<\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"UG1XDYeanz\">\n<p><a href=\"https:\/\/www.vpascode.com\/complete-guide-to-plantuml-sequence-diagrams-syntax-examples-best-practices\/\">Komplette Anleitung zu PlantUML-Sequenzdiagrammen: Syntax, Beispiele und Best Practices<\/a><\/p>\n<\/blockquote>\n<p><iframe class=\"wp-embedded-content\" data-secret=\"UG1XDYeanz\" frameborder=\"0\" height=\"282\" marginheight=\"0\" marginwidth=\"0\" sandbox=\"allow-scripts\" scrolling=\"no\" security=\"restricted\" src=\"https:\/\/www.vpascode.com\/complete-guide-to-plantuml-sequence-diagrams-syntax-examples-best-practices\/embed\/#?secret=IlOQ6XvBnM#?secret=UG1XDYeanz\" style=\"position: absolute; visibility: hidden;\" title=\"\u201cComplete Guide to PlantUML Sequence Diagrams: Syntax, Examples &amp; Best Practices\u201d \u2014 VPasCode\" width=\"500\"><\/iframe><\/p>\n<h2>Was ist VPasCode?<\/h2>\n<p>Wenn Sie neu bei unserer Plattform sind, <strong>Visual Paradigm VPasCode<\/strong> ist eine einheitliche, browserbasierte Diagramm-as-Code-L\u00f6sung, entwickelt f\u00fcr moderne technische Teams. Sie beseitigt die Umst\u00e4nde manueller Zieh- und Ablege-Tools, indem sie es Ihnen erm\u00f6glicht, Architektur- und Datenmodelle vollst\u00e4ndig \u00fcber Code zu definieren.<\/p>\n<p>Zus\u00e4tzlich zu D2 unterst\u00fctzt VPasCode eine gro\u00dfe Auswahl an beliebten Diagrammformate und strukturierten Sprachen, darunter PlantUML, Mermaid, Graphviz, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/vpascode-echarts-support-chart-maker\/\">ECharts<\/a>, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/free-sql-to-erd-tool-online-editor\/\">SQL<\/a>, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/free-online-yaml-diagram-tool-vpascode-update\/\">YAML<\/a>, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/free-online-json-editor-visualizer-vpascode-update\/\">JSON<\/a>, und gro\u00dfe Programmiersprachen wie <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/vpascode-java-code-to-uml-class-diagram\/\">Java<\/a>, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/visualize-python-code-as-uml-class-diagrams-vpascode\/\">Python<\/a>, <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/visualize-rust-code-uml-diagram-as-code\/\">Rust<\/a>, und <a href=\"https:\/\/updates.visual-paradigm.com\/releases\/typescript-to-uml-class-diagram-generator\/\">TypeScript<\/a>. Die Kernfunktionen zum Codebearbeiten, Echtzeitanzeige und Bildexport sind vollst\u00e4ndig kostenlos.<\/p>\n<h2>Heute loslegen<\/h2>\n<p>Verbessern Sie heute Ihre technische Dokumentation und architektonische Modellierung. Erleben Sie die Geschwindigkeit und Bequemlichkeit unserer neuen D2-Funktionen, indem Sie die Anwendung jetzt direkt auf der <a href=\"https:\/\/www.vpascode.com\/\" rel=\"noopener\" target=\"_blank\">VPasCode Editor<\/a>.<\/p>\n","protected":false},"featured_media":2817,"template":"","meta":{"_acf_changed":false,"_yoast_wpseo_title":"Kostenloser D2-Editor & Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung","_yoast_wpseo_metadesc":"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"product":[2,3],"product-area":[49],"version":[50],"release-type":[16],"class_list":["post-2816","releases","type-releases","status-publish","has-post-thumbnail","hentry","product-visual-paradigm","product-visual-paradigm-online","product-area-vpascode","version-18-1","release-type-new-feature"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Kostenloser D2-Editor &amp; Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung<\/title>\n<meta name=\"description\" content=\"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Kostenloser D2-Editor &amp; Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung\" \/>\n<meta property=\"og:description\" content=\"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/\" \/>\n<meta property=\"og:site_name\" content=\"Visual Paradigm Product Updates German\" \/>\n<meta property=\"og:image\" content=\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1680\" \/>\n\t<meta property=\"og:image:height\" content=\"945\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"4\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/\",\"url\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/\",\"name\":\"Kostenloser D2-Editor & Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung\",\"isPartOf\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png\",\"datePublished\":\"2026-08-06T04:59:49+00:00\",\"description\":\"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!\",\"breadcrumb\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage\",\"url\":\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png\",\"contentUrl\":\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png\",\"width\":1680,\"height\":945},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/updates.visual-paradigm.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mitteilung der D2-Diagrammunterst\u00fctzung in VPasCode: Der ultimative kostenlose D2-Editor und Online-D2-Tool\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#website\",\"url\":\"https:\/\/updates.visual-paradigm.com\/de\/\",\"name\":\"Visual Paradigm Product Updates German\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/updates.visual-paradigm.com\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#organization\",\"name\":\"Visual Paradigm Product Updates German\",\"url\":\"https:\/\/updates.visual-paradigm.com\/de\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2025\/11\/vp-updates.png\",\"contentUrl\":\"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2025\/11\/vp-updates.png\",\"width\":185,\"height\":50,\"caption\":\"Visual Paradigm Product Updates German\"},\"image\":{\"@id\":\"https:\/\/updates.visual-paradigm.com\/de\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Kostenloser D2-Editor & Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung","description":"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/","og_locale":"de_DE","og_type":"article","og_title":"Kostenloser D2-Editor & Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung","og_description":"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!","og_url":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/","og_site_name":"Visual Paradigm Product Updates German","og_image":[{"width":1680,"height":945,"url":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"4\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/","url":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/","name":"Kostenloser D2-Editor & Online-D2-Tool: VPasCode unterst\u00fctzt jetzt D2-Visualisierung","isPartOf":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage"},"image":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage"},"thumbnailUrl":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png","datePublished":"2026-08-06T04:59:49+00:00","description":"Entdecken Sie, wie Sie den kostenlosen D2-Editor und das Online-D2-Tool von VPasCode nutzen, um D2-Diagramme in Echtzeit zu erstellen, vorzuschauen, zu exportieren und zu teilen. Lesen Sie jetzt die Ank\u00fcndigung!","breadcrumb":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#primaryimage","url":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png","contentUrl":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2026\/08\/vpascode-free-d2-editor-online-tutorial.png","width":1680,"height":945},{"@type":"BreadcrumbList","@id":"https:\/\/updates.visual-paradigm.com\/de\/releases\/vpascode-d2-diagram-support-announcement\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/updates.visual-paradigm.com\/de\/"},{"@type":"ListItem","position":2,"name":"Mitteilung der D2-Diagrammunterst\u00fctzung in VPasCode: Der ultimative kostenlose D2-Editor und Online-D2-Tool"}]},{"@type":"WebSite","@id":"https:\/\/updates.visual-paradigm.com\/de\/#website","url":"https:\/\/updates.visual-paradigm.com\/de\/","name":"Visual Paradigm Product Updates German","description":"","publisher":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/updates.visual-paradigm.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/updates.visual-paradigm.com\/de\/#organization","name":"Visual Paradigm Product Updates German","url":"https:\/\/updates.visual-paradigm.com\/de\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/updates.visual-paradigm.com\/de\/#\/schema\/logo\/image\/","url":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2025\/11\/vp-updates.png","contentUrl":"https:\/\/updates.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/9\/2025\/11\/vp-updates.png","width":185,"height":50,"caption":"Visual Paradigm Product Updates German"},"image":{"@id":"https:\/\/updates.visual-paradigm.com\/de\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/releases\/2816","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/releases"}],"about":[{"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/types\/releases"}],"version-history":[{"count":0,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/releases\/2816\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/media\/2817"}],"wp:attachment":[{"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/media?parent=2816"}],"wp:term":[{"taxonomy":"product","embeddable":true,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/product?post=2816"},{"taxonomy":"product-area","embeddable":true,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/product-area?post=2816"},{"taxonomy":"version","embeddable":true,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/version?post=2816"},{"taxonomy":"release-type","embeddable":true,"href":"https:\/\/updates.visual-paradigm.com\/de\/wp-json\/wp\/v2\/release-type?post=2816"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}