Creatomate
API & Integration -> Quick Start

Add auto-generated subtitles

Transcribe a video or audio element and generate synchronized subtitles using RenderScript. For the template-based approach, see the guide.

Step 1
Add a named video element

Start by defining a video element and giving it a unique 
name
. This name is important: the subtitle element will use it to reference the video as the source of the transcription.
curl -X POST https://api.creatomate.com/v2/renders \
     -H "Content-Type: application/json" \
     -H "Authorization: Bearer YOUR_API_KEY_HERE" \
     -d '{
  "output_format": "mp4",
  "width": 720,
  "height": 1280,
  "elements": [
    {
      "name": "Video-1",
      "type": "video",
      "source": "https://cdn.creatomate.com…/demo/the-daily-stoic-podcast.mp4"
    }
  ]
}'

Step 2
Insert a text element for the subtitles

Add a text element. For now, this is just a styled placeholder; in the next step, we'll connect it to the video.Position the element in the lower portion of the frame and style it as you would any text element.
curl -X POST https://api.creatomate.com/v2/renders \
     -H "Content-Type: application/json" \
     -H "Authorization: Bearer YOUR_API_KEY_HERE" \
     -d '{
  "output_format": "mp4",
  "width": 720,
  "height": 1280,
  "elements": [
    {
      "name": "Video-1",
      "type": "video",
      "source": "https://cdn.creatomate.com…/demo/the-daily-stoic-podcast.mp4"
    },
    {
      "name": "Subtitles-1",
      "type": "text",
      "y": "80%",
      "width": "80%",
      "height": "35%",
      "x_alignment": "50%",
      "y_alignment": "50%",
      "fill_color": "#ffffff",
      "stroke_color": "#000000",
      "stroke_width": "1.6 vmin",
      "font_family": "Montserrat",
      "font_weight": "700",
      "font_size": "9.29 vmin",
      "background_color": "rgba(216,216,216,0)",
      "background_x_padding": "31%",
      "background_y_padding": "17%",
      "background_border_radius": "31%",
      "text": "This is a placeholder text"
    }
  ]
}'

Step 3
Connect the text element to the video

Replace the placeholder 
text
property with 
transcript_source
, referring to the name of the video element. Use 
transcript_effect
to control how subtitles are displayed.The 
highlight
effect illuminates each word as it is spoken. Use 
transcript_maximum_length
to limit how many characters appear at once. To explore available subtitle styles, use the template editor.The video now contains auto-generated subtitles synchronized to the video element. Prefer to use your own subtitles instead? See this example next.
curl -X POST https://api.creatomate.com/v2/renders \
     -H "Content-Type: application/json" \
     -H "Authorization: Bearer YOUR_API_KEY_HERE" \
     -d '{
  "output_format": "mp4",
  "width": 720,
  "height": 1280,
  "elements": [
    {
      "name": "Video-1",
      "type": "video",
      "source": "https://cdn.creatomate.com…/demo/the-daily-stoic-podcast.mp4"
    },
    {
      "name": "Subtitles-1",
      "type": "text",
      "y": "80%",
      "width": "80%",
      "height": "35%",
      "x_alignment": "50%",
      "y_alignment": "50%",
      "fill_color": "#ffffff",
      "stroke_color": "#000000",
      "stroke_width": "1.6 vmin",
      "font_family": "Montserrat",
      "font_weight": "700",
      "font_size": "9.29 vmin",
      "background_color": "rgba(216,216,216,0)",
      "background_x_padding": "31%",
      "background_y_padding": "17%",
      "background_border_radius": "31%",
      "transcript_effect": "highlight",
      "transcript_maximum_length": 14,
      "transcript_source": "Video-1"
    }
  ]
}'

Related resources