diff --git a/.changeset/style-minimap.md b/.changeset/style-minimap.md
new file mode 100644
index 0000000..cfe20a5
--- /dev/null
+++ b/.changeset/style-minimap.md
@@ -0,0 +1,5 @@
+---
+"@serverlessworkflow/diagram-editor": patch
+---
+
+Small styling tweaks to minimap and buttons
diff --git a/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.css b/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.css
index 42d7c67..5b40fff 100644
--- a/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.css
+++ b/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.css
@@ -65,6 +65,27 @@
     min-width: 0 !important;
     min-height: 0 !important;
   }
+
+  /* minimap */
+  .dec-root .react-flow__minimap{
+    --xy-minimap-background-color: var(--dec-minimap-bg);
+    --xy-minimap-mask-background-color: var(--dec-minimap-mask);
+    --xy-minimap-mask-stroke-color: var(--dec-minimap-viewport);
+    --xy-minimap-node-background-color: var(--dec-minimap-node);
+    --xy-minimap-node-stroke-color: var(--dec-minimap-node-stroke);
+    --xy-minimap-node-stroke-width: 2;
+    
+    border: 1px solid var(--dec-minimap-border);
+    border-radius:8px;
+    box-shadow: 0 4px 12px var(--dec-minimap-shadow);
+    overflow: hidden;
+}
+
+  .dec-root .react-flow__minimap-node {
+    fill: var(--dec-minimap-node);
+    stroke: var(--dec-minimap-node-stroke);
+    stroke-width: 2;
+}
 }
 
 /* custom nodes */
diff --git a/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.tsx b/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.tsx
index 861331f..7c2312b 100644
--- a/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.tsx
+++ b/packages/serverless-workflow-diagram-editor/src/react-flow/diagram/Diagram.tsx
@@ -176,7 +176,9 @@ export const Diagram = ({ divRef, ref, colorMode = "light" }: DiagramProps) => {
         nodesDraggable={!isReadOnly}
         nodesConnectable={!isReadOnly}
       >
-        {minimapVisible && <RF.MiniMap pannable zoomable position={"top-right"} />}
+        {minimapVisible && (
+          <RF.MiniMap pannable zoomable position={"bottom-left"} maskStrokeWidth={2} />
+        )}
 
         <RF.Panel position="top-right">
           <SidePanelTrigger />
diff --git a/packages/serverless-workflow-diagram-editor/src/side-panel/MermaidActions.tsx b/packages/serverless-workflow-diagram-editor/src/side-panel/MermaidActions.tsx
index 691fb7f..a74ed7a 100644
--- a/packages/serverless-workflow-diagram-editor/src/side-panel/MermaidActions.tsx
+++ b/packages/serverless-workflow-diagram-editor/src/side-panel/MermaidActions.tsx
@@ -74,11 +74,21 @@ export function MermaidActions({ model }: { model: Specification.Workflow }): Re
 
   return (
     <>
-      <Button onClick={handleCopyMermaid} variant="outline" size="sm">
+      <Button
+        onClick={handleCopyMermaid}
+        variant="outline"
+        size="sm"
+        className="dec:cursor-pointer"
+      >
         {isCopied ? <ClipboardCheck /> : <ClipboardPen />}
         {isCopied ? t("sidebar.exportMermaid.copied") : t("sidebar.exportMermaid.copy")}
       </Button>
-      <Button onClick={handleDownloadMermaid} variant="outline" size="sm">
+      <Button
+        onClick={handleDownloadMermaid}
+        variant="outline"
+        size="sm"
+        className="dec:cursor-pointer"
+      >
         <Download />
         {t("sidebar.exportMermaid.download")}
       </Button>
diff --git a/packages/serverless-workflow-diagram-editor/src/styles.css b/packages/serverless-workflow-diagram-editor/src/styles.css
index 486f72d..71a8400 100644
--- a/packages/serverless-workflow-diagram-editor/src/styles.css
+++ b/packages/serverless-workflow-diagram-editor/src/styles.css
@@ -49,13 +49,31 @@
     --dec-error-glow: rgba(239, 68, 68, 0.35);
     --dec-edge-selected: #aea6a6;
     --dec-edge-selected-condition: rgb(59 130 246);
+
+    /* minimap */
+    --dec-minimap-bg: #f8fafc;
+    --dec-minimap-mask: rgba(100, 116, 139, 0.25);
+    --dec-minimap-viewport: rgb(59 130 246);
+    --dec-minimap-node: #94a3b8;
+    --dec-minimap-node-stroke: #64748b;
+    --dec-minimap-border: #cbd5e1;
+    --dec-minimap-shadow: rgba(15, 23, 42, 0.12);
   }
 
-  .dec-root.dark{
-        --dec-error-accent: #f87171;
+  .dec-root.dark {
+    --dec-error-accent: #f87171;
     --dec-error-glow: rgba(248, 113, 113, 0.4);
     --dec-edge-selected: #aea6a6;
     --dec-edge-selected-condition: rgb(59 130 246);
+  
+    /* minimap */
+    --dec-minimap-bg: #1a202c;
+    --dec-minimap-mask: rgba(2, 6, 23, 0.5);
+    --dec-minimap-viewport: rgb(96 165 250);
+    --dec-minimap-node: #94a3b8;
+    --dec-minimap-node-stroke: #cbd5e1;
+    --dec-minimap-border: #2d3748;
+    --dec-minimap-shadow: rgba(0, 0, 0, 0.5);
   }
 
   .dec-root .dec-diagram-content {