diff --git a/render-wasm/src/render/rulers.rs b/render-wasm/src/render/rulers.rs
index 510979a2f8..582469e8ee 100644
--- a/render-wasm/src/render/rulers.rs
+++ b/render-wasm/src/render/rulers.rs
@@ -13,7 +13,7 @@ use super::fonts::FontStore;
 use crate::state::RulerState;
 use crate::view::Viewbox;
 
-const RULER_AREA_SIZE: f32 = 22.0;
+pub const RULER_AREA_SIZE: f32 = 22.0;
 const RULER_TICK_OFFSET: f32 = 15.0;
 const RULER_TICK_LEN: f32 = 4.0;
 const RULER_TICK_GAP: f32 = 2.0;
diff --git a/render-wasm/src/render/ui.rs b/render-wasm/src/render/ui.rs
index 3b69955a82..cf3f2d7963 100644
--- a/render-wasm/src/render/ui.rs
+++ b/render-wasm/src/render/ui.rs
@@ -65,13 +65,19 @@ pub fn render(render_state: &mut RenderState, shapes: ShapesPoolRef) {
     let viewbox = render_state.viewbox;
     let ruler_state = render_state.rulers;
     rulers::render(canvas, viewbox, &render_state.fonts, &ruler_state);
-    // TODO: pass guides data here
+
+    // Width of the ruler bars in document coordinates.
+    // Note that when rulers are hidden, guides are not shown either, so we
+    // can use a fixed value here.
+    let ruler_width = rulers::RULER_AREA_SIZE / viewbox.zoom;
+
     let (horizontal, vertical) = get_ui_state().guides();
     guides::render(
         canvas,
         zoom,
         render_state.options.dpr,
         viewbox.area,
+        ruler_width,
         horizontal,
         vertical,
     );
diff --git a/render-wasm/src/render/ui/guides.rs b/render-wasm/src/render/ui/guides.rs
index 07bc5a6f8a..8a9e3dcaa8 100644
--- a/render-wasm/src/render/ui/guides.rs
+++ b/render-wasm/src/render/ui/guides.rs
@@ -3,22 +3,43 @@ use skia_safe::{self as skia};
 use crate::math::Rect;
 use crate::ui::{Guide, GuideKind};
 
-/// Renders the ruler guides overlay using the guides provided by the host
-/// (ClojureScript) and stored in the render state.
+/// Renders the ruler guides, clipped out of the ruler bars.
 pub fn render(
     canvas: &skia::Canvas,
     zoom: f32,
     dpr: f32,
     area: Rect,
+    ruler_width: f32,
     horizontal: &[Guide],
     vertical: &[Guide],
 ) {
+    // Horizontal guides: clip out the top strip (horizontal ruler)
+    canvas.save();
+    canvas.clip_rect(
+        Rect::from_ltrb(area.left, area.top + ruler_width, area.right, area.bottom),
+        None,
+        false,
+    );
+
     for guide in horizontal {
         render_guide(canvas, zoom, dpr, area, *guide);
     }
+
+    canvas.restore();
+
+    // Vertical guides: clip out the left strip (vertical ruler)
+    canvas.save();
+    canvas.clip_rect(
+        Rect::from_ltrb(area.left + ruler_width, area.top, area.right, area.bottom),
+        None,
+        false,
+    );
+
     for guide in vertical {
         render_guide(canvas, zoom, dpr, area, *guide);
     }
+
+    canvas.restore();
 }
 
 pub fn render_guide(canvas: &skia::Canvas, zoom: f32, dpr: f32, area: Rect, guide: Guide) {