diff --git a/src/ui.tsx b/src/ui.tsx index 2ca50a1..e48d3de 100644 --- a/src/ui.tsx +++ b/src/ui.tsx @@ -287,8 +287,10 @@ function Plugin () { .resize-hitbox { opacity: 0; transition: opacity 120ms ease, background 120ms ease, border-color 120ms ease; - background: rgba(255, 255, 255, 0.4); - border: 1px solid rgba(255, 255, 255, 0.55); + /* Light fill (visible on dark themes) + mid-gray border (visible on light + themes) so the handles read on either Figma theme. */ + background: rgba(255, 255, 255, 0.5); + border: 1.5px solid rgba(110, 110, 110, 0.9); border-radius: 4px; } /* Hovering any handle (or anywhere in the window) reveals all handles. */ @@ -296,8 +298,8 @@ function Plugin () { .plugin-root:has(.resize-hitbox:hover) .resize-hitbox { opacity: 1; } /* The specifically hovered handle is brighter. */ .resize-hitbox:hover { - background: rgba(255, 255, 255, 0.9); - border-color: rgba(255, 255, 255, 1); + background: rgba(255, 255, 255, 0.95); + border-color: rgba(80, 80, 80, 1); } `}