HSL Color Randomizer

HSL Color Randomizer

Figma Plugin

Description

A lightweight, fast Figma plugin that randomizes the colors of selected layers using HSL (Hue, Saturation, Lightness) ranges. It supports fills, strokes, and image fills, live preview, and an optional “group by original color” mode to keep identical source colors mapped to the same randomized color across your selection.

Key Features

  • Randomize fills, strokes, and image fills independently.
  • Control exact HSL ranges via dual-knob sliders and numeric inputs.
  • Live preview toggle to audition changes before applying.
  • Group-by-original-color option for consistent color mapping across identical source colors.
  • Reset buttons for each range (Hue 0–360, Saturation 0–100, Lightness 0–100).
  • Saves your settings between sessions.

What It’s Great For

  • Quickly exploring color variations on complex selections.
  • Creating palette diversity while keeping structural color relationships.
  • Randomizing image fills to generate playful variants.

Using the Plugin

➊ Select Layers

  • In your Figma file, select the layers you want to randomize. This can include shapes, frames, vectors, text, and any nodes with fills or strokes. Image fills are also supported.
  • If nothing is selected, the plugin shows an error and won’t apply changes

➋ Launch the Plugin

  • Open Plugins > HSL Color Randomizer.
  • The UI appears with Hue, Saturation, and Lightness controls, plus toggles and action buttons.

image gallery

➌ Set HSL Ranges

Use the dual sliders or numeric inputs to define ranges:

  • Hue: 0–360
  • Saturation: 0–100
  • Lightness: 0–100

Tip: Click the small reset button in each panel to return to full range.

➍ Choose What To Randomize

  • Randomize Fill Color — affects SOLID fills.
  • Randomize Stroke Color — affects SOLID strokes.
  • Randomize Image Fills — randomizes pixels of image fills within your HSL ranges.

Keep Color Relationships  (Optional)

  • Toggle Group by Original Color to ensure identical source colors map to the same randomized color. This is useful for maintaining palette structure while adding variation.

➎ Preview Changes

  • Use the preview toggle button at the top to turn live preview on/off.
  • With preview on, changes apply immediately as you adjust ranges and toggles.
  • Turning preview off restores all original colors for the current selection.

➏ Apply or Cancel

  • Randomize — applies changes without closing the dialog.
  • Apply — applies changes and closes the dialog.
  • Cancel — restores the original colors (if preview was active) and closes the dialog.

☻ Summary

This plugin gives you precise control over color randomization – letting you explore countless variations instantly while keeping your design relationships intact.

The live preview makes it effortless to experiment, and the group-by-color option ensures your palette structure stays consistent even as individual colors shift.

Leave a comment

HSL Color Randomizer

Version: 1.0.0

Updated:

  • 1.0.0 – Initial release.

  • Supported Versions:

    • Compatible with Adobe Illustrator CS6 and later, including Adobe Illustrator CC versions.

    Operating Systems:

    • Works on both macOS and Windows platforms.
  • End User License Agreement (EULA)

    Last Updated: 21.12.2024

    This End User License Agreement (“Agreement”) is a legal agreement between you (“User” or “Licensee”) and Samolevsky.com (“Licensor”) regarding the use of the Adobe Illustrator scripts (“Software”). By downloading, installing, or using the Software, you agree to be bound by the terms of this Agreement.

    1. Grant of License

    Licensor grants the User a non-exclusive, non-transferable, and revocable license to use the Software in accordance with this Agreement.

    • Free Software: If the Software is provided for free, you may use it for personal or commercial purposes without payment, subject to the restrictions outlined in this Agreement.
    • Paid Software: If the Software is provided for a fee, you may use it only after payment has been made in full.

    2. Usage Rights

    You are permitted to:

    • Install and use the Software on devices you own or control.
    • Use the Software in your personal or commercial projects, subject to compliance with this Agreement.

    3. Restrictions

    You may NOT:

    • Reverse engineer, decompile, or otherwise attempt to discover the source code, underlying ideas, or algorithms of the Software.
    • Reuse, incorporate, or integrate any portion of the Software into any other software, product, or project, except as expressly permitted by the Licensor in writing.
    • Resell, redistribute, or share the Software, whether in its original or modified form, without prior written consent from the Licensor.
    • Claim ownership of the Software or its underlying code.
    • Use the Software in any way that violates applicable laws or regulations.

    4. Ownership

    The Software and all intellectual property rights therein remain the exclusive property of the Licensor. This Agreement does not transfer ownership of the Software or any intellectual property rights to the User.

    5. Disclaimer of Warranties

    THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NONINFRINGEMENT. IN NO EVENT SHALL THE LICENSOR BE LIABLE FOR ANY CLAIM, DAMAGES, OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT, OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

    6. Limitation of Liability

    To the maximum extent permitted by law, Licensor shall not be liable for any damages, including but not limited to direct, indirect, incidental, special, or consequential damages, arising out of or related to the use or inability to use the Software.

    7. Termination

    This Agreement is effective until terminated. Licensor may terminate this Agreement immediately if you breach any term of this Agreement. Upon termination, you must cease all use of the Software and destroy any copies in your possession.

    8. Updates and Support

    Licensor is not obligated to provide updates, support, or maintenance for the Software. However, updates may be provided at the sole discretion of the Licensor.

    9. Governing Law

    This Agreement shall be governed by and construed in accordance with the laws of the State of New York, without regard to its conflict of law principles.

    10. Entire Agreement

    This Agreement constitutes the entire agreement between you and the Licensor concerning the Software and supersedes all prior or contemporaneous understandings regarding such subject matter.

    By using the Software, you acknowledge that you have read this Agreement, understand it, and agree to be bound by its terms.

    For any questions or concerns regarding this Agreement, please contact us at hello@samolevsky.com

Required Software

Figma

Figma is a cloud-based design and prototyping tool primarily used for user interface and user experience design. It allows designers, developers, and other stakeholders to collaborate in real-time on projects.

Browse More Plugins

  1. Explore Stroke Width Randomizer
    Stroke Width Randomizer

    Stroke Width Randomizer

    A powerful Figma plugin that applies random stroke widths to selected objects within a customizable range.

    Explore
  2. Explore Stroke Scaler
    Stroke Scaler

    Stroke Scaler

    A Figma plugin that allows you to scale and adjust stroke weights on selected objects with real-time preview.

    Explore
  3. Explore Select by Name
    Select by Name

    Select by Name

    Select by Name is a powerful Figma plugin that allows you to quickly find, filter, and select design elements by their names across your Figma documents. 

    Explore

Got questions?

Need help or have an idea to share? We’d love to hear from you! Whether you have questions, found a bug, have a feature request, or just want to share your feedback, reach out to us—we’re here for you!