Skip to main content

Unity Pro Tip: Gradient Property Color Stepping

·434 words·3 mins

Gradient Property Color Step Example
An example of the fixed color step of the gradient property.

Unity updates fast and furiously and one thing you might have missed is the Gradient property update. With them already working on 2017.2, they have been busting it out! With this breakneck pace, you will undoubtedly miss some the coolness. Now, commercially, I am still on 5.6, but that just got released this year so I don’t feel too bad. Plus, there are a bunch of issues I encountered migrating to 2017 with Text Mesh Pro. So, if you are going to start a new project, go for it but I warn you, migrating existing projects will be a pain.

One of the little things you can find in 5.6 and above that is super useful is the upgrades to the Gradient property. Most commonly found in the Particle System component, the Gradient property can handle the linear interpolation of up to 8 colors. It also handles the interpolation of alpha separately with the same 8 key limit but on a separate track, meaning it’s not tied to the color keys. If you have not already used it for something else, consider it! As a programmer, you can expose color transitions for artists and game designers by just adding the field! It uses the same evaluation method as the curves property. Just call myGradient.Evaluate(0.5f);, 0,5f being the time or ratio. It serializes to boot, so great for JSON but it does create more data than you would think.

Gradient property
Color stepping in the new Gradient property.

That’s all in the past, what is in the present is the new Mode interpolation method. Before, the Gradient property just interpolated, so if you wanted a smooth transition, great, but if you wanted to have a hard step, you would have to use 2 keys close together. This brought your possible colors down from 8 to 4, not the best. Plus, it was a pain in the ass to try and get the keys as close together as possible. Now you can just set the mode to “Fixed” and “it’s a bingo!”*

Whats the application you say? Well, it’s a common issue in particle systems, especially in 2D flat color games. The artist has a very specific color pallet in mind that will work with the background. The interpolation of these colors will look horrible, think lerping from red to green. Now I can have a single particle system, that can have many different shapes (thanks to texture sheet animations) and up to 8 base colors.

[*] Bonus points if you know where that reference is from!

Roger Miller
Roger Miller
With 25 years in the technology industry, 6 in XR, 10 in the game industry, and on 4 continents, Roger comes with a breadth of knowledge. He has worked with industry-leading companies such as Ogilvy One, Amazon, and Meta, been a vendor for entertainment companies such as Unity, Amazon, Disney, and HBO, created solutions for BMW and Deloitte, and been nominated for awards such as the IMGA. He has spoken at Unity Unite, is a frequent speaker at Unity User Groups all over the country, and founded the Unity User Group in Bend, OR.