diff --git a/packages/web-kitchensink-reactnext/src/categories/blob/react/components/AudioFilePreview/index.tsx b/packages/web-kitchensink-reactnext/src/categories/blob/react/components/AudioFilePreview/index.tsx
index 05910db..67d2f52 100644
--- a/packages/web-kitchensink-reactnext/src/categories/blob/react/components/AudioFilePreview/index.tsx
+++ b/packages/web-kitchensink-reactnext/src/categories/blob/react/components/AudioFilePreview/index.tsx
@@ -212,9 +212,7 @@ export const AudioFilePreview = React.forwardRef<AudioFilePreviewDerivedComponen
                             <svg
                               aria-label="Pause"
                               viewBox="0 0 24 24"
-                              className="w-6 h-6 fill-none stroke-current stroke-2"
-                              strokeLinecap="round"
-                              strokeLinejoin="round"
+                              className="w-6 h-6 fill-none stroke-current stroke-2 linecap-round linejoin-round"
                             >
                               <rect
                                 x="6"
@@ -234,9 +232,7 @@ export const AudioFilePreview = React.forwardRef<AudioFilePreviewDerivedComponen
                             <svg
                               aria-label="Play"
                               viewBox="0 0 24 24"
-                              className="w-6 h-6 fill-none stroke-current stroke-2"
-                              strokeLinecap="round"
-                              strokeLinejoin="round"
+                              className="w-6 h-6 fill-none stroke-current stroke-2 linecap-round linejoin-round"
                             >
                               <polygon points="5 3 19 12 5 21 5 3" />
                             </svg>
diff --git a/packages/web-kitchensink-reactnext/src/categories/blob/react/components/VideoFilePreview/index.tsx b/packages/web-kitchensink-reactnext/src/categories/blob/react/components/VideoFilePreview/index.tsx
index 68ef95d..b66a490 100644
--- a/packages/web-kitchensink-reactnext/src/categories/blob/react/components/VideoFilePreview/index.tsx
+++ b/packages/web-kitchensink-reactnext/src/categories/blob/react/components/VideoFilePreview/index.tsx
@@ -128,9 +128,7 @@ export const VideoFilePreview = React.forwardRef<VideoFilePreviewDerivedComponen
                             <svg
                               aria-label="Pause"
                               viewBox="0 0 24 24"
-                              className="w-6 h-6 fill-none stroke-current stroke-2"
-                              strokeLinecap="round"
-                              strokeLinejoin="round"
+                              className="w-6 h-6 fill-none stroke-current stroke-2 linecap-round linejoin-round"
                             >
                               <rect
                                 x="6"
@@ -150,9 +148,7 @@ export const VideoFilePreview = React.forwardRef<VideoFilePreviewDerivedComponen
                             <svg
                               aria-label="Play"
                               viewBox="0 0 24 24"
-                              className="w-6 h-6 fill-none stroke-current stroke-2"
-                              strokeLinecap="round"
-                              strokeLinejoin="round"
+                              className="w-6 h-6 fill-none stroke-current stroke-2 linecap-round linejoin-round"
                             >
                               <polygon points="5 3 19 12 5 21 5 3" />
                             </svg>
diff --git a/packages/web-kitchensink-reactnext/src/styles/globals.css b/packages/web-kitchensink-reactnext/src/styles/globals.css
index 31d612f..24c5d7f 100644
--- a/packages/web-kitchensink-reactnext/src/styles/globals.css
+++ b/packages/web-kitchensink-reactnext/src/styles/globals.css
@@ -17,6 +17,14 @@
   .font-semi-expanded {
     font-stretch: semi-expanded;
   }
+
+  .linejoin-round {
+    stroke-linejoin: round;
+  }
+
+  .linecap-round {
+    stroke-linecap: round;
+  }
 }
 
 .slider {