Issue #6659Opened November 25, 2025by NilLlisterri1 reactions

BUG: Symbol styles not synced

Question

GrapesJS version

  • I confirm to use the latest version of GrapesJS

What browser are you using?

Firefox 145.0 (64-bit)

Reproducible demo link

https://jsfiddle.net/artur_arseniev/ta19s6go/

Describe the bug

How to reproduce the bug? Go to the official Symbols demo, create a symbol and change the text color of the main symbol. Instance symbols are not updated.

What is the expected behavior? The styles of the symbols should be updated, as seen in the PR video.

What is the current behavior? Styles are not updated, unlike new components, texts, etc.

https://github.com/user-attachments/assets/984ab313-ee64-4f32-a231-4cd8d4d5cc1b

PS: Thank you for this awesome editor!!

Code of Conduct

  • I agree to follow this project's Code of Conduct

Answers (3)

NilLlisterriNovember 28, 20251 reactions

Got it, if I want to style something inside a symbol and share the changes I should add a class to it. Thank you both for the help!

lexoyoNovember 26, 20250 reactions

Hello This color is applied to the element, in grapesjs this means it will generate a css like #compid { color: red; } but IDs are unique in an HTML page, so the other symbol has a different ID It's a problem to me too, I'm not sure how that should be addressed... Maybe @artf has an idea

artfNovember 28, 20250 reactions

Sorry, not a bug, but a "feature" 😅

IMHO, component styles should not be bound to symbols; that's an easy way to override styles between same symbols (common thing). If you need the same styles, you simply leverage the classes.

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.