diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json
index 792f4c6c..5f199c0b 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -6,7 +6,7 @@
   "packages": {
     "": {
       "name": "@stencila/components",
-      "version": "0.54.3",
+      "version": "0.55.0",
       "license": "Apache-2.0",
       "dependencies": {
         "@codemirror/autocomplete": "^0.19.15",
@@ -32,6 +32,8 @@
         "@codemirror/view": "^0.19.48",
         "@nll/datum": "^3.5.0",
         "@popperjs/core": "^2.11.0",
+        "@stencila/style-material": "0.16.14",
+        "@stencila/style-stencila": "0.30.0",
         "animate-presence": "^0.2.1",
         "d3": "^7.0.1",
         "d3-drag": "^3.0.0",
@@ -1728,6 +1730,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/@stencila/brand": {
+      "version": "0.7.31",
+      "resolved": "https://registry.npmjs.org/@stencila/brand/-/brand-0.7.31.tgz",
+      "integrity": "sha512-FMQfPjJ9Jeb9B8Q8PgXgV8i1vHEg3boyR3Y+TgQFWShdkQjP61swXCaPAYU41CCUNzwkqUW9wJRgWK6pxpqGjA=="
+    },
     "node_modules/@stencila/eslint-config-stencil": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@stencila/eslint-config-stencil/-/eslint-config-stencil-2.0.5.tgz",
@@ -1756,6 +1763,22 @@
       "integrity": "sha512-mWvEi6Y+8hQRqlRfJHUPQ/GZUN+rfY7kB7JSx1Cts64PsF+odgJ2AFu+fltnK94jRB8Ohk0B4SPJLnuGLeZGBg==",
       "dev": true
     },
+    "node_modules/@stencila/style-material": {
+      "version": "0.16.14",
+      "resolved": "https://registry.npmjs.org/@stencila/style-material/-/style-material-0.16.14.tgz",
+      "integrity": "sha512-DWPBDYnsVc0OdBQDxbnApUbzZ410/53Gqw8eO8s7zkeH49IHQtOo081MOaRBEwHbgSFdM6SJkkj/khxIzaGZ6A==",
+      "dependencies": {
+        "@stencila/brand": "0.7.31"
+      }
+    },
+    "node_modules/@stencila/style-stencila": {
+      "version": "0.30.0",
+      "resolved": "https://registry.npmjs.org/@stencila/style-stencila/-/style-stencila-0.30.0.tgz",
+      "integrity": "sha512-AF9ZJrB8s2XYH1dRH4LxeLHo0zZ+Rrb7Ls2f6f2J6yK6BM8/MAcZO3LzdiXghX9nIaSY0gLcvSElFffXeZTQuA==",
+      "dependencies": {
+        "@stencila/brand": "0.7.31"
+      }
+    },
     "node_modules/@tootallnate/once": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz",
@@ -4432,9 +4455,9 @@
       }
     },
     "node_modules/eslint-plugin-import": {
-      "version": "2.25.4",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.25.4.tgz",
-      "integrity": "sha512-/KJBASVFxpu0xg1kIBn9AUa8hQVnszpwgE7Ld0lKAlx7Ie87yzEzCgSkekt+le/YVhiaosO4Y14GDAOc41nfxA==",
+      "version": "2.26.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.26.0.tgz",
+      "integrity": "sha512-hYfi3FXaM8WPLf4S1cikh/r4IxnO6zrhZbEGz2b660EJRbuxgpDS5gkCuYgGWg2xxh2rBuIr4Pvhve/7c31koA==",
       "dev": true,
       "peer": true,
       "dependencies": {
@@ -4443,14 +4466,14 @@
         "debug": "^2.6.9",
         "doctrine": "^2.1.0",
         "eslint-import-resolver-node": "^0.3.6",
-        "eslint-module-utils": "^2.7.2",
+        "eslint-module-utils": "^2.7.3",
         "has": "^1.0.3",
-        "is-core-module": "^2.8.0",
+        "is-core-module": "^2.8.1",
         "is-glob": "^4.0.3",
-        "minimatch": "^3.0.4",
+        "minimatch": "^3.1.2",
         "object.values": "^1.1.5",
-        "resolve": "^1.20.0",
-        "tsconfig-paths": "^3.12.0"
+        "resolve": "^1.22.0",
+        "tsconfig-paths": "^3.14.1"
       },
       "engines": {
         "node": ">=4"
@@ -6691,9 +6714,9 @@
       "integrity": "sha512-Rc2suX5meI0S3bfdZuA7JMFBGkJ875ApfVyq2WHELjBiiG22My/l7/8zPpH/CfFVQHuVLd8NLR0nv6vi0BYYKA=="
     },
     "node_modules/json5": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
-      "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
       "dev": true,
       "bin": {
         "json5": "lib/cli.js"
@@ -8801,9 +8824,9 @@
       }
     },
     "node_modules/tsconfig-paths/node_modules/json5": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
