diff --git a/package.json b/package.json
index 3700118..485c590 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run package",
-		"build:theme": "smui-theme compile static/smui.css -i src/theme",
+		"build:theme": "smui-theme compile static/smui.css -i src/theme && sass --no-source-map src/theme/_custom.scss:static/custom.css",
 		"build:static": "npm run build --static && npm run build:theme",
 		"preview": "vite preview",
 		"package": "svelte-kit sync && svelte-package && publint",
@@ -29,7 +29,8 @@
 			"types": "./dist/index.d.ts",
 			"main": "./dist/index.js",
 			"svelte": "./dist/index.js"
-		}
+		},
+		"./theme/default": "./static/theme.scss"
 	},
 	"files": [
 		"dist",
diff --git a/src/app.html b/src/app.html
index fc9cae4..42b89bf 100644
--- a/src/app.html
+++ b/src/app.html
@@ -5,8 +5,8 @@
 		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 
-		<!-- SMUI Styles -->
-		<link rel="stylesheet" href="smui.css" />
+		<!-- SMUI Styles & custom theming -->
+		<link rel="stylesheet" href="theme.css" />
 		<!-- Material Icons -->
 		<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
 		<!-- Roboto -->
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index b867cf9..f2d837e 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,5 +1,4 @@
 <script lang="ts">
-  import "../theme/_custom.scss"
   import { tick } from 'svelte';
   import TabBar from "@smui/tab-bar"
   import Tab, { Label } from "@smui/tab"
diff --git a/static/custom.css b/static/custom.css
new file mode 100644
index 0000000..267e575
--- /dev/null
+++ b/static/custom.css
@@ -0,0 +1,72 @@
+.jsonschema-form-control.smui-paper {
+  padding: 0;
+}
+
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header {
+  background-color: #E4E4E4;
+  color: #6B6B6B;
+  border-radius: 6px;
+  align-items: center;
+  min-height: 36px;
+}
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title {
+  display: inline-flex;
+  align-items: center;
+  padding-left: 2px;
+}
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-object-title,
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-array-title,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-object-title,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title > .control-array-title {
+  padding-left: 8px;
+  text-transform: uppercase;
+}
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description {
+  font-style: italic;
+  opacity: 1;
+}
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__title,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header > .smui-accordion__header__description {
+  padding-top: 1px;
+  padding-bottom: 1px;
+}
+.control-object.smui-accordion > .smui-paper > .smui-accordion__header .mdc-icon-button,
+.control-array.smui-accordion > .smui-paper > .smui-accordion__header .mdc-icon-button {
+  display: inline-flex;
+  height: 34px;
+  justify-content: center;
+}
+.jsonschema-form > .smui-paper > .smui-paper__content > .control-object.smui-accordion > .smui-paper > .smui-accordion__header,
+.jsonschema-form > .smui-paper > .smui-paper__content > .control-array.smui-accordion > .smui-paper > .smui-accordion__header {
+  background-color: #6B6B6B;
+  color: #FFFFFF;
+}
+.control-object.smui-accordion > .smui-paper.no-disable > .smui-accordion__header,
+.control-array.smui-accordion > .smui-paper.no-disable > .smui-accordion__header {
+  padding-left: 18px;
+}
+
+.control-array .control-array-items > li {
+  border-bottom: #707070 solid 1px;
+  padding: 0.5rem 0;
+}
+
+.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__title.smui-accordion__header__title--with-description {
+  flex: 1;
+  max-width: unset;
+}
+.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__description {
+  min-width: 60%;
+}
+.smui-accordion .smui-accordion__panel > .smui-accordion__header > .smui-accordion__header__description:empty {
+  display: none;
+}
+
+.control-anyof .smui-paper__title {
+  margin-bottom: 1rem;
+}
diff --git a/static/theme.css b/static/theme.css
new file mode 100644
index 0000000..873a087
--- /dev/null
+++ b/static/theme.css
@@ -0,0 +1,2 @@
+@import url("smui.css");
+@import url("custom.css");
\ No newline at end of file