diff --git a/dotcom-rendering/src/components/RichLink.tsx b/dotcom-rendering/src/components/RichLink.tsx
index f58d4735674..d42c033a028 100644
--- a/dotcom-rendering/src/components/RichLink.tsx
+++ b/dotcom-rendering/src/components/RichLink.tsx
@@ -10,6 +10,7 @@ import {
 	textSans,
 } from '@guardian/source-foundations';
 import { decidePalette } from '../lib/decidePalette';
+import { paletteDeclarations } from '../palette';
 import ArrowInCircle from '../static/icons/arrow-in-circle.svg';
 import type { Palette } from '../types/palette';
 import type { TagType } from '../types/tag';
@@ -160,7 +161,7 @@ const byline = css`
 	}
 `;
 
-const contributorImageWrapper = css`
+const contributorImageWrapper = (format: ArticleFormat) => css`
 	width: 5rem;
 	height: 5rem;
 	margin-left: auto;
@@ -170,6 +171,11 @@ const contributorImageWrapper = css`
 		height: 8.5rem;
 	}
 
+	${paletteDeclarations(format, 'light').join('')}
+	@media (prefers-color-scheme: dark) {
+		${paletteDeclarations(format, 'dark').join('')}
+	}
+
 	/* TODO remove the default img styling in ArticleBody.tsx - do we need direct element styling? */
 	img {
 		width: 100%;
@@ -311,7 +317,7 @@ export const RichLink = ({
 							)}
 						</div>
 						{!!(isOpinion && contributorImage) && (
-							<div css={contributorImageWrapper}>
+							<div css={contributorImageWrapper(format)}>
 								<Avatar
 									src={contributorImage}
 									alt={mainContributor}