Last updated: Aug-06-2025
OverviewLearn how to embed videos with the Cloudinary Video Player in your Next.js application, using the CldVideoPlayer component of the Next Cloudinary library.
Video tutorialYou can find the code from this tutorial in
GitHub.
Tutorial contentsThis tutorial presents the following topics. Click a timestamp to jump to that part of the video.
Embed the Cloudinary Video Player   0:14 Using the Next Cloudinary CldVideoPlayer component inside a Next.js application, you can embed a video that you can play using the Cloudinary Video Player. Set theid
of the Video Player to be able to call functions on it later, set its dimensions, and specify the video to play by setting src
to the public ID of the video in Cloudinary. For example: Configure the Video Player Change the colors to match your branding   0:46 Override the colors
prop by setting base
, text
and accent
. For example: Keep learning If you like this, you might also like...
Â
Â
Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.
Â
âï¸ Feedback sent!
âï¸Â  ErrorUnfortunately there's been an error sending your feedback.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4