From 52fe6ecfe2d504f258980636b249c650ac5bad76 Mon Sep 17 00:00:00 2001
From: Mathias Jakobsen <mathias.jakobsen@overleaf.com>
Date: Thu, 19 Mar 2026 11:26:00 +0000
Subject: [PATCH] Merge pull request #32237 from overleaf/mj-experiment-icon

[web] Align experiment icons to Figma designs

GitOrigin-RevId: e615000ed1684a4cba14569d44601ba03a970039
---
 .../frontend/js/features/monthly-texlive/labs-widget.tsx    | 3 +--
 .../web/frontend/js/features/overleaf-code/labs-widget.tsx  | 3 +--
 services/web/frontend/stylesheets/modules/labs.scss         | 6 ++++++
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/services/web/frontend/js/features/monthly-texlive/labs-widget.tsx b/services/web/frontend/js/features/monthly-texlive/labs-widget.tsx
index 1dfb853cd2..fcadc9507c 100644
--- a/services/web/frontend/js/features/monthly-texlive/labs-widget.tsx
+++ b/services/web/frontend/js/features/monthly-texlive/labs-widget.tsx
@@ -39,8 +39,7 @@ const MonthlyTexliveLabsWidget = ({
   const logo = (
     <MaterialIcon
       type="construction"
-      size="2x"
-      className="rounded bg-primary-subtle"
+      className="rounded bg-primary-subtle labs-experiment-icon"
     />
   )
 
diff --git a/services/web/frontend/js/features/overleaf-code/labs-widget.tsx b/services/web/frontend/js/features/overleaf-code/labs-widget.tsx
index f69ac9e198..a30e5302bc 100644
--- a/services/web/frontend/js/features/overleaf-code/labs-widget.tsx
+++ b/services/web/frontend/js/features/overleaf-code/labs-widget.tsx
@@ -34,8 +34,7 @@ const LabsWidget = ({ setErrorMessage, labsProgram }: LabsWidgetProps) => {
       logo={
         <MaterialIcon
           type="code"
-          size="2x"
-          className="rounded bg-primary-subtle"
+          className="rounded bg-primary-subtle labs-experiment-icon"
         />
       }
       optedInDescription={description}
diff --git a/services/web/frontend/stylesheets/modules/labs.scss b/services/web/frontend/stylesheets/modules/labs.scss
index 68d1f985b0..77d9b802a2 100644
--- a/services/web/frontend/stylesheets/modules/labs.scss
+++ b/services/web/frontend/stylesheets/modules/labs.scss
@@ -48,6 +48,12 @@
       padding: var(--image-padding);
     }
 
+    .labs-experiment-icon {
+      padding: var(--spacing-03);
+      color: var(--green-70);
+      font-size: 24px;
+    }
+
     img {
       width: calc(var(--image-size) - var(--image-padding) * 2);
       height: calc(var(--image-size) - var(--image-padding) * 2);