Custom SVG Icon for Login/Logout Button

Hello Webflow Community,

I am looking to replace the default text (“Log in” / “Log out”) on the login/logout button with a custom SVG icon. However, I am facing an issue where the text reverts back to its default state upon each page load, causing the icon to flicker.

Here’s the script I’ve used to implement the icon:

Unfortunately, the script needs to run twice to counter Webflow’s automatic text update, which causes more flickering. Has anyone managed to integrate a stable icon replacement for the login/logout button without this flickering issue? Any suggestions on a more efficient script or a different approach within Webflow’s settings would be greatly appreciated.

Additionally, if there are upcoming features that might help with this issue, I’d love to hear about them. Attached is a GIF demonstrating the flickering effect.

Thanks in advance for any help you can provide!


Here is the live site (script is currently not active on the live site): Live Site
Here is my site Read-Only: Read Only link
Here is a screen recording video of the flickering: Screen Recording Video