diff --git a/Router.d.ts b/Router.d.ts
index 1c78760..ee5dc53 100644
--- a/Router.d.ts
+++ b/Router.d.ts
@@ -205,6 +205,10 @@ export default class Router extends SvelteComponent {
          * ````
          */
         routes: RouteDefinition,
+        /**
+         * Optional layout component to use as a parent for page component.
+         */
+        layout?: typeof SvelteComponent,
         /**
          * Optional prefix for the routes in this router. This is useful for example in the case of nested routers.
          */
diff --git a/Router.svelte b/Router.svelte
index ece9f4d..7c5d15f 100644
--- a/Router.svelte
+++ b/Router.svelte
@@ -241,19 +241,38 @@ function scrollstateHistoryHandler(href) {
 }
 </script>
 
-{#if componentParams}
-    <svelte:component
-    this="{component}"
-    params="{componentParams}"
-    on:routeEvent
-    {...props}
-    />
+{#if layout}
+    <svelte:component this="{layout}">
+        {#if componentParams}
+            <svelte:component
+            this="{component}"
+            params="{componentParams}"
+            on:routeEvent
+            {...props}
+            />
+        {:else}
+            <svelte:component
+            this="{component}"
+            on:routeEvent
+            {...props}
+            />
+        {/if}
+    </svelte:component>
 {:else}
-    <svelte:component
-    this="{component}"
-    on:routeEvent
-    {...props}
-    />
+    {#if componentParams}
+        <svelte:component
+        this="{component}"
+        params="{componentParams}"
+        on:routeEvent
+        {...props}
+        />
+    {:else}
+        <svelte:component
+        this="{component}"
+        on:routeEvent
+        {...props}
+        />
+    {/if}
 {/if}
 
 <script>
@@ -277,6 +296,11 @@ import {parse} from 'regexparam'
  */
 export let routes = {}
 
+/**
+ * Optional layout component to use as a parent for page component.
+ */
+export let layout = null
+
 /**
  * Optional prefix for the routes in this router. This is useful for example in the case of nested routers.
  */