Snapkit Logo

Visual Effects Parameters#

Apply creative visual effects to enhance your images with rotation, blur, grayscale conversion, and flipping.

Rotation#

Description#

Rotate the image by a specified angle in degrees.

Range#

  • -360 to 360 degrees
  • Angles are automatically normalized (e.g., 370° becomes 10°)

Usage#

?transform=rotation:90

Examples#

Original (0°)
Original
45° rotation
45 degrees
90° rotation
90 degrees
180° rotation
180 degrees

Common angles:

  • rotation:90 - Quarter turn clockwise
  • rotation:180 - Half turn
  • rotation:270 - Quarter turn counter-clockwise
  • rotation:15 - Slight artistic tilt

Blur#

Description#

Apply Gaussian blur effect to the image.

Range#

  • 0 to 20
  • Higher values create stronger blur
  • Values above 15 may significantly increase processing time

Usage#

?transform=blur:5

Examples#

Original (blur:0)
No blur
blur:2
Blur 2
blur:5
Blur 5
blur:10
Blur 10

Common use cases:

  • blur:1-2 - Subtle softening
  • blur:3-5 - Background blur for text overlay
  • blur:10-15 - Strong privacy blur
  • blur:15-20 - Maximum blur (slower processing)

Performance Note#

Higher blur values (15-20) consume more CPU resources and may increase processing time. Use lower values when possible.

Grayscale#

Description#

Convert the image to grayscale (black and white).

Usage#

?transform=grayscale

Examples#

Original
Original
Grayscale applied
Grayscale

Use cases:

  • Artistic portfolio images
  • Vintage/classic aesthetic
  • Print-friendly versions
  • Consistent styling across galleries

Flip (Vertical)#

Description#

Flip the image vertically (top to bottom).

Usage#

?transform=flip

Examples#

Original
Original
Flipped vertically
Flipped

Flop (Horizontal)#

Description#

Flip the image horizontally (left to right).

Usage#

?transform=flop

Examples#

Original
Original
Flopped horizontally
Flopped

Combining Effects#

You can combine multiple effects for creative results:

Rotation + Flip#

?transform=rotation:90,flip

Blur + Grayscale#

?transform=blur:5,grayscale

Multiple Effects#

?transform=rotation:15,blur:2,grayscale

With Sizing#

?transform=w:800,h:600,rotation:45,blur:3,fit:cover

Common Use Cases#

Background Images with Text Overlay#

?transform=w:1920,h:1080,blur:10,format:webp

Blur the background to make text more readable.

Artistic Portfolio#

?transform=w:800,grayscale,blur:1,format:webp

Create a cohesive black-and-white gallery aesthetic.

Privacy Protection#

?transform=extract:10-10-30-30,blur:20

Blur sensitive regions (faces, license plates, etc.).

Creative Rotation#

?transform=w:600,rotation:15,format:webp

Add visual interest with slight rotation.

Processing Order#

Effects are applied in this order:

  1. Extract (region extraction)
  2. Resize (width/height/fit/dpr)
  3. Rotation
  4. Flip/Flop
  5. Blur
  6. Grayscale
  7. Format conversion

Understanding the processing order helps predict the final result when combining multiple transformations.

Next Steps#