Created
January 14, 2020 06:52
-
-
Save simonbrowndotje/3eeeb2283f8c3c70995ec9c6931d02ff to your computer and use it in GitHub Desktop.
Structurizr SVG export examples
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 2500 1000" style="background: #ffffff"><g transform="translate(25,100)"><rect width="450" height="300" rx="3" ry="3" x="0" y="0" fill="#ffffff" stroke-width="5" stroke="#444444" stroke-dasharray="50,50"></rect><text x="225" y="125" text-anchor="middle" fill="#444444" font-size="30px" font-family="Open Sans"><tspan x="225">Internet Banking System</tspan><tspan x="225" dy="42px" font-size="0.8em">[Software System]</tspan></text></g><g transform="translate(525,100)"><rect width="450" height="300" rx="3" ry="3" x="0" y="0" fill="#438dd5" stroke-width="5" stroke="#3c7fc0"></rect><text x="225" y="137.5" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Container</tspan></text></g><g transform="translate(1025,100)"><ellipse id="keyDatabaseCylinderBottom" cx="225" cy="255" rx="225" ry="45" stroke-width="5" stroke="#3c7fc0"></ellipse><rect id="keyDatabaseCylinderFace" x="0" y="45" width="450" height="210" stroke-width="5" stroke="#3c7fc0"></rect><clipPath id="keyDatabaseCylinderContainersStructurizrClipPath1" clipPathUnits="userSpaceOnUse"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#keyDatabaseCylinderBottom"></use><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#keyDatabaseCylinderFace"></use></clipPath><rect x="0" y="45" width="450" height="300" clip-path="url(#keyDatabaseCylinderContainersStructurizrClipPath1)" fill="#438dd5" stroke-width="5" stroke="#3c7fc0"></rect><ellipse cx="225" cy="45" rx="225" ry="45" fill="#438dd5" stroke-width="5" stroke="#3c7fc0"></ellipse><text x="225" y="182.5" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Container, Database</tspan></text></g><g transform="translate(1525,100)"><rect width="450" height="300" rx="20" ry="20" x="0" y="0" fill="#3c7fc0" stroke-width="5" stroke="#3c7fc0"></rect><rect width="370" height="280" rx="5" ry="5" x="40" y="10" fill="#438dd5" stroke-width="0"></rect><ellipse cx="20" cy="150" rx="10" ry="10" fill="#438dd5" stroke-width="0"></ellipse><line x1="430" y1="125" x2="430" y2="175" stroke-width="5" stroke="#438dd5"></line><text x="225" y="137.5" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Container, Mobile App</tspan></text></g><g transform="translate(2025,100)"><rect width="450" height="300" rx="10" ry="10" x="0" y="0" fill="#3c7fc0" stroke-width="5" stroke="#3c7fc0"></rect><rect width="430" height="250" rx="10" ry="10" x="10" y="40" fill="#438dd5" stroke-width="0"></rect><rect width="340" height="20" rx="10" ry="10" x="100" y="10" fill="#438dd5" stroke-width="0"></rect><ellipse cx="20" cy="20" rx="10" ry="10" fill="#438dd5" stroke-width="0"></ellipse><ellipse cx="50" cy="20" rx="10" ry="10" fill="#438dd5" stroke-width="0"></ellipse><ellipse cx="80" cy="20" rx="10" ry="10" fill="#438dd5" stroke-width="0"></ellipse><text x="225" y="157.5" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Container, Web Browser</tspan></text></g><g transform="translate(25,525)"><rect x="0" y="180" width="450" height="270" rx="90" fill="#08427b" stroke-width="5" stroke="#073b6f"></rect><circle cx="225" cy="100" r="100" fill="#08427b" stroke-width="5" stroke="#073b6f"></circle><line x1="90" y1="300" x2="90" y2="450" stroke-width="5" stroke="#073b6f"></line><line x1="360" y1="300" x2="360" y2="450" stroke-width="5" stroke="#073b6f"></line><text x="225" y="312.5" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Person</tspan></text></g><g transform="translate(525,600)"><rect width="450" height="300" rx="3" ry="3" x="0" y="0" fill="#999999" stroke-width="5" stroke="#8a8a8a"></rect><text x="225" y="125" text-anchor="middle" fill="#ffffff" font-size="30px" font-family="Open Sans"><tspan x="225">Software System, Existing</tspan><tspan x="225" dy="42px">System</tspan></text></g><g transform="translate(1025,670)"><path d="M390,0 L390,60 L450,30 L 390,0" style="fill:#707070" stroke-dasharray=""></path><path d="M0,30 L390,30" style="stroke:#707070; stroke-width: 6; fill: none; stroke-dasharray: 30 30;"></path><text x="225" y="97.5" text-anchor="middle" fill="#707070" font-size="30px" font-family="Open Sans"><tspan x="225">Relationship</tspan></text></g></svg> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment