Svelte 5 Component Patterns

Svelte 5 introduces snippets and changes how components compose. Master these patterns for flexible, reusable component design.

Snippets (Replacing Slots)

Basic Snippet

Snippets are reusable template blocks:

<script>
  import Card from './Card.svelte';
</script>

<Card>
  {#snippet header()}
    <h2>Card Title</h2>
  {/snippet}