Theme Designer tool availability for PrimeVue v4

[belvieir4]

Hi,

We're using PrimeVue v4 in production on a couple of products, and we follow the Figma UI Kit → Tokens Studio → Theme Designer workflow to generate our theme.

We used to run the Theme Designer from https://v4.primevue.org/, but the link has disappeared from the Theming menu there. The only Theme Designer we can currently reach, at https://primevue.dev/, along with its Figma plugin, generates themes using the v5 token structure (new component names, new dark mode structure) instead of the v4 one. That's blocking us from generating updated v4-compatible tokens.

Is the v4 Theme Designer being intentionally sunset in favor of v5, or is this a temporary gap? And if it is being retired, is there still a way to export v4-structured tokens, or a recommended path for teams that aren't ready to move to v5 yet?

Thanks!

[MelkorCC]

It seems to me like this was an intentional change, see the commit done by @cagataycivici ( primefaces/primevue@12a49d5 ) and i guess Theme designer for V4 is retired. I know some people developed their own converter for tokenstudio json -> primeuix theme. I have a developed a PoC for such a converter myself and if @cagataycivici confirms that ThemeDesigner for V4 is retired and PrimeTek is ok with me sharing it we could check if it is enough for your usecase or if further development would be needed.

Edit:
I think the commit i linked above was done because of https://github.com/orgs/primefaces/discussions/4872#discussioncomment-18257554 and ThemeDesigner is really only meant to support the latest version of primeuix, in this case the one also used in PrimeVue V5.

[belvieir4]

Hi @MelkorCC ,

Thanks for digging into this, the commit and discussion link are genuinely helpful context.

Would it be possible for you to share your PoC, or, if that's not an option yet, any references, packages, or tools that could help us put together a custom converter ourselves?

We'll start exploring the custom converter route on our end while we wait to hear back from PrimeVue's team.

Thanks again for flagging this!

[MelkorCC]

About sharing the PoC, as i wrote before i would like to wait for @cagataycivici to confirm that ThemeDesigner for V4 is retired. ThemeDesigner for V5 is not based on Tokenstudio anymore (the new Figmakit which is compatible with V5 is based on figma variables) so me sharing my PoC wouldn't in any way compete with PrimeTek sales then, which i don't want to do. I always had a good relationship with PrimeTek in the past and while the license change means my management decided to migrate to a different component framework i don't wish to create any harm to PrimeTek's sales or be involved in any drama.

Regarding resources that would help you / your organization to create such a converter it depends a bit on the route you want to go. My PoC uses nothing besides a JSON de- serialization lib, but i know that some people wanted a different output (in one examples css variables) and used style directory and token studios sd transforms package for that.

[cagataycivici]

Hello,

Theme Designer has been updated to be compatible with PrimeVue v5, PrimeNG v22 and PrimeReact v11. It includes support for new components e.g. Sidebar, InputColor and semantic tokens like typography tokens. One important change is moving from colorScheme property to light-dark syntax for color scheme based tokens.

The backend that handles Figma integration such as figma to theme or the migration assistant requires these versions and not compatible with older versions due to these changes. As a result the designer on PrimeNG v21 and PrimeVue v5 websites have been discontinued as their functionality cannot be supported anymore.

You can still export the tokens from UI Kit from Figma or via PrimeUI Figma plugin but need to do the theme conversion and migration yourself.

Please note that this is not intentional to force users to move to PrimeUI licensing, this was always the case before. Whenever a new version as out e.g. for PrimeNG v20, the older v19 theme designer was retired. Supporting multiple versions has always been out of scope.

[MelkorCC]

You can still export the tokens from UI Kit from Figma or via PrimeUI Figma plugin but need to do the theme conversion and migration yourself.

Please note that this is not intentional to force users to move to PrimeUI licensing, this was always the case before. Whenever a new version as out e.g. for PrimeNG v20, the older v19 theme designer was retired. Supporting multiple versions has always been out of scope.

@cagataycivici thanks for the clarification

@belvieir4 is a member of your organization active on the primetek community discord server? Would be cool if we could test if my PoC works for your use case at all or if a more sophisticated solution is required any way.

[belvieir4]

Thanks for the update, @cagataycivici.

I'll reach out to you on Discord so we can talk about your PoC, @MelkorCC. What's your user there? Thanks!

[MelkorCC]

What's your user there?

As i said we can connect in the PrimeTek community server. In the figma-ui-kit channel there is a thread regarding this issue, have a member of your organization drop a message there and I will reach out.