Themes

Structurizr supports the concept of themes, so that you can consistently style diagrams across workspaces. Themes are JSON files containing tag-based element and relationship styles; the same ones that you would usually define in a workspace - see Help - Notation for more details. When one or more themes are set on a workspace, any styles defined in those themes will be used as a basis when rendering diagrams. Furthermore, like CSS, any styles additionally defined in the workspace will override those defined in the themes.

The following prebuilt themes are available to use:

Amazon Web Services (2023.01.31)	icons and colours	icons only
Amazon Web Services (2022.04.30)	icons and colours	icons only
Amazon Web Services (2020.04.30)	icons and colours	icons only
Google Cloud Platform (v1.5)	icons and colours	icons only
Kubernetes (v0.3)	icons and colours	icons only
Microsoft Azure (2023.01.24)	icons and colours	icons only
Microsoft Azure (2021.01.26 - “V4”)	icons and colours	icons only
Microsoft Azure (2020.07.13 - “V3”)	icons and colours	icons only
Microsoft Azure (2019.09.11)	icons and colours	icons only
Oracle Cloud Infrastructure (2023.04.01)	icons and colours	icons only
Oracle Cloud Infrastructure (2021.04.30)	icons and colours	icons only
Oracle Cloud Infrastructure (2020.04.30)	icons and colours	icons only

Creating your own themes

1. Static themes

A static theme is a JSON file that is hosted externally to Structurizr, via a URL. Theme files can be created by hand, exported from an existing workspace, or created with one of the client libraries. An easy way to create a theme is to define a workspace via the Structurizr DSL, and export the styles as a theme via the Structurizr CLI. For example:

./structurizr.sh export -workspace theme.dsl -format theme

theme.dsl

workspace "Name" "Description" {
    views {
        styles {
            element "Person" {
                shape person
            }
        }
    }
}

theme.json (output)

{
  "name" : "Name",
  "description" : "Description",
  "elements" : [ {
    "tag" : "Person",
    "shape" : "Person"
  } ]
}

To use a static theme:

1. Publish the JSON file representing the theme somewhere that is accessible from your web browser (e.g. a web server, GitHub Gist, etc.)
2. Add this URL to your workspace; for example using the Structurizr DSL (theme or themes keywords) or client library (ViewSet -> Configuration -> theme/themes property).

If you are using the cloud service or your on-premises installation is being served over HTTPS, theme JSON files must also be served over HTTPS. Also, for security reasons, the web server hosting your theme must set the Access-Control-Allow-Origin header to allow cross-origin requests.

2. Dynamic themes

In contrast, a dynamic theme is directly sourced from another published workspace on the cloud service or on-premises installation that you have access too, and consists of the styles that are explicitly defined in that workspace.

To use a dynamic theme:

1. Get the URL of the theme by clicking the “Theme” link on the private/public/shareable workspace summary page as appropriate (e.g. https://structurizr.com/share/36141/theme).
2. Add this URL to your workspace; for example using the Structurizr DSL (theme or themes keywords) or client library (ViewSet -> Configuration -> theme/themes property).

Please note that if other users have access to your workspace, they must also have access to the workspace that is the source of the theme.