diff --git a/src/lib/components/Welcome.svelte b/src/lib/components/Welcome.svelte
new file mode 100644
index 0000000..414ecb9
--- /dev/null
+++ b/src/lib/components/Welcome.svelte
@@ -0,0 +1,14 @@
+<script lang="ts">
+	import { m } from '$lib/paraglide/messages.js';
+
+	let { cssClass = '' }: { cssClass?: string } = $props();
+</script>
+
+<section class={`bg-amber-50 ${cssClass}`}>
+	<h2 class="text-sm font-medium">{m['welcome.header']()}</h2>
+	<p>
+		{m['welcome.before_name']()}
+		<span class="font-bold">{m['name']()}</span>
+		{m['welcome.after_name']()}
+	</p>
+</section>