-      "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+      "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
       "dev": true,
       "peer": true,
       "dependencies": {
@@ -9080,12 +9103,6 @@
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
       "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
     },
-    "node_modules/vega-embed/node_modules/yallist": {
-      "version": "4.0.0",
-      "extraneous": true,
-      "inBundle": true,
-      "license": "ISC"
-    },
     "node_modules/vega-encode": {
       "version": "4.9.0",
       "resolved": "https://registry.npmjs.org/vega-encode/-/vega-encode-4.9.0.tgz",
@@ -11306,6 +11323,11 @@
         }
       }
     },
+    "@stencila/brand": {
+      "version": "0.7.31",
+      "resolved": "https://registry.npmjs.org/@stencila/brand/-/brand-0.7.31.tgz",
+      "integrity": "sha512-FMQfPjJ9Jeb9B8Q8PgXgV8i1vHEg3boyR3Y+TgQFWShdkQjP61swXCaPAYU41CCUNzwkqUW9wJRgWK6pxpqGjA=="
+    },
     "@stencila/eslint-config-stencil": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@stencila/eslint-config-stencil/-/eslint-config-stencil-2.0.5.tgz",
@@ -11319,6 +11341,22 @@
       "integrity": "sha512-mWvEi6Y+8hQRqlRfJHUPQ/GZUN+rfY7kB7JSx1Cts64PsF+odgJ2AFu+fltnK94jRB8Ohk0B4SPJLnuGLeZGBg==",
       "dev": true
     },
+    "@stencila/style-material": {
+      "version": "0.16.14",
+      "resolved": "https://registry.npmjs.org/@stencila/style-material/-/style-material-0.16.14.tgz",
+      "integrity": "sha512-DWPBDYnsVc0OdBQDxbnApUbzZ410/53Gqw8eO8s7zkeH49IHQtOo081MOaRBEwHbgSFdM6SJkkj/khxIzaGZ6A==",
+      "requires": {
+        "@stencila/brand": "0.7.31"
+      }
+    },
+    "@stencila/style-stencila": {
+      "version": "0.30.0",
+      "resolved": "https://registry.npmjs.org/@stencila/style-stencila/-/style-stencila-0.30.0.tgz",
+      "integrity": "sha512-AF9ZJrB8s2XYH1dRH4LxeLHo0zZ+Rrb7Ls2f6f2J6yK6BM8/MAcZO3LzdiXghX9nIaSY0gLcvSElFffXeZTQuA==",
+      "requires": {
+        "@stencila/brand": "0.7.31"
+      }
+    },
     "@tootallnate/once": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz",
@@ -13409,9 +13447,9 @@
       }
     },
     "eslint-plugin-import": {
-      "version": "2.25.4",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.25.4.tgz",
-      "integrity": "sha512-/KJBASVFxpu0xg1kIBn9AUa8hQVnszpwgE7Ld0lKAlx7Ie87yzEzCgSkekt+le/YVhiaosO4Y14GDAOc41nfxA==",
+      "version": "2.26.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.26.0.tgz",
+      "integrity": "sha512-hYfi3FXaM8WPLf4S1cikh/r4IxnO6zrhZbEGz2b660EJRbuxgpDS5gkCuYgGWg2xxh2rBuIr4Pvhve/7c31koA==",
       "dev": true,
       "peer": true,
       "requires": {
@@ -13420,14 +13458,14 @@
         "debug": "^2.6.9",
         "doctrine": "^2.1.0",
         "eslint-import-resolver-node": "^0.3.6",
-        "eslint-module-utils": "^2.7.2",
+        "eslint-module-utils": "^2.7.3",
         "has": "^1.0.3",
-        "is-core-module": "^2.8.0",
+        "is-core-module": "^2.8.1",
         "is-glob": "^4.0.3",
-        "minimatch": "^3.0.4",
+        "minimatch": "^3.1.2",
         "object.values": "^1.1.5",
-        "resolve": "^1.20.0",
-        "tsconfig-paths": "^3.12.0"
+        "resolve": "^1.22.0",
+        "tsconfig-paths": "^3.14.1"
       },
       "dependencies": {
         "debug": {
@@ -15080,9 +15118,9 @@
       "integrity": "sha512-Rc2suX5meI0S3bfdZuA7JMFBGkJ875ApfVyq2WHELjBiiG22My/l7/8zPpH/CfFVQHuVLd8NLR0nv6vi0BYYKA=="
     },
     "json5": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.1.tgz",
-      "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==",
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
       "dev": true
     },
     "jsx-ast-utils": {
@@ -16637,9 +16675,9 @@
       },
       "dependencies": {
         "json5": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
-          "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
           "dev": true,
           "peer": true,
           "requires": {
@@ -16866,11 +16904,6 @@
           "version": "2.3.1",
           "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
           "integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
-        },
-        "yallist": {
-          "version": "4.0.0",
-          "bundled": true,
-          "extraneous": true
         }
       }
     },