diff --git a/pkg/interface/src/views/apps/launch/components/tiles/clock.js b/pkg/interface/src/views/apps/launch/components/tiles/clock.js
index d939cdaab..0aa636c94 100644
--- a/pkg/interface/src/views/apps/launch/components/tiles/clock.js
+++ b/pkg/interface/src/views/apps/launch/components/tiles/clock.js
@@ -72,10 +72,19 @@ const Moon = ({ angle, ...props }) => {
         <rect x="-50" y="-50" height="200" width="200" fill="black" />
         <path d={dFromPhase(phase)} fill="white"/>
       </mask>
+      <circle
+        id="moonbg"
+        cx={CX + (RADIUS - 12) * Math.cos(degToRad(angle))}
+        cy={CY + (RADIUS - 12) * Math.sin(degToRad(angle))}
+        fill="rgba(255,255,255,0.6)"
+        r={CELESTIAL_BODY_SIZE / 2}
+        {...props}
+      ></circle>
       <use
       width={CELESTIAL_BODY_SIZE}
       height={CELESTIAL_BODY_SIZE}
       xlinkHref="#Moon-symbol" 
+      id="moon"
       x={cx}
       y={cy}
       transform={`rotate(${angle} ${cx + (CELESTIAL_BODY_SIZE / 2)} ${cy + (CELESTIAL_BODY_SIZE / 2)})`}