diff --git a/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/toolbar.tsx b/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/toolbar.tsx
index 536d341fa..fd67dd682 100644
--- a/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/toolbar.tsx
+++ b/src/designer/elsa-workflows-designer/src/modules/workflow-definitions/components/toolbar.tsx
@@ -9,15 +9,15 @@ export class Toolbar {
 
   render() {
     return (
-      <div class="elsa-panel-toolbar flex justify-center absolute border-b border-gray-200 top-0 px-1 pl-4 py-2 text-sm bg-white z-10">
-        <elsa-tooltip tooltipPosition="right" tooltipContent={<p class="text-gray-600 text-sm">Currently in development</p>}>
-          <button class="relative inline-flex items-center px-4 py-2 rounded border border-blue-600 bg-blue-600 text-sm font-medium text-white hover:bg-blue-700 focus:z-10 focus:outline-none focus:ring-blue-600 hover:border-blue-700">
+      <div class="elsa-panel-toolbar flex justify-center absolute border-b border-gray-200 top-0 px-1 pl-4 pb-2 text-sm bg-white z-10 space-x-2">
+        <elsa-tooltip tooltipPosition="right" tooltipContent={<p class="text-white text-sm">Currently in development</p>}>
+          <button class="btn btn-primary">
             Auto-Layout
           </button>
         </elsa-tooltip>
         <button
           onClick={this.zoomToFit}
-          class="relative ml-4 inline-flex items-center px-4 py-2 rounded border border-blue-600 bg-blue-600 text-sm font-medium text-white hover:bg-blue-700 focus:z-10 focus:outline-none focus:ring-blue-600 hover:border-blue-700"
+          class="btn btn-primary"
         >
           Zoom to fit
         </button>