Hi
Thank you for creating very professional and nice looking template assets one can use.
I noticed these overlay assets are available in different colors.
I was wondering in what colors are they available and whether it’s possible to to use a custom color (e.g. a specific html hex color code)?
https://templates.shotstack.io/basic/asset/video/overlay/{{STYLE}}/{{COLOR}}/content-left-in.mov
We are continuously building more assets you can use but we don’t have a great place to share these yet. For now I’ve added three styles to a spreadsheet that contain all styles and links. We’ll look to update these with more in due course.
In terms of choosing your own colours that is possible by using a luma asset and a html asset.
HTML background: #1abc9c
HTML background: #bdc3c7
HTML background: #8e44ad
Just change the html background colour and your transition changes to your chosen hex colour.
{
"timeline": {
"soundtrack": {
"src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/music/unminus/palmtrees.mp3",
"effect": "fadeOut"
},
"fonts": [
{
"src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/fonts/OpenSans-Regular.ttf"
}
],
"background": "#000000",
"tracks": [
{
"clips": [
{
"asset": {
"type": "html",
"html": "<p>Turquoise</p>",
"css": "p { font-family: 'OpenSans'; font-size: 94px; color: #FFFFFF; }"
},
"start": 0,
"length": 3.5
}
]
},
{
"clips": [
{
"asset": {
"type": "luma",
"src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/luma-mattes/circles/center-double.mp4"
},
"start": 0,
"length": 1.76
},
{
"asset": {
"type": "html",
"html": "<div></div>",
"background": "#1abc9c"
},
"start": 0,
"length": 1.76
}
]
},
{
"clips": [
{
"asset": {
"type": "video",
"src": "https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/footage/road.mp4"
},
"start": 0,
"length": 4,
"offset": {
"x": 0,
"y": 0
}
}
]
}
]
},
"output": {
"format": "mp4",
"resolution": "hd"
}
}