diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index d0ce517..5b7d0a8 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -7,7 +7,10 @@ const { title } = Astro.props;
 ---
 
 <!DOCTYPE html>
-<html lang="en">
+<html
+	lang="en"
+	class="box-border scroll-smooth bg-shibui-100 text-[125%] text-shibui-950 dark:bg-shibui-900 dark:text-shibui-200/[0.87]"
+>
 	<head>
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width" />
@@ -15,13 +18,7 @@ const { title } = Astro.props;
 		<meta name="generator" content={Astro.generator} />
 		<title>{title}</title>
 	</head>
-	<body>
+	<body class="flex h-screen flex-col font-sans font-normal leading-relaxed">
 		<slot />
 	</body>
 </html>
-<style is:global>
-	html {
-		font-family: system-ui, sans-serif;
-		background-color: #f6f6f6;
-	}
-</style>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index e235c39..551075f 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -4,8 +4,8 @@ import Layout from '../layouts/Layout.astro';
 
 <Layout title="Welcome to Astro.">
 	<main>
-		<h1 class="text-5 font-black text-orange-700">Hello, world!</h1>
-		<p class="mb-4 text-sky-400">
+		<h1>Hello, world!</h1>
+		<p>
 			Lorem ipsum dolor sit, amet consectetur adipisicing elit. Accusantium optio magni
 			asperiores fugiat, necessitatibus voluptatem sit quaerat pariatur natus, tempora
 			voluptatibus vero eveniet repudiandae, expedita libero. Cum cupiditate at placeat.
