diff --git a/headless-services/sprotty-si-view/client/css/diagram.css b/headless-services/sprotty-si-view/client/css/diagram.css
index f92c3f853..8d2bc681b 100644
--- a/headless-services/sprotty-si-view/client/css/diagram.css
+++ b/headless-services/sprotty-si-view/client/css/diagram.css
@@ -15,9 +15,9 @@
  ********************************************************************************/
 
 .sprotty-node {
-    fill: #aae;
+    fill: rgb(229, 231, 231);
     stroke: #66b;
-    stroke-width: 3;
+    stroke-width: 2;
 }
 
 .sprotty-text {
@@ -28,7 +28,7 @@
 .sprotty-edge {
     fill: none;
     stroke: #488;
-    stroke-width: 2;
+    stroke-width: 1;
 }
 
 .sprotty-node.selected {
diff --git a/headless-services/sprotty-si-view/client/src/views.tsx b/headless-services/sprotty-si-view/client/src/views.tsx
index e92b7ff53..597e322f5 100644
--- a/headless-services/sprotty-si-view/client/src/views.tsx
+++ b/headless-services/sprotty-si-view/client/src/views.tsx
@@ -112,7 +112,10 @@ export class ChannelNodeView extends RectangularNodeView {
         const h = Math.max(node.size.height, 0);
         const path = `M 0 ${h} H ${w-8} A 8 ${h/2} 0 0 0 ${w-8} 0 H 0`;
         return <g>
-            <g class-sprotty-node={node instanceof SNode}>
+            <g class-sprotty-node={node instanceof SNode}
+               class-mouseover={node.hoverFeedback}
+               class-selected={node.selected}
+            >
                 <path d={path}/>
                 <ellipse cx="0" cy={h/2} rx="8" ry={h/2}/>
             </g>