FigmaToCode icon indicating copy to clipboard operation
FigmaToCode copied to clipboard

[Tailwind CSS] Enable color exact values for standard tailwind colors via tailwind css config export.

Open nicolas-cherel opened this issue 8 months ago • 10 comments

Hi, I very much like your plugin, but while finishing my last pass of usability evaluation I've hard time to figure out how to make sure that the tailwind class for colors would match colors from our design.

Seems that I stumble on a blocker: tailwind classes seems to go through a nearest value of the actual ones on the design. I've seen some alternative to that, such as tailwinds bracket colors for non standard colors, but this is too not a viable solution.

It looks like that the right solution would be a 2 stepped one: somehow, exporting a tailwind configuration for the project colors with their name, and then having FigmaToCode use those names in the tailwind class names.

There are questions left opened with such an approach, such as how to handle colors names collisions, especially for figmas designs that are use in a single tailwind project.

I'dont event know if it's feasible with figma plugin, but it looks to me that any figma tailwind code generator will have to tackle this to achieve a really valuable output

nicolas-cherel avatar Jun 10 '24 14:06 nicolas-cherel