How to fix problem in Clarity. Styles not loading

Jakub Jezbera 0 Reputation points
2025-12-05T17:36:41.5366667+00:00

Hello,

I’m running into an issue with my webpage. It was working normally, but after I added Microsoft Clarity for session recording, the page now appears unstyled—only the HTML loads, and the CSS doesn’t seem to be applying.

I’m not sure why adding Clarity would affect the CSS, but I’d appreciate any help figuring out what’s causing the stylesheet not to load and how to fix it.

Thank you!

Developer technologies | Visual Studio | Other
Developer technologies | Visual Studio | Other
A family of Microsoft suites of integrated development tools for building applications for Windows, the web, mobile devices and many other platforms. Miscellaneous topics that do not fit into specific categories.
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. Q&A Assist
    2025-12-05T17:36:53.17+00:00
    AI generated content. This question contains an answer created with AI from Q&A Assist. Learn more

    To resolve the issue of your webpage appearing unstyled after adding Microsoft Clarity, there are several potential causes and solutions to consider:

    1. Public Access to CSS: Ensure that your CSS files are publicly accessible. If they are hosted in a non-public environment (like localhost or intranet), Clarity won't be able to access them.
    2. Cross-Origin Access: Check if your site is blocking access to Clarity. You may need to allow public and cross-origin access to your site, including requests that contain the header "User-Agent" : "Clarity-Bot".
    3. Permanent Stylesheets: If you are using temporary stylesheets, consider making them permanent or increasing their duration to ensure they are available when Clarity tries to access them.
    4. Correct Content Headers: Verify that your stylesheet and font files are served with the appropriate content headers. This ensures that Clarity can correctly interpret and use these resources.

    If you have tried these solutions and the issue persists, consider reaching out for support by sending an email to clarityMS@microsoft.com with details about the problem, including links to the affected recordings.


    References:

    0 comments No comments

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.