diff --git a/astro.config.mjs b/astro.config.mjs
index 3369fe654bc1d1..e42e3b55e64186 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -146,6 +146,7 @@ export default defineConfig({
 			},
 			sidebar: await autogenSections(),
 			customCss: [
+				"./src/asides.css",
 				"./src/headings.css",
 				"./src/input.css",
 				"./src/kbd.css",
diff --git a/src/asides.css b/src/asides.css
new file mode 100644
index 00000000000000..71751b68cc447f
--- /dev/null
+++ b/src/asides.css
@@ -0,0 +1,36 @@
+.starlight-aside {
+	border: unset;
+	border-radius: 4px;
+
+	&.starlight-aside--note {
+		background-color: rgb(236, 244, 255);
+	}
+
+	&.starlight-aside--caution {
+		background-color: rgb(255, 248, 228);
+
+	}
+
+	.starlight-aside__title {
+		margin-left: 30px;
+
+		svg {
+			margin-left: -30px;
+		}
+	}
+
+	.starlight-aside__content {
+		margin-top: unset;
+		margin-left: 30px;
+	}
+}
+
+:root[data-theme="dark"] {
+	.starlight-aside--note {
+		background-color: rgb(0, 28, 67);
+	}
+
+	.starlight-aside--caution {
+		background-color: rgb(98, 73, 10);
+	}
+}
\ No newline at end of file