Videos created using FFmpeg are not being displayed in web browsers such as Chrome, Firefox, and Safari

You do not specify a video codec for your format (-f mp4). In that case ffmpeg uses ‘a’ default video codec. If i run ffprobe on your file, the output for the video stream is:

Video: mpeg4 (Simple Profile)

According to developer.mozilla.org/en-US/docs/Web/Media/Formats/Containers#mpeg-4_mp4, firefox does not support this codec (as to the other browsers, please do your own research).

The solution is to use one of the supported video codecs, e.g. AVC (H.264) or VP9.

To specify the H.264 codec in ffmpeg use the argument -codec:v libx264.

To list all available encoders, run: ffmpeg -encoders

If the required codecs are not listed in the output, you have to configure ffmpeg and specify, e.g. --enable libx264.