diff --git a/crates/op-editor-ui/src/widgets/property_panel_effects.rs b/crates/op-editor-ui/src/widgets/property_panel_effects.rs
index 10bc5527b..92f10ad5a 100644
--- a/crates/op-editor-ui/src/widgets/property_panel_effects.rs
+++ b/crates/op-editor-ui/src/widgets/property_panel_effects.rs
@@ -240,8 +240,16 @@ fn paint_effect_color_row(cx: &mut PaintCx<'_>, theme: &Theme, color: Color, rec
         origin: Point2D::new(rect.origin.x + 38.0, rect.origin.y + 7.0),
         size: Point2D::new(16.0, 16.0),
     };
-    super::property_panel_fill::paint_alpha_checker_public(cx, swatch, 3.0);
-    cx.backend.fill_round_rect(swatch, 3.0, color);
+    jian_widgets::components::swatch::Swatch {
+        color,
+        radius: 3.0,
+        border: false,
+    }
+    .paint(
+        cx.backend,
+        swatch,
+        &crate::widgets::button::tokens_from_theme(theme),
+    );
     // `rgba(r,g,b,a)` text after the swatch — matches the spec.
     let text = format!(
         "rgba({},{},{},{:.2})",
diff --git a/crates/op-editor-ui/src/widgets/property_panel_fill.rs b/crates/op-editor-ui/src/widgets/property_panel_fill.rs
index f5cd6e973..193dc2d08 100644
--- a/crates/op-editor-ui/src/widgets/property_panel_fill.rs
+++ b/crates/op-editor-ui/src/widgets/property_panel_fill.rs
@@ -558,8 +558,16 @@ fn paint_fill_gradient_body(
             origin: Point2D::new(hex_rect.origin.x + 6.0, hex_rect.origin.y + 5.0),
             size: Point2D::new(16.0, 16.0),
         };
-        paint_alpha_checker(cx, swatch, 3.0);
-        cx.backend.fill_round_rect(swatch, 3.0, stop.color);
+        jian_widgets::components::swatch::Swatch {
+            color: stop.color,
+            radius: 3.0,
+            border: false,
+        }
+        .paint(
+            cx.backend,
+            swatch,
+            &crate::widgets::button::tokens_from_theme(theme),
+        );
         // Display only `#RRGGBB` — the swatch on the left already
         // conveys per-stop transparency. Alpha is preserved at
         // commit time, so the user never types raw alpha digits.
@@ -734,49 +742,3 @@ pub fn stop_hex_rgb_only(hex: &str) -> String {
     };
     format!("#{}", body.to_uppercase())
 }
-
-/// Public re-export so sibling widget modules (e.g. the effects
-/// section's colour row) can reuse the same alpha-aware swatch
-/// background without duplicating the geometry.
-pub fn paint_alpha_checker_public(cx: &mut PaintCx<'_>, rect: Rect, radius: f32) {
-    paint_alpha_checker(cx, rect, radius);
-}
-
-/// Paint a 2×2 light/dark checker behind a colour swatch so a
-/// partially or fully transparent fill reads as "transparent"
-/// instead of looking like the input pill's background. The
-/// caller paints the (possibly translucent) stop colour on top.
-fn paint_alpha_checker(cx: &mut PaintCx<'_>, rect: Rect, radius: f32) {
-    let light = Color {
-        r: 0.95,
-        g: 0.95,
-        b: 0.95,
-        a: 1.0,
-    };
-    let dark = Color {
-        r: 0.78,
-        g: 0.78,
-        b: 0.78,
-        a: 1.0,
-    };
-    cx.backend.fill_round_rect(rect, radius, light);
-    let hx = rect.size.x / 2.0;
-    let hy = rect.size.y / 2.0;
-    // Skia has no clipped round-rect for sub-rect fills, so paint
-    // the two darker quadrants as plain rects — the surrounding
-    // light fill already supplies the rounded silhouette.
-    cx.backend.fill_rect(
-        Rect {
-            origin: Point2D::new(rect.origin.x + hx, rect.origin.y),
-            size: Point2D::new(hx, hy),
-        },
-        dark,
-    );
-    cx.backend.fill_rect(
-        Rect {
-            origin: Point2D::new(rect.origin.x, rect.origin.y + hy),
-            size: Point2D::new(hx, hy),
-        },
-        dark,
-    );
-}
diff --git a/vendor/jian b/vendor/jian
index 3b5db9116..9c13e8d76 160000
--- a/vendor/jian
+++ b/vendor/jian
@@ -1 +1 @@
-Subproject commit 3b5db9116dcb3c4582bd00098225f662099ee59c
+Subproject commit 9c13e8d767a2d0255ec6741c7ca9938520feaa99