diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx
index b80d7a7b..0e5c8b23 100644
--- a/src/pages/ProfilePage.tsx
+++ b/src/pages/ProfilePage.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { useParams, Link } from 'react-router-dom';
 import { useInView } from 'react-intersection-observer';
 import { useNostr } from '@nostrify/react';
@@ -1215,7 +1215,7 @@ export function ProfilePage() {
   );
   const effectiveProfileBackground = profileThemeColors ? profileThemeBackground : undefined;
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     if (!effectiveProfileColors) return;
 
     // Inject the profile theme's CSS vars onto :root