This article covers a free realtime HSL plugin for Figma for simultaneous color adjustment. In photography, HSL stands for Hue, Saturation, and Lightness. These three aspects are crucial for an attractive and perfectly balanced photo as well as design. Figma is a really nice designing app but it lacks the ability to handle colors as you can do in other editing apps like Photoshop.
Adjustments is a free HSL plug-in for Figma that brings Photoshop level color adjustments panel in Figma editor. From the Figma plugins, you can access the HSL adjustment panel on any design and do batch color operations on the selected design elements. It allows you to change the hue, saturation, and lightness of the selected design. You can change all three values independently from each other and see the outcome in realtime.
Also read: How to Add Photos to Figma Directly from Phone?
Simultaneous HSL Color Adjustment in Figma
To bring Photoshop level color adjustments to your Figma designs, all you have to do is add this plugin to your Figma editor. Just like all the plugins in Figma, when installed, it sits in the Plugins section of the editor menu. You can access the plugin from there which opens the HSL adjustment panel on top of your Figma editor.
The adjustment panel contains three scales for Hue, Saturation, and Lightness. The Hue scale ranges from 180 in each direction covering the VIBGYOR colors. Saturation and Lightness, both scales range from 100 to -100. The HSL adjustment panel is draggable, you can click and drag in anywhere on the Figma editor so it won’t be in your way.
This HSL adjustment panel allows you to tweak the color of multiple selected objects simultaneously. Together, all these sliders give you a powerful tool to adjust the colors of the design. You can use it to adjust the colors of selected objects, frames, and groups but be a little careful with your select numbers as large selected might affect the performance. The HSL adjustment affects the strokes, fills, color parameters and gradient stops. However, the current version of this plugin does not work with raster images but you can still have that in your selection.
Closing Words
This HSL adjustments plugin is a nice addition to the vibrant plugin library of Figma. Having the ability to adjust the Hue, Saturation, and Light within the Editor eliminates the need for any after-effects and saves your valuable time. It also gives your design a unique look that stands out and might help the design to get more attention.
