How to Crop Videos

By  on  

During a recent episode of the Script and Style podcast, I had noticed that the video recording had showed a bit of our internal chat that wasn't necessary for our viewers to see. While there's nothing wrong with giving viewers a peek into the show preparation, presenting the best possible video is our priority. So how can we crop a video via command line?

The amazing ffmpeg utility allows engineers to crop videos with one easy to use filter:

# Crop an image to 500x500 starting at 0x0
ffmpeg -i sns-episode.webm -filter:v "crop=500:500:0:0" sns-episode-cropped.mp4

The crop filter format is easy to follow: {desired_width}:{desired_height}:{start_x}:{start_y}.

I've written dozens of posts about ffmpeg and how it has the power to manipulate videos in amazing ways. Now you know how to crop videos quickly from command line!

Recent Features

  • By
    CSS Filters

    CSS filter support recently landed within WebKit nightlies. CSS filters provide a method for modifying the rendering of a basic DOM element, image, or video. CSS filters allow for blurring, warping, and modifying the color intensity of elements. Let's have...

  • By
    Designing for Simplicity

    Before we get started, it's worth me spending a brief moment introducing myself to you. My name is Mark (or @integralist if Twitter happens to be your communication tool of choice) and I currently work for BBC News in London England as a principal engineer/tech...

Incredible Demos

  • By
    Create a Simple News Scroller Using Dojo

    My journey into Dojo JavaScript has been exciting and I'm continuing to learn more as I port MooTools scripts to Dojo. My latest experiment is porting a simple new scroller from MooTools to Dojo. The code is very similar! The HTML The news items...

  • By
    Introducing MooTools Templated

    One major problem with creating UI components with the MooTools JavaScript framework is that there isn't a great way of allowing customization of template and ease of node creation. As of today, there are two ways of creating: new Element Madness The first way to create UI-driven...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!