Why is my text color different on my live site vs. the Replo editor?

If the text on your live Shopify site looks different than how it appears in the Replo editor, this is usually caused by your Shopify theme's CSS overriding Replo's styles. This commonly happens with span elements inside rich text components.

Quick Fix:

Add this CSS snippet using a Custom HTML component on your page:

.alchemy-reset .alchemy-rte span {
    color: inherit;
}

This forces span elements inside Replo rich text components to inherit their color from the parent element, overriding any theme styles.

Why This Happens?

Shopify themes often include global CSS rules that target common HTML elements like span. When Replo renders your page on the live site, these theme styles can override the colors you set in the Replo editor.

Still Having Issues?

If the CSS fix above doesn't resolve the issue, please contact [email protected] and we can help identify the specific theme conflict.