diff --git a/packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte b/packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte
index e960271b87..16ef04a7ca 100644
--- a/packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte
+++ b/packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte
@@ -19,7 +19,6 @@
   }
 </script>
 
-{#if !blocks.length}<i>Add a trigger to your automation to get started</i>{/if}
 <section class="canvas">
   {#each blocks as block, idx (block.id)}
     <div
@@ -57,9 +56,4 @@
     justify-content: flex-start;
     align-items: center;
   }
-
-  i {
-    font-size: var(--font-size-m);
-    color: var(--grey-5);
-  }
 </style>
diff --git a/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte b/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
index dbcbc33db0..b2773ae455 100644
--- a/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
+++ b/packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte
@@ -2,7 +2,8 @@
   import AutomationList from "./AutomationList.svelte"
   import CreateAutomationModal from "./CreateAutomationModal.svelte"
   import { Icon, Modal, Tabs, Tab } from "@budibase/bbui"
-  let modal
+
+  export let modal
 </script>
 
 <div class="title">
diff --git a/packages/builder/src/pages/builder/app/[application]/automate/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/automate/_layout.svelte
index d1aaeb0240..bc04548d8f 100644
--- a/packages/builder/src/pages/builder/app/[application]/automate/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/automate/_layout.svelte
@@ -1,22 +1,51 @@
 <script>
+  import { Heading, Body, Layout, Button, Modal } from "@budibase/bbui"
   import { automationStore } from "builderStore"
   import AutomationPanel from "components/automation/AutomationPanel/AutomationPanel.svelte"
   import SetupPanel from "components/automation/SetupPanel/SetupPanel.svelte"
+  import CreateAutomationModal from "components/automation/AutomationPanel/CreateAutomationModal.svelte"
+  $: automation = $automationStore.selectedAutomation?.automation
+  let modal
 </script>
 
 <!-- routify:options index=3 -->
 <div class="root">
   <div class="nav">
-    <AutomationPanel />
+    <AutomationPanel modal />
   </div>
   <div class="content">
-    <slot />
+    {#if automation}
+      <slot />
+    {:else}
+      <div class="centered">
+        <div class="main">
+          <Layout gap="S" justifyItems="center">
+            <svg
+              width="60px"
+              height="60px"
+              class="spectrum-Icon"
+              focusable="false"
+            >
+              <use xlink:href="#spectrum-icon-18-WorkflowAdd" />
+            </svg>
+            <Heading size="S">You have no automations</Heading>
+            <Body size="S">Let's fix that. Call the bots!</Body>
+            <Button on:click={() => modal.show()} size="S" cta
+              >Create automation</Button
+            >
+          </Layout>
+        </div>
+      </div>
+    {/if}
   </div>
   {#if $automationStore.selectedAutomation}
     <div class="setup">
       <SetupPanel />
     </div>
   {/if}
+  <Modal bind:this={modal}>
+    <CreateAutomationModal />
+  </Modal>
 </div>
 
 <style>
@@ -60,4 +89,21 @@
     background-color: var(--background);
     overflow-y: auto;
   }
+
+  .centered {
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .main {
+    width: 300px;
+  }
 </style>
diff --git a/packages/builder/src/pages/builder/app/[application]/automate/index.svelte b/packages/builder/src/pages/builder/app/[application]/automate/index.svelte
index d48bd36e59..e5dea10e0b 100644
--- a/packages/builder/src/pages/builder/app/[application]/automate/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/automate/index.svelte
@@ -15,13 +15,3 @@
     }
   })
 </script>
-
-<i>Create your first automation to get started</i>
-
-<style>
-  i {
-    font-size: var(--font-size-m);
-    color: var(--grey-5);
-    margin-top: 2px;
-  }
-</style>
