diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx
index 00f4f10..573bdd3 100644
--- a/app/dashboard/page.tsx
+++ b/app/dashboard/page.tsx
@@ -25,7 +25,11 @@ export default async function PageDashboard() {
   }))
 
   return (
-    <AppShell user={user ?? undefined} initialSidebarOpen={initialSidebarOpen}>
+    <AppShell
+      title="ダッシュボード"
+      user={user ?? undefined}
+      initialSidebarOpen={initialSidebarOpen}
+    >
       <DashboardPage
         histories={histories}
         discordLinked={!!user?.discordUserId}
diff --git a/app/medication/drugs/[id]/edit/page.tsx b/app/medication/drugs/[id]/edit/page.tsx
index c50b48e..6d0c0b7 100644
--- a/app/medication/drugs/[id]/edit/page.tsx
+++ b/app/medication/drugs/[id]/edit/page.tsx
@@ -25,6 +25,7 @@ export default async function PageDrugEdit({
 
   return (
     <AppShell
+      title={`${drug.name ?? ''} - 薬を編集`}
       user={user ?? undefined}
       initialSidebarOpen={initialSidebarOpen}
       breadcrumbs={[
diff --git a/app/medication/drugs/[id]/page.tsx b/app/medication/drugs/[id]/page.tsx
index 042b93c..5c875c6 100644
--- a/app/medication/drugs/[id]/page.tsx
+++ b/app/medication/drugs/[id]/page.tsx
@@ -25,6 +25,7 @@ export default async function PageDrugDetail({
 
   return (
     <AppShell
+      title={`${drug.name ?? ''} - 薬詳細`}
       user={user ?? undefined}
       initialSidebarOpen={initialSidebarOpen}
       breadcrumbs={[
diff --git a/app/medication/drugs/page.tsx b/app/medication/drugs/page.tsx
index b9fdc8e..06013a8 100644
--- a/app/medication/drugs/page.tsx
+++ b/app/medication/drugs/page.tsx
@@ -37,7 +37,11 @@ export default async function PageDrugs({
   }))
 
   return (
-    <AppShell user={user ?? undefined} initialSidebarOpen={initialSidebarOpen}>
+    <AppShell
+      title="薬一覧"
+      user={user ?? undefined}
+      initialSidebarOpen={initialSidebarOpen}
+    >
       <DrugListPage
         items={items}
         currentPage={data?.currentPage ?? 1}
diff --git a/app/medication/history/[id]/edit/page.tsx b/app/medication/history/[id]/edit/page.tsx
index 0776f68..7cc58fe 100644
--- a/app/medication/history/[id]/edit/page.tsx
+++ b/app/medication/history/[id]/edit/page.tsx
@@ -28,6 +28,7 @@ export default async function PageMedicationHistoryEdit({
 
   return (
     <AppShell
+      title={`${history.drugName ?? ''} - 服薬履歴を編集`}
       user={user ?? undefined}
       initialSidebarOpen={initialSidebarOpen}
       breadcrumbs={[
diff --git a/app/medication/history/[id]/page.tsx b/app/medication/history/[id]/page.tsx
index b9a572b..1a5394d 100644
--- a/app/medication/history/[id]/page.tsx
+++ b/app/medication/history/[id]/page.tsx
@@ -28,6 +28,7 @@ export default async function PageMedicationHistoryDetail({
 
   return (
     <AppShell
+      title={`${history.drugName ?? ''} - 服薬履歴詳細`}
       user={user ?? undefined}
       initialSidebarOpen={initialSidebarOpen}
       breadcrumbs={[
diff --git a/app/medication/history/page.tsx b/app/medication/history/page.tsx
index c932e51..e060748 100644
--- a/app/medication/history/page.tsx
+++ b/app/medication/history/page.tsx
@@ -47,7 +47,11 @@ export default async function PageMedicationHistory({
   }))
 
   return (
-    <AppShell user={user ?? undefined} initialSidebarOpen={initialSidebarOpen}>
+    <AppShell
+      title="服薬履歴"
+      user={user ?? undefined}
+      initialSidebarOpen={initialSidebarOpen}
+    >
       <MedicationHistoryPage
         items={items}
         currentPage={data?.currentPage ?? 1}
diff --git a/app/settings/page.tsx b/app/settings/page.tsx
index 6eb46d9..276db05 100644
--- a/app/settings/page.tsx
+++ b/app/settings/page.tsx
@@ -8,7 +8,11 @@ export default async function PageSettings() {
   const initialSidebarOpen = await getInitialSidebarOpen()
 
   return (
-    <AppShell user={user ?? undefined} initialSidebarOpen={initialSidebarOpen}>
+    <AppShell
+      title="設定"
+      user={user ?? undefined}
+      initialSidebarOpen={initialSidebarOpen}
+    >
       <SettingsPage userName={user?.name ?? ''} />
     </AppShell>
   )
diff --git a/components/layout/AppShell.tsx b/components/layout/AppShell.tsx
index e7387a7..7dc9a96 100644
--- a/components/layout/AppShell.tsx
+++ b/components/layout/AppShell.tsx
@@ -92,10 +92,13 @@ const NAV_EXTRA: NavItem[] = [
   { text: '設定', href: '/settings', icon: Settings },
 ]
 
+const ALL_NAV_ITEMS = [...NAV_GROUPS.flatMap((g) => g.items), ...NAV_EXTRA]
+
 const SIDEBAR_COLLAPSED_WIDTH = 56
 
 interface AppShellProps {
   children: React.ReactNode
+  title?: string
   user?: {
     name: string
     iconUrl: string | null
@@ -106,6 +109,7 @@ interface AppShellProps {
 
 export default function AppShell({
   children,
+  title,
   user,
   breadcrumbs,
   initialSidebarOpen = true,
@@ -136,8 +140,6 @@ export default function AppShell({
     [router],
   )
 
-  const allNavItems = [...NAV_GROUPS.flatMap((g) => g.items), ...NAV_EXTRA]
-
   const sideNavContent = (
     <nav className="flex flex-col gap-1 py-2">
       {NAV_GROUPS.map((group) => (
@@ -237,7 +239,7 @@ export default function AppShell({
               </Button>
             </div>
             <nav className="flex flex-1 flex-col items-center gap-1 py-2">
-              {allNavItems.map((item) => (
+              {ALL_NAV_ITEMS.map((item) => (
                 <button
                   type="button"
                   key={item.href}
@@ -303,12 +305,7 @@ export default function AppShell({
               <Menu className="size-4" />
             </Button>
           )}
-          <Link
-            href="/dashboard"
-            className="text-base font-bold hover:opacity-80"
-          >
-            Grace
-          </Link>
+          <h1 className="text-base font-semibold">{title ?? 'Grace'}</h1>
           <div className="flex-1" />
           <div className="flex items-center gap-1">
             <ThemeToggle />
diff --git a/components/page-component/DashboardPage.tsx b/components/page-component/DashboardPage.tsx
index 81f6ad0..e49575c 100644
--- a/components/page-component/DashboardPage.tsx
+++ b/components/page-component/DashboardPage.tsx
@@ -381,7 +381,6 @@ const MOCK_HISTORIES: MedicationHistory[] = Array.from(
 function MockDashboardContent() {
   return (
     <div className="flex flex-col gap-5">
-      <h1 className="text-2xl font-bold">ダッシュボード</h1>
       <Card>
         <CardHeader>
           <CardTitle>服薬分析</CardTitle>
@@ -410,7 +409,6 @@ export default function DashboardPage({
   if (discordLinked === false) {
     return (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">ダッシュボード</h1>
         <DiscordLinkPrompt>
           <MockDashboardContent />
         </DiscordLinkPrompt>
@@ -420,8 +418,7 @@ export default function DashboardPage({
 
   return (
     <div className="flex flex-col gap-5">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold">ダッシュボード</h1>
+      <div className="flex items-center justify-end">
         <PeriodSelect value={period} onChange={setPeriod} />
       </div>
 
diff --git a/components/page-component/DrugDetailPage.tsx b/components/page-component/DrugDetailPage.tsx
index c1aaa0c..946e018 100644
--- a/components/page-component/DrugDetailPage.tsx
+++ b/components/page-component/DrugDetailPage.tsx
@@ -20,8 +20,7 @@ export default function DrugDetailPage({ drug }: DrugDetailPageProps) {
 
   return (
     <div className="flex flex-col gap-5">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold">{drug.name || '薬詳細'}</h1>
+      <div className="flex items-center justify-end">
         <Button
           variant="outline"
           onClick={() => router.push(`/medication/drugs/${drug.id}/edit`)}
diff --git a/components/page-component/DrugEditPage.tsx b/components/page-component/DrugEditPage.tsx
index bc74fd8..f37b166 100644
--- a/components/page-component/DrugEditPage.tsx
+++ b/components/page-component/DrugEditPage.tsx
@@ -49,8 +49,6 @@ export default function DrugEditPage({ drug }: DrugEditPageProps) {
         handleSubmit()
       }}
     >
-      <h1 className="text-2xl font-bold">薬を編集</h1>
-
       <Card>
         <CardHeader>
           <CardTitle>基本情報</CardTitle>
diff --git a/components/page-component/DrugListPage.tsx b/components/page-component/DrugListPage.tsx
index e3d9cef..26a49e7 100644
--- a/components/page-component/DrugListPage.tsx
+++ b/components/page-component/DrugListPage.tsx
@@ -85,7 +85,6 @@ export default function DrugListPage({
   if (discordLinked === false) {
     return (
       <div className="flex h-full flex-col gap-5">
-        <h1 className="text-2xl font-bold">薬一覧</h1>
         <DiscordLinkPrompt>
           <DrugListTable
             items={MOCK_ITEMS}
@@ -103,8 +102,7 @@ export default function DrugListPage({
 
   return (
     <div className="flex h-full flex-col gap-5">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold">薬一覧</h1>
+      <div className="flex items-center justify-end">
         <Button onClick={() => setModalVisible(true)}>薬を登録</Button>
       </div>
       <DrugListTable
diff --git a/components/page-component/MedicationHistoryDetailPage.tsx b/components/page-component/MedicationHistoryDetailPage.tsx
index 97ca3d1..c3d677e 100644
--- a/components/page-component/MedicationHistoryDetailPage.tsx
+++ b/components/page-component/MedicationHistoryDetailPage.tsx
@@ -57,8 +57,7 @@ export default function MedicationHistoryDetailPage({
 
   return (
     <div className="flex flex-col gap-5">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold">服薬履歴詳細</h1>
+      <div className="flex items-center justify-end">
         <div className="flex items-center gap-2">
           <AlertDialog>
             <AlertDialogTrigger asChild>
diff --git a/components/page-component/MedicationHistoryEditPage.tsx b/components/page-component/MedicationHistoryEditPage.tsx
index b12fbb0..72b5366 100644
--- a/components/page-component/MedicationHistoryEditPage.tsx
+++ b/components/page-component/MedicationHistoryEditPage.tsx
@@ -59,8 +59,6 @@ export default function MedicationHistoryEditPage({
         handleSubmit()
       }}
     >
-      <h1 className="text-2xl font-bold">服薬履歴を編集</h1>
-
       <Card>
         <CardHeader>
           <CardTitle>基本情報</CardTitle>
diff --git a/components/page-component/MedicationHistoryPage.tsx b/components/page-component/MedicationHistoryPage.tsx
index 48a762d..8886407 100644
--- a/components/page-component/MedicationHistoryPage.tsx
+++ b/components/page-component/MedicationHistoryPage.tsx
@@ -100,7 +100,6 @@ export default function MedicationHistoryPage({
   if (discordLinked === false) {
     return (
       <div className="flex h-full flex-col gap-5">
-        <h1 className="text-2xl font-bold">服薬履歴</h1>
         <DiscordLinkPrompt>
           <MedicationHistoryTable
             items={MOCK_ITEMS}
@@ -118,12 +117,11 @@ export default function MedicationHistoryPage({
 
   return (
     <div className="flex h-full flex-col gap-5">
-      <div className="flex items-center justify-between">
-        <h1 className="text-2xl font-bold">服薬履歴</h1>
-        {drugs.length > 0 && (
+      {drugs.length > 0 && (
+        <div className="flex items-center justify-end">
           <Button onClick={() => setModalVisible(true)}>服薬を記録</Button>
-        )}
-      </div>
+        </div>
+      )}
       <MedicationHistoryTable
         items={items}
         currentPage={currentPage}
diff --git a/components/page-component/SettingsPage.tsx b/components/page-component/SettingsPage.tsx
index b9afa1c..6e6e509 100644
--- a/components/page-component/SettingsPage.tsx
+++ b/components/page-component/SettingsPage.tsx
@@ -50,8 +50,6 @@ export default function SettingsPage({ userName }: SettingsPageProps) {
 
   return (
     <div className="flex flex-col gap-5">
-      <h1 className="text-2xl font-bold">設定</h1>
-
       <DisplaySettings
         preference={preference}
         onChangePreference={setPreference}
diff --git a/stories/layout/AppShell.stories.tsx b/stories/layout/AppShell.stories.tsx
index 021895e..3204632 100644
--- a/stories/layout/AppShell.stories.tsx
+++ b/stories/layout/AppShell.stories.tsx
@@ -19,6 +19,7 @@ const meta = {
   },
   args: {
     user: sampleUser,
+    title: '薬一覧',
   },
 } satisfies Meta<typeof AppShell>
 
@@ -27,9 +28,10 @@ type Story = StoryObj<typeof meta>
 
 export const Default: Story = {
   args: {
+    title: 'ダッシュボード',
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">ダッシュボード</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },
@@ -44,9 +46,10 @@ export const DrugListActive: Story = {
     },
   },
   args: {
+    title: '薬一覧',
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">薬一覧</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },
@@ -61,6 +64,7 @@ export const DrugDetailWithBreadcrumbs: Story = {
     },
   },
   args: {
+    title: 'レボチロキシン - 薬詳細',
     breadcrumbs: [
       { text: 'Grace', href: '/dashboard' },
       { text: '薬一覧', href: '/medication/drugs' },
@@ -68,7 +72,7 @@ export const DrugDetailWithBreadcrumbs: Story = {
     ],
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">レボチロキシン</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },
@@ -83,9 +87,10 @@ export const MedicationHistoryActive: Story = {
     },
   },
   args: {
+    title: '服薬履歴',
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">服薬履歴</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },
@@ -100,14 +105,15 @@ export const MedicationHistoryDetailWithBreadcrumbs: Story = {
     },
   },
   args: {
+    title: 'レボチロキシン - 服薬履歴詳細',
     breadcrumbs: [
       { text: 'Grace', href: '/dashboard' },
       { text: '服薬履歴', href: '/medication/history' },
-      { text: '服薬履歴詳細', href: '/medication/history/1' },
+      { text: 'レボチロキシン', href: '/medication/history/1' },
     ],
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">服薬履歴詳細</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },
@@ -122,9 +128,10 @@ export const SettingsActive: Story = {
     },
   },
   args: {
+    title: '設定',
     children: (
       <div className="flex flex-col gap-5">
-        <h1 className="text-2xl font-bold">設定</h1>
+        <p className="text-sm text-muted-foreground">コンテンツエリア</p>
       </div>
     ),
   },