Skip to main content
A_Gussenberg
July 13, 2023

Calculation formula within variable input

  • July 13, 2023
  • 74 replies
  • 11482 views

Hey folks, first of all I love the new variable function. Within the setup of spacings I want to reference my base value (“8”) and do calculations, e.g. (spacing-base)*2". This works fine and the value is calculated properly within the input to add a new variable. But I expected not that the calculation string changes to the absolute value. With this behaviour I loose the connection/ reference to my base value and the calculation is some how obsolete.

Does anybody feel the same?
Will there be an update?

image

Thanks

74 replies

April 22, 2024

This really is a key feature to enable scalable design systems. Would be super grateful if this could be added.

Dave_Curtis
April 26, 2024

When creating variables, it would be really useful to be able to include maths and text when defining a variable, which are kept up-to-date based on current values.

E.g.
With a shopping basket, I have the following variable
• Subtotal# (numeric)
Into which I add the value of each product selected in the basket.

From this value I would like to calculate
• VAT# (numeric) = Subtotal * 20%, truncated to 2 decimal places

And then display these variables in a currency
• Subtotal£ (String) = “£” + Subtotal#
• VAT£ (String) = “£” + VAT#
• Total£ (# String) = “£” + Subtotal#+VAT#

This way, I could just add/remove the product costs from Subtotal#, and use the strings for display in the prototype.

neelts
May 12, 2024

Hi @Dave_Curtis, my new plugin does exactly what you want, give it a try!
https://www.figma.com/community/plugin/1365339609215368041/dynamic-variables

Here’s the list of your expressions, but with the syntax of my plugin,
just paste these {{ }} expressions into the description fields of the corresponding variables and run the plugin Dynamic Variables → Start Monitoring Changes or Dynamic Variables → Update Once:

• VAT# (numeric) = {{ $Subtotal * .2 }}
• Subtotal£ (String) = {{ "£" + ( $Subtotal ).toFixed(2) }}
• VAT£ (String) = {{ "£" + ( $VAT ).toFixed(2) }}
• Total£ (# String) = {{ "£" + ( $Subtotal + $VAT ).toFixed(2) }}

Hope this helps!

neelts
May 12, 2024

And here’s the video showing how the plugin works in action based on your request:

neelts
May 12, 2024

Hey @A_Gussenberg, I just wanted to let you know that my new plugin Dynamic Variables does exactly what you’re looking for!
Here’s a quick video to show you how it works:

https://www.figma.com/community/plugin/1365339609215368041/dynamic-variables

@Josh_Mitchell your request is super close to this one, I posted video there too:

Let me know if you have any questions!

A_Gussenberg
May 14, 2024

Thanks @neelts - this looks really promising.

Ricardo_Santos
New Member
May 15, 2024

Please Figma team, add this feature

Ties
Active Member
May 27, 2024

Basically Excel/Sheets like input possibilities, that would make prototypes more lively and real.

I’d love to see a number to HEX converter (text) “HEX(red-value)” (or something like that) and the possibility to use a text variable as colour. That would be possible if variables would allow formulas as value.

+1

Leon_Wilson
New Member
July 12, 2024

+1 for this for sure…

Ant1
July 15, 2024

+1 for this