screen-share

Integrates screen sharing components into LiveKit video rooms for React apps.

3|Updated Feb 14, 2026

Search Tags:#ui #component #livekit #webRTC #video conferencing #screen share

Ready to run

npx skills add https://github.com/mattwoodco/skills --skill screen-share

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: screen-share
Source: https://github.com/mattwoodco/skills/tree/main/skills/screen-share
Command: npx skills add https://github.com/mattwoodco/skills --skill screen-share

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill adds robust screen sharing capabilities to video conferencing applications, allowing users to present their screens and view others' shares seamlessly.

Core Features & Use Cases

Screen Sharing Toggle: Easily start and stop sharing your screen with a dedicated button.
Presenter View: Automatically switches the video layout to highlight the presenter when screen sharing is active, with a Picture-in-Picture (PiP) overlay of their camera feed.
Use Case: Integrate this into a live-streaming or video conferencing platform to enable presenters to share slides or demos while maintaining a view of other participants.

Quick Start

Add the screen-share skill to your video room application.

Frequently Asked Questions about screen-share

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I add screen sharing to a LiveKit video room in Next.js?▼

To add screen sharing to a LiveKit video room, integrate a dedicated toggle button that starts and stops broadcasting your screen within your Next.js App Router application. It provides a full-width view with a Picture-in-Picture camera overlay.

Does LiveKit screen sharing automatically switch to a presenter view?▼

Yes, LiveKit screen sharing features an auto-switching presenter layout. When a participant starts sharing, the video layout automatically highlights the full-width screen share with a Picture-in-Picture overlay of the presenter's camera feed.

Can I use this screen share component with my existing video conferencing UI?▼

Yes, you can use this screen share component with existing video-room and video-ui skills. It is designed to support Next.js applications using the App Router, seamlessly integrating into your current video conferencing platform setup.

What is the best way to show a presenter's camera while sharing slides in WebRTC?▼

The best way to show a presenter's camera while sharing slides in WebRTC is using a Picture-in-Picture overlay. This screen sharing feature automatically displays the presenter's camera feed over the full-width screen share view.

Do I need existing video-room skills to enable screen sharing?▼

Yes, you need existing video-room and video-ui skills to properly enable screen sharing. This component builds upon those foundations to add the toggle, presenter view, and Picture-in-Picture camera overlay to your LiveKit application.