Can I use an image for the background of a video?

Shotstack API
1

I want to use an image for the background of a video. Can that be done?

2

You can use the image asset to set the background of your video. If you want to layer assets on top of your background image you just need to make sure the image asset is positioned on the last track.

Image background

Default

The default crops the image to cover the viewport while maintaining the aspect ratio.

{
    "timeline": {
        "tracks": [
            {
                "clips": [
                    {
                        "asset": {
                            "type": "image",
                            "src": "https://shotstack-assets.s3.amazonaws.com/images/slideshow1.jpeg"
                        },
                        "start": 0,
                        "length": 5
                    }
                ]
            }
        ]
    },
    "output": {
        "format": "mp4",
        "resolution": "hd"
    }
}

Fit property: None

Setting the fit property to none keeps the image at the original size. In this case it is bigger than the HD viewport.

{
    "timeline": {
        "tracks": [
            {
                "clips": [
                    {
                        "asset": {
                            "type": "image",
                            "src": "https://shotstack-assets.s3.amazonaws.com/images/slideshow1.jpeg"
                        },
                        "start": 0,
                        "length": 5,
                        "fit": "none"
                    }
                ]
            }
        ]
    },
    "output": {
        "format": "mp4",
        "resolution": "hd"
    }
}

Fit property: Contain

Fits the entire asset within the viewport while maintaining the original aspect ratio.

{
    "timeline": {
        "tracks": [
            {
                "clips": [
                    {
                        "asset": {
                            "type": "image",
                            "src": "https://shotstack-assets.s3.amazonaws.com/images/slideshow1.jpeg"
                        },
                        "start": 0,
                        "length": 5,
                        "fit": "contain"
                    }
                ]
            }
        ]
    },
    "output": {
        "format": "mp4",
        "resolution": "hd"
    }
}