May 27, 2025
Progressive Blur and Gradients in Hana
Level up your designs with eye candy blurs and gradients
Progressive Blurs became popular with the iOS glass UI aesthetic a few years ago, and have recently gained traction in UI design tools. However, it has remained mostly a complex technique that’s been difficult to use in motion design or real-time interactive environments.
Today, we are shipping real-time Progressive Blurs into Hana. For the first time, this type of blur is available for real-time use, with intuitive controls and no technical knowledge required, all within Hana’s infinite design canvas.
You can play with the scene below to see how it works.
How to add Progressive Blur in Hana
You can select any layer and add either Layer Blur or Background Blur. In both cases, you can choose if the blur is meant to be Uniform or Progressive.
A Progressive Blur works pretty much like a gradient, but instead of color, it transitions between two values of blur radius.
This is how Progressive Blur works in Hana
Smooth Gradients on Hana
You can now create gradients in Hana. You can choose between linear, radial, or polar gradients, and adjust the position directly from the canvas.
We are also introducing Smooth Gradients, which are gradients that use a Smooth Step interpolation to produce more natural blending between colors. Most design tools use gradients that rely on Linear interpolation, which produces common breaking points between each gradient "stop" color.
We implemented Smooth Gradients first on Spline's 3D editor a few years ago, and now we are bringing it to Hana.
SVG imports and more
In the last few weeks, we also shipped several improvements to Hana, including support for SVG files (you can now just drag and drop), improved performance, and reduced runtime size.
We also added several quality of life improvements, including a better color picker behavior, improved selection tools, and numerous small fixes to make the experience more consistent.
Experiences made with Hana
Try it now!
Here is a Spline Hana file for you to explore the capabilities of Progressive Blur and Gradients.
Design workflows are evolving
While simple at its core, these new features allow for a lot of creative control and creative outcomes like never before.
Being able to animate or create real-time interactions like this was never easy before, and now you can do it in a few seconds with Hana.
We can't wait to see what you can build!
—
The Spline Team