diff --git a/nx-dev/ui-markdoc/src/lib/tags/cards.component.tsx b/nx-dev/ui-markdoc/src/lib/tags/cards.component.tsx
index cb8fb56506..a4a3b2c1d8 100644
--- a/nx-dev/ui-markdoc/src/lib/tags/cards.component.tsx
+++ b/nx-dev/ui-markdoc/src/lib/tags/cards.component.tsx
@@ -58,7 +58,7 @@ export function Card({
     >
       {!!hasYoutubeId && (
         <img
-          className="!m-0 aspect-video rounded-md"
+          className="!m-0 aspect-video rounded-l-md"
           alt="Youtube Link"
           src={`https://img.youtube.com/vi/${hasYoutubeId}/default.jpg`}
         />
diff --git a/nx-dev/ui-markdoc/src/lib/tags/personas.component.tsx b/nx-dev/ui-markdoc/src/lib/tags/personas.component.tsx
index 45ee91b931..e9c5dadf00 100644
--- a/nx-dev/ui-markdoc/src/lib/tags/personas.component.tsx
+++ b/nx-dev/ui-markdoc/src/lib/tags/personas.component.tsx
@@ -182,7 +182,7 @@ export function Persona({
   const ui = typeMap[type];
 
   return (
-    <aside className="relative flex overflow-hidden rounded-md bg-slate-50 p-4 ring-1 ring-slate-100 transition hover:bg-slate-50/40 dark:bg-slate-800/40 dark:ring-slate-700 dark:hover:bg-slate-800/60">
+    <aside className="relative flex overflow-hidden rounded-md border border-slate-100 bg-slate-50 p-4 transition hover:bg-slate-50/40 dark:border-slate-800/40 dark:bg-slate-800/60 dark:hover:bg-slate-800">
       <div className="flex-shrink-0">{ui.image}</div>
       <div className="ml-4">
         {title && <h5 className="mt-0 text-base font-medium">{title}</h5>}