Skip to main content
Question

Figma's RGB color values seem to have a rounding error?


Jakob_Engelbrecht

It seems to me that Figma’s RGB color values are slightly off / have a rounding bug?

As mentioned in issue 10852 Figma’s RGB color values are in the [0, 1] range, whereas web RGB is in the [0, 255] range.

If that’s true, then multiplying the Figma value in the [0, 1] range with 255 should produce a valid value within the [0, 255] range. And similar dividing a web RGB value in the [0, 255] range with 255 should produce a valid value within the [0, 1] range.

But doing that doesn’t actually produce the correct values?

E.g. going from a web RGB value of [229, 241, 251] to Figma RGB should yield:

[229, 241, 251].map(val => val / 255);
// outputs =>
[
  0.8980392156862745,
  0.9450980392156862,
  0.984313725490196
]

But querying Figma on a node with that color fill yields:

figma.currentPage.selection[0].fills[0].color;
// outputs =>
{
  r: 0.8980392217636108,
  g: 0.9450980424880981,
  b: 0.9843137264251709
}

Comparison:

r / 255:   0.8980392156862745
r (Figma): 0.8980392217636108
                    ^ differs from here

g / 255:   0.9450980392156862
g (Figma): 0.9450980424880981
                    ^ differs from here

b / 255:   0.984313725490196
b (Figma): 0.9843137264251709
                     ^ differs from here

Going the other way from Figma RGB to web RGB yields:

[0.8980392217636108, 0.9450980424880981, 0.9843137264251709].map(val => val * 255)
// outputs =>
[229.00000154972076, 241.00000083446503, 251.00000023841858]

when it should be:

[229, 241, 251]

Has anyone else run into this issue? Or am I missing something around the conversion? 🤔 😅

6 replies

Jakob_Engelbrecht

Hey, anyone…?


Maxime_Daraize

You’re not alone. I am currently facing the same issue.


Jesse_Clark
  • New Member
  • 4 replies
  • March 31, 2023

Any updates here?


Jesse_Clark
  • New Member
  • 4 replies
  • August 28, 2023

Still waiting on this one…


  • 1 reply
  • July 15, 2024

Are there any updates on this? Trying to use the /variables endpoint of the Figma REST API, but facting these issues as well.

Original color in HEX: #eae3ff.
Color after converting Figma RGB: #cde5ff

This is kind of blocking as we don’t have reliable design tokens in our design system this way…


Evelyn_Hasama
Figmate

Thank you for bringing this to our attention. JavaScript floats are 64-bit, while Figma’s RGB values are stored as 32-bit floats, which only have the precision of 7 decimal places. Thus, converting web RGB values to Figma RGB values may introduce imprecision. Consider using this color converter, created by a member of the Figma community, to convert to and from Figma RGB.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings