Stroke Width Randomizer

About this plugin

A powerful Figma plugin that applies random stroke widths to selected objects within a customizable range. Perfect for creating organic, hand-drawn effects or adding visual variety to your designs.

ㅤ

Features

1. Live Preview: See changes in real-time as you adjust settings
2. Customizable Range: Set minimum and maximum stroke width values (0-100px)
3. Smart Controls: Interactive sliders and numeric inputs with keyboard shortcuts
4. Zero-Stroke Handling: Option to skip objects that don't have strokes
5. Nested Object Support: Apply randomization to child elements within groups and frames

ㅤ

ㅤ

➊ Getting Started

1. Select Objects: Choose one or more objects in your Figma canvas that you want to apply random stroke widths to
2. Open Plugin: Go to Plugins → Stroke Width Randomizer
3. Adjust Settings: Configure your desired stroke width range and options
4. Preview Changes: The plugin shows live preview by default
5. Apply: Click "Apply Random Stroke" to finalize the changes

ㅤ

ㅤ

➋ Interface Overview

ㅤ

Stroke Width Range

1. Minimum Stroke Width: The lowest possible stroke width (0-100px)
2. Maximum Stroke Width: The highest possible stroke width (0-100px)
3. Use sliders for quick adjustments or input fields for precise values

ㅤ

Options

1. Skip Zero Stroke Objects: When enabled, objects without existing strokes will be ignored
2. Live Preview: Toggle real-time preview of changes (enabled by default)
3. Include Nested Objects: Apply randomization to child elements within selected groups/frames

ㅤ

Controls

1. Randomize: Generate a new random pattern while keeping the same settings
2. Apply Random Stroke: Apply the current preview to your selection permanently
3. Cancel: Close the plugin and revert any preview changes

ㅤ

ㅤ

➌ Keyboard Shortcuts

When focused on numeric input fields:

1. Arrow Keys: Adjust value by ±1
2. Shift + Arrow Keys: Adjust value by ±10
3. Cmd/Ctrl + Arrow Keys: Adjust value by ±0.1

Slider Shortcuts

1. Right-click or Double-click on minimum slider: Reset to 0
2. Drag sliders: Real-time value adjustment with live preview

ㅤ

ㅤ

➍ Advanced Usage

Working with Groups and Frames

The plugin can handle nested objects in two ways:

1. Selected Objects Only: Apply randomization only to the directly selected items
2. Include Nested Objects: Apply randomization to all child elements within selected groups, frames, or components

Zero-Stroke Handling

1. Skip Enabled: Objects without strokes remain unchanged
2. Skip Disabled: Objects without strokes will receive new random stroke widths and default black stroke color

Preview Mode

1. Live preview shows changes immediately as you adjust settings
2. Each preview uses a unique random seed for variation
3. The "Randomize" button generates new random patterns
4. Final application can either match the preview exactly or generate new random values

ㅤ

ㅤ

➎ Best Practices

1. Start with Preview: Always use the live preview to see how your settings affect the selection
2. Adjust Range Gradually: Begin with a small range and expand as needed
3. Consider Object Hierarchy: Use "Include Nested Objects" for complex groups
4. Save Originals: The plugin automatically saves original stroke widths for the session, but consider duplicating important objects
5. Experiment with Seeds: Use the "Randomize" button to explore different random patterns

ㅤ

ㅤ

Need more design tools? Visit Samolevsky.com to discover more plugins and resources.