Cloudinary Video Player

Lazy player (with poster URL)

Uses an explicit poster URL. Custom accent color and logo configured.

Load Player

Click the player or the button above to initialize. The button calls player.loadPlayer().

Scroll to load (auto-built poster)

No poster URL - built automatically from cloudName and publicId. Custom colors configured.

Scroll down - the player loads automatically when it enters the viewport.

Example code:

      
        // With explicit poster URL
        const player = await cloudinary.player('my-video', {
          cloudName: 'demo',
          publicId: 'sea_turtle',
          poster: 'https://res.cloudinary.com/demo/video/upload/so_0,f_auto,q_auto/sea_turtle.jpg',
          lazy: true,
          colors: { accent: '#ff4081' }
        });
        // await player.loadPlayer();

        // Auto-built poster from cloudName + publicId
        cloudinary.player('my-video', {
          cloudName: 'demo',
          publicId: 'sea_turtle',
          lazy: { loadOnScroll: true },
          colors: { base: '#0d1b2a', accent: '#00b4d8' }
        });