diff --git a/apps/canvas/front/src/components/details.tsx b/apps/canvas/front/src/components/details.tsx
index 252952d..cb7d7fe 100644
--- a/apps/canvas/front/src/components/details.tsx
+++ b/apps/canvas/front/src/components/details.tsx
@@ -5,6 +5,7 @@
 import { AccordionItem } from "@radix-ui/react-accordion";
 import { useMemo, useState } from "react";
 import { Icon } from "./icon";
+import { Separator } from "./ui/separator";
 
 function unique<T>(v: T, i: number, a: T[]) {
 	return a.indexOf(v) === i;
@@ -42,18 +43,21 @@
 	const all = useMemo(() => open.concat(selected).filter(unique), [open, selected]);
 	return (
 		<Accordion type="multiple" value={all} onValueChange={(v) => setOpen(v)}>
-			{sorted.map((n) => (
-				<AccordionItem key={n.id} value={n.id} className="px-3">
-					<AccordionTrigger>
-						<div className="flex flex-row space-x-2">
-							{Icon(n.type)}
-							<span>{nodeLabel(n)}</span>
-						</div>
-					</AccordionTrigger>
-					<AccordionContent>
-						<NodeDetails {...n} />
-					</AccordionContent>
-				</AccordionItem>
+			{sorted.map((n, index) => (
+				<>
+					{index > 0 && <Separator className="my-2" />}
+					<AccordionItem key={n.id} value={n.id} className="px-3">
+						<AccordionTrigger>
+							<div className="flex flex-row space-x-2">
+								{Icon(n.type)}
+								<span>{nodeLabel(n)}</span>
+							</div>
+						</AccordionTrigger>
+						<AccordionContent>
+							<NodeDetails {...n} />
+						</AccordionContent>
+					</AccordionItem>
+				</>
 			))}
 		</Accordion>
 	);