youtube-embed

• A Svelte component for embedding YouTube videos with optimized page load performance
• Loads YouTube thumbnails initially instead of full iframes to improve performance
• Only loads and plays the video when the user clicks the play button

Key Features:

• Customizable play button (can be replaced with your own button)
• Custom overlay styling (background color, transition effects)
• Custom title styling (color, shadow, font family)
• Option to use default thumbnails when custom ones aren't available
• Animation controls (can disable click animations)
• Support for custom thumbnails via slot

Usage Example:

<script>
  import Youtube from "svelte-youtube-embed";
</script>

<Youtube id="EBtsu6naB8g" />

Customization Options:

• Overlay styling with CSS variables (--overlay-bg-color, --overlay-transition)
• Title styling (--title-color, --title-shadow-color, --title-font-family)
• Alternative thumbnail mode (altThumb prop)
• Animation control (animations prop)
• Custom thumbnail slot (slot="thumbnail")

The component is designed for Svelte applications where performance-optimized YouTube embedding is needed, with extensive customization options for appearance and behavior.