diff --git a/demo/split-layout-lumo-theme-demos.html b/demo/split-layout-lumo-theme-demos.html
index 9674bae..77cbf0a 100644
--- a/demo/split-layout-lumo-theme-demos.html
+++ b/demo/split-layout-lumo-theme-demos.html
@@ -6,29 +6,6 @@
       }
     </style>
 
-    <h3>Default</h3>
-    <vaadin-demo-snippet id='split-layout-lumo-theme-demos-default'>
-      <template preserve-content>
-        <style>
-          vaadin-split-layout {
-            min-height: 200px;
-            flex: auto;
-          }
-        </style>
-        <div style="display: flex">
-          <vaadin-split-layout>
-            <div></div>
-            <div></div>
-          </vaadin-split-layout>
-
-          <vaadin-split-layout orientation="vertical">
-            <div></div>
-            <div></div>
-          </vaadin-split-layout>
-        </div>
-      </template>
-    </vaadin-demo-snippet>
-
     <h3>Small</h3>
     <vaadin-demo-snippet id='split-layout-lumo-theme-demos-small'>
       <template preserve-content>
@@ -37,6 +14,9 @@ <h3>Small</h3>
             min-height: 200px;
             flex: auto;
           }
+          div:first-child {
+            background-color: var(--lumo-shade-5pct);
+          }
         </style>
         <div style="display: flex">
           <vaadin-split-layout theme="small">
@@ -53,22 +33,25 @@ <h3>Small</h3>
       </template>
     </vaadin-demo-snippet>
 
-    <h3>Subtle</h3>
-    <vaadin-demo-snippet id='split-layout-lumo-theme-demos-subtle'>
+    <h3>Minimal</h3>
+    <vaadin-demo-snippet id='split-layout-lumo-theme-demos-minimal'>
       <template preserve-content>
         <style>
           vaadin-split-layout {
             min-height: 200px;
             flex: auto;
           }
+          div:first-child {
+            background-color: var(--lumo-shade-5pct);
+          }
         </style>
         <div style="display: flex">
-          <vaadin-split-layout theme="subtle">
+          <vaadin-split-layout theme="minimal">
             <div></div>
             <div></div>
           </vaadin-split-layout>
 
-          <vaadin-split-layout orientation="vertical" theme="subtle">
+          <vaadin-split-layout orientation="vertical" theme="minimal">
             <div></div>
             <div></div>
           </vaadin-split-layout>
diff --git a/theme/lumo/vaadin-split-layout.html b/theme/lumo/vaadin-split-layout.html
index cbc7048..1c528b2 100644
--- a/theme/lumo/vaadin-split-layout.html
+++ b/theme/lumo/vaadin-split-layout.html
@@ -6,35 +6,35 @@
 <dom-module id="lumo-split-layout" theme-for="vaadin-split-layout">
   <template>
     <style>
-      :host {
-        --lumo-split-layout-size: var(--lumo-space-s);
-      }
-
       [part="splitter"] {
-        min-width: var(--lumo-split-layout-size);
-        min-height: var(--lumo-split-layout-size);
+        min-width: var(--lumo-space-s);
+        min-height: var(--lumo-space-s);
         background-color: var(--lumo-contrast-5pct);
         transition: 0.1s background-color;
       }
 
       [part="handle"] {
-        display: flex;
-        align-items: center;
-        justify-content: center;
+        width: var(--lumo-size-m);
+        height: var(--lumo-size-m);
       }
 
       [part="handle"]::after {
         content: "";
-        display: block;
-        width: var(--lumo-space-xs);
-        height: var(--lumo-size-s);
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 45%;
+        right: 45%;
         border-radius: var(--lumo-border-radius);
         background-color: var(--lumo-contrast-30pct);
-        transition: 0.1s background-color;
+        transition: 0.1s all;
       }
 
       :host([orientation="vertical"]) [part="handle"]::after {
-        transform: rotate(90deg);
+        left: 0;
+        right: 0;
+        top: 45%;
+        bottom: 45%;
       }
 
       /* Hover style */
@@ -56,20 +56,40 @@
         background-color: var(--lumo-contrast-50pct);
       }
 
-      /* Small style */
+      /* Small/minimal */
 
-      :host([theme~="small"]) {
-        --lumo-split-layout-size: var(--lumo-space-xs);
+      :host([theme~="small"]) > [part="splitter"] {
+        min-width: 1px;
+        min-height: 1px;
+        background-color: var(--lumo-contrast-10pct);
       }
 
-      :host([theme~="small"]) [part="handle"]::after {
-        width: calc(var(--lumo-space-xs) / 2);
+      :host([theme~="minimal"]) > [part="splitter"] {
+        min-width: 0;
+        min-height: 0;
+        background-color: transparent;
       }
 
-      /* Subtle style */
+      :host([theme~="small"]) > [part="splitter"]::after,
+      :host([theme~="minimal"]) > [part="splitter"]::after {
+        content: "";
+        position: absolute;
+        top: -4px;
+        right: -4px;
+        bottom: -4px;
+        left: -4px;
+      }
 
-      :host([theme~="subtle"]) [part="splitter"] {
-        background-color: transparent;
+      :host([theme~="small"]) > [part="splitter"] > [part="handle"]::after,
+      :host([theme~="minimal"]) > [part="splitter"] > [part="handle"]::after {
+        opacity: 0;
+      }
+
+      :host([theme~="small"]) > [part="splitter"]:hover > [part="handle"]::after,
+      :host([theme~="small"]) > [part="splitter"]:active > [part="handle"]::after,
+      :host([theme~="minimal"]) > [part="splitter"]:hover > [part="handle"]::after,
+      :host([theme~="minimal"]) > [part="splitter"]:active > [part="handle"]::after {
+        opacity: 1;
       }
     </style>
   </template>