Back to Plugins
Arrange hues

Arrange hues

Arrange color hues on a hue ramp and see which hues are used a lot and where there are gaps. Originally created to compare competitor brand colors and discover opportunities.How to use:Select layers of colors you want to arrange.Run the plugin.Limitations:Can't select more than 50 layers. You will have to split it into two runs if you have more colors to arrange.Works only with rectangles, ellipses, polygons, stars and vectors.Won't work on layers with gradients or multiple fills in it.If a selection has some non-compatible layer types, the plugin will just ignore those layers and still arrange the compatible ones.Future release ideas:Arrange colors based on saturation levels too.Probably a UI to control the size of the swatches.Show count of color swatches with same hue value (it's overlapped in the current version).---Credits:Used Marco Demaio's rgb2hsb function to get hue values from Figma object RGB values.Got more ideas or doubts?Connect with me on twitter.com/anveshdunna

sortbrand colorshuecolor arrangevectorarrangehue sortcolor sorthue arrangecolor areascolor

Plugin Preview

Arrange hues preview

About this plugin

Arrange color hues on a hue ramp and see which hues are used a lot and where there are gaps. Originally created to compare competitor brand colors and discover opportunities.How to use:Select layers of colors you want to arrange.Run the plugin.Limitations:Can't select more than 50 layers. You will have to split it into two runs if you have more colors to arrange.Works only with rectangles, ellipses, polygons, stars and vectors.Won't work on layers with gradients or multiple fills in it.If a selection has some non-compatible layer types, the plugin will just ignore those layers and still arrange the compatible ones.Future release ideas:Arrange colors based on saturation levels too.Probably a UI to control the size of the swatches.Show count of color swatches with same hue value (it's overlapped in the current version).---Credits:Used Marco Demaio's rgb2hsb function to get hue values from Figma object RGB values.Got more ideas or doubts?Connect with me on twitter.com/anveshdunna

Plugin Details

Version1
CreatedJuly 27, 2022
Last UpdatedAugust 5, 2022
Categoryshapes-colors
CreatorAnvesh Dunna
Stats188 installs, 14 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Editor Types:
    figma