Watermark with Text Demo

Uses a text operation to apply a watermark on your images diagonally. An expression in the stack config (see below) calculates the needed angle of the watermark, depending on the width and height of the image.

Furthermore, the text box is set to the output width (-50px) and the height is width / 7. With this and the resize_to_box option, the text size is automatically adjusted to that box.

URL:

See the text operation chapter for more info.

Stack config:

{
    "operations": [
        {
            "name": "resize",
            "options": {
                "mode": "fill",
                "upscale": false
            },
            "expressions": {
                "width": "$width"
            }
        },
        {
            "name": "text",
            "options": {
                "resize_to_box": true
            },
            "expressions": {
                "opacity": "$o",
                "text": "$t",
                "width":  "$width - 50",
                "height": "$width / 7",
                "font": "$font",
                "color": "$color",
                "angle": "-rad2deg(atan(image.height / image.width))"
            }
        }
    ],
    "variables": {
        "width": "500",
        "t": "My Watermark",
        "o": 20,
        "color": "000000",
        "font": "86d7ee"
    }
}

Photos by

Dominic Rüegg on Unsplash

Behzad Ghaffarian on Unsplash

Teo Zac on Unsplash