Trim

      Last updated May 18, 2020

    The trim parameter removes pixels from the edge of an image by pixel or percentage value. This can be useful for removing whitespace and borders that appear on a source image.

    API Pattern

    trim={top},{right},{bottom},{left}

    Parameter

    Parameter Description
    trim Remove pixels from the edge of an image.

    Parameter Values

    Value Units Description
    top Pixels or Percentage Top Edge.
    right Pixels or Percentage Right Edge.
    bottom Pixels or Percentage Bottom Edge.
    left Pixels or Percentage Left Edge.

    Notes

    1. Values can be specified using CSS style shorthand values. (see CSS Margin or CSS Padding for more examples).
    2. CSS shorthand allows for all edges to be specified in one property.
    3. Pixel rounding is performed on all calculations in a decimal format (with as much accuracy as possible). The final value is then rounded down.

    Examples

    Description HTML Demo
    Trim top edge 25px, right edge 50px, bottom edge 75px and left edge 100px. <img src="image.jpg?trim=25,50,75,100"/> Example
    Trim top edge 25px, right and left edge 50px, bottom edge 75px. <img src="image.jpg?trim=25,50,75"/> Example
    Trim top and bottom edge 25px, right and left edge 50px. <img src="image.jpg?trim=25,50"/> Example
    Trim all edges by 25%. <img src="image.jpg?trim=0.25"/> Example
    Back to Top