Hello, I have got trouble with how Figma handles the CSS variable name when it ends with a number. Please, look at my screenshot.
Variable “c1 500” must not be “–c-1500”
Am I right ?
1 Like
Hi @Fred_Tinsel thank you for reporting this, I was also able to recreate this and I’ve reported this to our engineering team.
1 Like
Hi @Fred_Tinsel
I do not think this is a bug but more of a feature: to translate your variable so developers can actually use it.
Variables in CSS :
- have to start with the double hyphen
--
- can only be composed of
-
,_
and alphanumerical character[a-zA-Z0-9]
So a variable namedc1 500
cannot exist in CSS, that’s why Figma replaced it with something close (and valid)--c1-500
Hope it helped
Hello @Haroll
I don’t think so
because the trouble is not between “c1” and “500”
it’s between c
and 1
. This two character are attached.
And yes, as you said, a good transcription is --c1-500
but Figma send c-1500
If I remove the blank space between c1
and 500
to get a complete string, then I rename my variable by c1-500
, right?
But then Figma still convert it by c-1500
That’s a bug because my devs are really using --c1-500