Hey guys, I did a quick search, but didn't find a solution to this... When I paste from Relume to Webflow, inside webflow, the buttons aren't coming across correctly. For example, see screenshot. I don't mind applying different classes/editing, but I hoped to avoid doing this with the templates. Any suggestions?
Perhaps it's related... but I also see this error message in multiple places (directly after pasting it in), not just about color.
Finally, I also notice that interactions don't seem to copy either.
Matthew H. Would you mind sending a read-only link?
Matt J. Sure, you mean like a preview link to the page? Or something with read-only access inside webflow?
Sure no worries, here's a quick guide on webflow read-only links: https://www.relume.io/resources/faqs/how-to-share-your-figma-webflow-projects-for-effective-support
I just copied another section at the end of the page. You can see the button with the right chevron is not styled correctly
Matthew H. yeah several issues going on here actually. I'll try to get you up to speed on the specific issues, but you'll likely want to spend some time with our getting started videos and browsing some of our other resources. So first thing's first, looks like this is an existing webflow project that you are trying to bring Relume components into because it does not have the style guide in it. You'll want to clone this style guide, and then open it up and grab the style guide page, and paste that into your project. You can follow that process as well as several other tips you'll need to follow in order to be successful with using Relume components in an existing Webflow project. https://www.relume.io/resources/docs/updating-existing-projects Secondly, it appears you may not have our chrome extension installed which prevents duplicate classes. You'll want to follow this guide on how to fix those duplicate classes you have, as well as how to prevent them in the future. https://www.relume.io/resources/docs/how-to-fix-and-prevent-class-duplication-in-webflow And lastly, here is the link to the getting started videos mentioned above: https://www.relume.io/resources/series-videos/introduction-getting-started Hope that helps - happy to answer any other questions you might have along the way here.
Pretty sure I have the style guide (I have the untitled ui library on relume that I've been copying in with no problem — the issue is with the non-untitled-ui components). Do those use a separate style guide?
yeah I just found that, and yeah thats not the same
I do have the chrome extension installed, but it hasn't worked to date to avoid class collisions
okay good to know
all helpful information, i should have asked more questions
How can I make sure importing this new style guide won't create conflicts with
Updates I made to the style guide I already copied in (tweaks to brand colors, hover states, etc...)
Copying items from the untitled UI (in relume library)
Hmm yeah, I guess I can do a quick test. Biggest issue I see is that the untitled UI has completely different button classes, which wouldn't be a problem if the classes were syncing properly. So if we fixed that first, then see what happens, then we might not need to bring in that style guide.
I have not seen or heard of any issues with class sync in several months now and I know we haven't made any changes to it in as long or longer. Can you try the troubleshooting tips at the bottom of that second guide I sent? https://www.relume.io/resources/docs/how-to-fix-and-prevent-class-duplication-in-webflow#troubleshooting-tips
but also the components we created versus what untitled UI has created are structured completely differently - so when you paste in one of our components with a button, it'll have extra classes that technically would be unnecessary to have with this untitled UI library since by default all buttons in this library have icons.
also in order for class sync to ever work again, regardless of anything, you'll have to clean up the existing duplicate classes, 100%. https://www.relume.io/resources/docs/how-to-fix-and-prevent-class-duplication-in-webflow#how-to-manually-fix-duplicated-classes
This will take hours to days to do. I guess it has to be done
https://relumecommunity.slack.com/archives/C02MS2V0FSP/p1739299758523179?thread_ts=1739222559.788209&cid=C02MS2V0FSP So, should I use one vs the other? Or use both and load untitled UI after the relume defaults?
I'm not seeing anything that would take hours or days to do unless I'm missing something - the quick search I did, I only saw a handful of duplicate classes. if you follow the guide I sent, I show you a quick way to resolve duplicate classes.
