From 82bf30cb21670d6a8f6095d055dec6c320f8d3ad Mon Sep 17 00:00:00 2001
From: maanavd <maanavdalal@gmail.com>
Date: Fri, 10 Apr 2026 13:12:01 -0400
Subject: [PATCH 1/3] refactor(www): SDK-first website refresh

- Hero: Replace CLI install (winget/brew + foundry model run) with
  tabbed SDK install commands (pip/npm/dotnet/cargo) and per-language
  hello-world code snippets that show the full lifecycle
- Features: Fix code example from wrong API (getCatalog().getModel('gpt-oss-20b'))
  to correct SDK pattern (catalog.getModel('qwen2.5-0.5b') + download/load/chat)
- Download dropdown: Fix Rust package (foundry-local -> foundry-local-sdk),
  add WinML variants for all languages (pip/npm/dotnet/cargo)
- Fix all docs links from azure/ai-foundry/foundry-local/ to azure/foundry-local/
- Update footer tagline to SDK-era messaging
- Update config description and feature descriptions to reflect
  SDK-first positioning, ~20 MB runtime, EP management

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../lib/components/download-dropdown.svelte   |  91 ++++++-
 www/src/lib/components/home/features.svelte   |  28 +-
 www/src/lib/components/home/footer.svelte     |   4 +-
 www/src/lib/components/home/hero.svelte       |   2 +-
 www/src/lib/components/install-command.svelte | 245 +++++++++---------
 www/src/lib/config.ts                         |  12 +-
 6 files changed, 231 insertions(+), 151 deletions(-)

diff --git a/www/src/lib/components/download-dropdown.svelte b/www/src/lib/components/download-dropdown.svelte
index 9e52b3d4..f34b8190 100644
--- a/www/src/lib/components/download-dropdown.svelte
+++ b/www/src/lib/components/download-dropdown.svelte
@@ -39,9 +39,13 @@
 		windows: 'winget install Microsoft.FoundryLocal',
 		macos: 'brew install microsoft/foundrylocal/foundrylocal',
 		python: 'pip install foundry-local-sdk',
+		python_winml: 'pip install foundry-local-sdk-winml',
 		javascript: 'npm install foundry-local-sdk',
+		javascript_winml: 'npm install foundry-local-sdk-winml',
 		csharp: 'dotnet add package Microsoft.AI.Foundry.Local',
-		rust: 'cargo add foundry-local'
+		csharp_winml: 'dotnet add package Microsoft.AI.Foundry.Local.WinML',
+		rust: 'cargo add foundry-local-sdk',
+		rust_winml: 'cargo add foundry-local-sdk --features winml'
 	};
 
 	let copiedItem = $state<string | null>(null);
@@ -122,7 +126,7 @@
 
 		<DropdownMenu.Separator />
 		<DropdownMenu.Label class="text-muted-foreground text-xs font-normal">
-			Install SDK
+			Install SDK (Cross-Platform)
 		</DropdownMenu.Label>
 
 		<DropdownMenu.Group>
@@ -203,6 +207,89 @@
 			</button>
 		</DropdownMenu.Group>
 
+		<DropdownMenu.Separator />
+		<DropdownMenu.Label class="text-muted-foreground text-xs font-normal">
+			Install SDK (Windows + WinML hardware acceleration)
+		</DropdownMenu.Label>
+
+		<DropdownMenu.Group>
+			<button
+				type="button"
+				class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
+				onclick={() => copyToClipboard(commands.python_winml, 'python_winml')}
+				aria-label="Copy Python WinML SDK installation command"
+			>
+				<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html PythonIcon}</span>
+				<div class="flex flex-1 flex-col gap-1 px-2">
+					<span class="font-medium">Python SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
+					<code class="text-muted-foreground break-all text-xs">{commands.python_winml}</code>
+				</div>
+				{#if copiedItem === 'python_winml'}
+					<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
+					<span class="sr-only">Copied</span>
+				{:else}
+					<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
+				{/if}
+			</button>
+
+			<button
+				type="button"
+				class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
+				onclick={() => copyToClipboard(commands.javascript_winml, 'javascript_winml')}
+				aria-label="Copy JavaScript WinML SDK installation command"
+			>
+				<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html JavaScriptIcon}</span>
+				<div class="flex flex-1 flex-col gap-1 px-2">
+					<span class="font-medium">JavaScript SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
+					<code class="text-muted-foreground break-all text-xs">{commands.javascript_winml}</code>
+				</div>
+				{#if copiedItem === 'javascript_winml'}
+					<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
+					<span class="sr-only">Copied</span>
+				{:else}
+					<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
+				{/if}
+			</button>
+
+			<button
+				type="button"
+				class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
+				onclick={() => copyToClipboard(commands.csharp_winml, 'csharp_winml')}
+				aria-label="Copy C# WinML SDK installation command"
+			>
+				<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html CSharpIcon}</span>
+				<div class="flex flex-1 flex-col gap-1 px-2">
+					<span class="font-medium">C# SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
+					<code class="text-muted-foreground break-all text-xs">{commands.csharp_winml}</code>
+				</div>
+				{#if copiedItem === 'csharp_winml'}
+					<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
+					<span class="sr-only">Copied</span>
+				{:else}
+					<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
+				{/if}
+			</button>
+
+			<button
+				type="button"
+				class="hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground relative flex min-h-[44px] w-full cursor-pointer select-none items-start justify-between rounded-sm px-2 py-2.5 text-left text-sm outline-none transition-colors"
+				onclick={() => copyToClipboard(commands.rust_winml, 'rust_winml')}
+				aria-label="Copy Rust WinML SDK installation command"
+			>
+				<span class="mt-0.5 inline-flex shrink-0" aria-hidden="true">{@html RustIcon}</span>
+				<div class="flex flex-1 flex-col gap-1 px-2">
+					<span class="font-medium">Rust SDK <span class="text-xs text-muted-foreground">(WinML)</span></span>
+					<code class="text-muted-foreground break-all text-xs">{commands.rust_winml}</code>
+				</div>
+				{#if copiedItem === 'rust_winml'}
+					<Check class="size-4 shrink-0 text-green-600" aria-hidden="true" />
+					<span class="sr-only">Copied</span>
+				{:else}
+					<Copy class="size-4 shrink-0 opacity-50" aria-hidden="true" />
+				{/if}
+			</button>
+		</DropdownMenu.Group>
+
 		<DropdownMenu.Separator />
 
 		<DropdownMenu.Group>
diff --git a/www/src/lib/components/home/features.svelte b/www/src/lib/components/home/features.svelte
index e8c4c308..63f8e493 100644
--- a/www/src/lib/components/home/features.svelte
+++ b/www/src/lib/components/home/features.svelte
@@ -98,23 +98,26 @@
 					<div
 						class="mt-auto overflow-hidden rounded-xl bg-gray-900 p-4 font-mono text-xs text-gray-300 dark:bg-black/40"
 					>
-						<div class="mb-1 text-emerald-400">// Initialize & Load</div>
+						<div class="mb-1 text-emerald-400">// Initialize, download, load & chat</div>
 						<div class="code-line code-line-1">
-							<span class="text-purple-400">const</span> manager =
+							<span class="text-purple-400">const</span> mgr =
 							<span class="text-blue-400">FoundryLocalManager</span>.<span class="text-yellow-300"
 								>create</span
-							>(config)
+							>({'{'} appName: <span class="text-amber-300">'my-app'</span> {'}'})
 						</div>
 						<div class="code-line code-line-2">
-							<span class="text-purple-400">const</span> model = manager.<span
-								class="text-yellow-300">getCatalog</span
-							>().<span class="text-yellow-300">getModel</span>(<span class="text-amber-300"
-								>'gpt-oss-20b'</span
+							<span class="text-purple-400">const</span> model = <span class="text-purple-400">await</span> mgr.<span
+								class="text-yellow-300">catalog</span
+							>.<span class="text-yellow-300">getModel</span>(<span class="text-amber-300"
+								>'qwen2.5-0.5b'</span
 							>)
 						</div>
 						<div class="code-line code-line-3">
 							<span class="text-purple-400">await</span>
-							model.<span class="text-yellow-300">load</span>()<span class="typing-cursor">|</span>
+							model.<span class="text-yellow-300">download</span>(); <span class="text-purple-400">await</span> model.<span class="text-yellow-300">load</span>()
+						</div>
+						<div class="code-line code-line-4">
+							<span class="text-purple-400">const</span> res = <span class="text-purple-400">await</span> model.<span class="text-yellow-300">createChatClient</span>().<span class="text-yellow-300">completeChat</span>(msgs)<span class="typing-cursor">|</span>
 						</div>
 					</div>
 					<style>
@@ -131,6 +134,9 @@
 						.code-line-3 {
 							animation-delay: 1.5s;
 						}
+						.code-line-4 {
+							animation-delay: 2.1s;
+						}
 						@keyframes typeIn {
 							from {
 								opacity: 0;
@@ -171,7 +177,7 @@
 					</div>
 					<h3 class="mb-2 text-2xl font-bold text-gray-900 dark:text-white">Hardware Optimized</h3>
 					<p class="mb-6 text-lg text-gray-600 dark:text-neutral-400">
-						We work directly with hardware vendors for maximum performance
+						Automatic execution provider management for maximum performance
 					</p>
 					<!-- Hardware acceleration visual with glowing cards -->
 					<div class="mt-auto grid grid-cols-3 gap-3">
@@ -235,7 +241,7 @@
 					</div>
 					<h3 class="mb-2 text-xl font-semibold text-gray-900 dark:text-white">Edge-Ready</h3>
 					<p class="text-gray-600 dark:text-neutral-400">
-						Works fully offline with no cloud dependencies
+						Works fully offline. ~20 MB runtime, no cloud dependencies
 					</p>
 				</div>
 				<!-- Dramatic wifi disconnect animation -->
@@ -429,7 +435,7 @@
 						OpenAI Compatible
 					</h3>
 					<p class="text-gray-600 dark:text-neutral-400">
-						Drop-in API replacement for easy integration
+						Native SDK API plus optional OpenAI-compatible REST server
 					</p>
 				</div>
 				<!-- Animated API comparison -->
diff --git a/www/src/lib/components/home/footer.svelte b/www/src/lib/components/home/footer.svelte
index 03a4df2d..f88a256b 100644
--- a/www/src/lib/components/home/footer.svelte
+++ b/www/src/lib/components/home/footer.svelte
@@ -23,7 +23,7 @@
 					/>
 				</a>
 				<p class="max-w-xs text-sm text-muted-foreground">
-					Run AI models locally with the power of Microsoft's Azure AI technology.
+					Ship AI-powered applications with on-device inference. No cloud required.
 				</p>
 				<div class="mt-6">
 					<SocialMedia />
@@ -36,7 +36,7 @@
 				<ul class="space-y-3 text-sm">
 					<li>
 						<a
-							href="https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started"
+							href="https://learn.microsoft.com/en-us/azure/foundry-local/get-started"
 							target="_blank"
 							rel="noopener noreferrer"
 							class="text-muted-foreground transition-colors hover:text-foreground"
diff --git a/www/src/lib/components/home/hero.svelte b/www/src/lib/components/home/hero.svelte
index ca179095..aee0528d 100644
--- a/www/src/lib/components/home/hero.svelte
+++ b/www/src/lib/components/home/hero.svelte
@@ -122,7 +122,7 @@
 			>
 				<Button
 					variant="outline"
-					href="https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started"
+					href="https://learn.microsoft.com/en-us/azure/foundry-local/get-started"
 					target="_blank"
 					rel="noopener noreferrer"
 					size="lg"
diff --git a/www/src/lib/components/install-command.svelte b/www/src/lib/components/install-command.svelte
index b92d0840..7b5c8235 100644
--- a/www/src/lib/components/install-command.svelte
+++ b/www/src/lib/components/install-command.svelte
@@ -2,150 +2,147 @@
 	import { Copy, Check, Terminal } from 'lucide-svelte';
 	import { toast } from 'svelte-sonner';
 	import { onMount } from 'svelte';
-	import { getInstallCommand } from '$lib/utils/platform';
+	import { detectPlatform } from '$lib/utils/platform';
 
 	let copied = $state(false);
-	let copiedModel = $state(false);
-	let showModelCommand = $state(false);
+	let copiedCode = $state(false);
+	let showCodeSnippet = $state(false);
 	let commandElement: HTMLElement;
-	let modelCommandElement: HTMLElement;
-	let installInfo = $state({
-		command: 'brew install microsoft/foundrylocal/foundrylocal',
-		label: 'Install',
-		description: 'Install via Homebrew'
-	});
-
-	const modelCommand = 'foundry model run qwen2.5-0.5b';
-
-	// Platform SVG icons
-	const AppleIcon = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 16 16"><path d="M11.182.008C11.148-.03 9.923.023 8.857 1.18c-1.066 1.156-.902 2.482-.878 2.516.024.034 1.52.087 2.475-1.258.955-1.345.762-2.391.728-2.43zm3.314 11.733c-.048-.096-2.325-1.234-2.113-3.422.212-2.189 1.675-2.789 1.698-2.854.023-.065-.597-.79-1.254-1.157a3.692 3.692 0 0 0-1.563-.434c-.108-.003-.483-.095-1.254.116-.508.139-1.653.589-1.968.607-.316.018-1.256-.522-2.267-.665-.647-.125-1.333.131-1.824.328-.49.196-1.422.754-2.074 2.237-.652 1.482-.311 3.83-.067 4.56.244.729.625 1.924 1.273 2.796.576.984 1.34 1.667 1.659 1.899.319.232 1.219.386 1.843.067.502-.308 1.408-.485 1.766-.472.357.013 1.061.154 1.782.539.571.197 1.111.115 1.652-.105.541-.221 1.324-1.059 2.238-2.758.347-.79.505-1.217.473-1.282z"/></svg>`;
-
-	const WindowsIcon = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 16 16"><path d="M6.555 1.375 0 2.237v5.45h6.555V1.375zM0 13.795l6.555.933V8.313H0v5.482zm7.278-5.4.026 6.378L16 16V8.395H7.278zM16 0 7.33 1.244v6.414H16V0z"/></svg>`;
+	let activeTab = $state<'python' | 'javascript' | 'csharp' | 'rust'>('python');
+
+	const sdkCommands = {
+		python: 'pip install foundry-local-sdk',
+		javascript: 'npm install foundry-local-sdk',
+		csharp: 'dotnet add package Microsoft.AI.Foundry.Local',
+		rust: 'cargo add foundry-local-sdk'
+	};
+
+	const codeSnippets: Record<string, string> = {
+		python: `from foundry_local_sdk import Configuration, FoundryLocalManager
+config = Configuration(app_name="my-app")
+FoundryLocalManager.initialize(config)
+model = FoundryLocalManager.instance.catalog.get_model("qwen2.5-0.5b")
+model.download(); model.load()
+response = model.get_chat_client().complete_chat(
+    [{"role": "user", "content": "Hello!"}])
+print(response.choices[0].message.content)`,
+		javascript: `import { FoundryLocalManager } from 'foundry-local-sdk';
+const manager = FoundryLocalManager.create({ appName: 'my-app' });
+const model = await manager.catalog.getModel('qwen2.5-0.5b');
+await model.download(); await model.load();
+const chat = model.createChatClient();
+const res = await chat.completeChat(
+    [{ role: 'user', content: 'Hello!' }]);
+console.log(res.choices[0]?.message?.content);`,
+		csharp: `using Microsoft.AI.Foundry.Local;
+await FoundryLocalManager.CreateAsync(
+    new Configuration { AppName = "my-app" });
+var catalog = await FoundryLocalManager.Instance.GetCatalogAsync();
+var model = await catalog.GetModelAsync("qwen2.5-0.5b");
+await model.DownloadAsync(); await model.LoadAsync();
+var client = await model.GetChatClientAsync();
+var res = await client.CompleteChatAsync(new[] {
+    new ChatMessage { Role="user", Content="Hello!" }});
+Console.WriteLine(res.Choices![0].Message.Content);`,
+		rust: `use foundry_local_sdk::*;
+let manager = FoundryLocalManager::create(
+    FoundryLocalConfig::new("my-app"))?;
+let model = manager.catalog().get_model("qwen2.5-0.5b").await?;
+model.download(None).await?; model.load().await?;
+let client = model.create_chat_client();
+let msgs = vec![ChatCompletionRequestUserMessage
+    ::from("Hello!").into()];
+let res = client.complete_chat(&msgs, None).await?;
+println!("{}", res.choices[0].message.content
+    .as_ref().unwrap());`
+	};
+
+	const tabLabels: Record<string, string> = {
+		python: 'Python',
+		javascript: 'JS',
+		csharp: 'C#',
+		rust: 'Rust'
+	};
 
 	onMount(() => {
-		installInfo = getInstallCommand();
-
-		// Listen for manual copy events (Ctrl+C, Cmd+C, right-click copy)
-		const handleCopy = (e: ClipboardEvent) => {
-			const selection = window.getSelection();
-			const selectedText = selection?.toString().trim();
-
-			// Check if the selected text matches our install command
-			if (selectedText && selectedText.includes(installInfo.command)) {
-				if (!showModelCommand) {
-					setTimeout(() => {
-						showModelCommand = true;
-					}, 400);
-					toast.success('Great! Now run a model');
-				}
-			}
-			// Check if the selected text matches our model command
-			else if (selectedText && selectedText.includes(modelCommand)) {
-				if (!copiedModel) {
-					copiedModel = true;
-					toast.success('Copied model command!');
-					setTimeout(() => {
-						copiedModel = false;
-					}, 2000);
-				}
-			}
-		};
-
-		// Listen for text selection to show step 2 even if they don't copy yet
-		const handleSelection = () => {
-			const selection = window.getSelection();
-			const selectedText = selection?.toString().trim();
-
-			// If they've selected the install command text, show step 2
-			if (selectedText && selectedText.includes(installInfo.command) && !showModelCommand) {
-				setTimeout(() => {
-					showModelCommand = true;
-				}, 400);
-			}
-		};
-
-		document.addEventListener('copy', handleCopy);
-		document.addEventListener('selectionchange', handleSelection);
+		const platform = detectPlatform();
+		if (platform === 'windows') {
+			activeTab = 'csharp';
+		} else {
+			activeTab = 'python';
+		}
+	});
 
-		return () => {
-			document.removeEventListener('copy', handleCopy);
-			document.removeEventListener('selectionchange', handleSelection);
-		};
+	$effect(() => {
+		// Reactively derive current command from active tab
+		void activeTab;
 	});
 
+	let currentCommand = $derived(sdkCommands[activeTab]);
+
 	async function copyCommand() {
 		try {
-			await navigator.clipboard.writeText(installInfo.command);
+			await navigator.clipboard.writeText(currentCommand);
 			copied = true;
 			toast.success('Copied to clipboard!');
-
-			// Show the model command after copying
-			setTimeout(() => {
-				showModelCommand = true;
-			}, 400);
-
-			setTimeout(() => {
-				copied = false;
-			}, 2000);
+			setTimeout(() => { showCodeSnippet = true; }, 400);
+			setTimeout(() => { copied = false; }, 2000);
 		} catch (err) {
 			toast.error('Failed to copy to clipboard');
 		}
 	}
 
-	async function copyModelCommand() {
+	async function copyCodeSnippet() {
 		try {
-			await navigator.clipboard.writeText(modelCommand);
-			copiedModel = true;
-			toast.success('Copied model command!');
-			setTimeout(() => {
-				copiedModel = false;
-			}, 2000);
+			await navigator.clipboard.writeText(codeSnippets[activeTab]);
+			copiedCode = true;
+			toast.success('Copied code snippet!');
+			setTimeout(() => { copiedCode = false; }, 2000);
 		} catch (err) {
 			toast.error('Failed to copy to clipboard');
 		}
 	}
-
-	function getPlatformIcon(label: string) {
-		if (label.toLowerCase().includes('windows')) {
-			return WindowsIcon;
-		} else if (label.toLowerCase().includes('macos')) {
-			return AppleIcon;
-		}
-		return WindowsIcon; // default
-	}
-
-	const platformIcon = $derived(getPlatformIcon(installInfo.label));
 </script>
 
 <div
 	class="border-primary/20 bg-primary/5 hover:border-primary/40 relative w-full rounded-lg border-2 p-4 transition-all duration-300 hover:shadow-lg sm:p-5"
 >
 	<div class="mb-3 text-center">
-		<h3 class="text-foreground text-sm font-semibold sm:text-base">Get Started in Two Steps</h3>
+		<h3 class="text-foreground text-sm font-semibold sm:text-base">Get Started: Install the SDK</h3>
+	</div>
+
+	<!-- Language Tabs -->
+	<div class="mb-3 flex justify-center gap-1">
+		{#each Object.entries(tabLabels) as [key, label]}
+			<button
+				type="button"
+				class="rounded-md px-3 py-1.5 text-xs font-medium transition-all duration-200 {activeTab === key
+					? 'bg-primary text-primary-foreground shadow-sm'
+					: 'text-muted-foreground hover:text-foreground hover:bg-muted'}"
+				onclick={() => { activeTab = key as 'python' | 'javascript' | 'csharp' | 'rust'; showCodeSnippet = false; }}
+			>
+				{label}
+			</button>
+		{/each}
 	</div>
 
 	<div class="flex flex-col gap-2.5">
-		<!-- Step 1: Install Command -->
+		<!-- Install Command -->
 		<div class="flex flex-col gap-1.5">
-			<span class="text-muted-foreground text-xs font-medium">Step 1: Install Foundry Local</span>
+			<span class="text-muted-foreground text-xs font-medium">Install the SDK</span>
 			<div
 				class="border-primary/30 bg-background/50 hover:border-primary/50 hover:bg-background group relative flex items-center gap-2 rounded-md border px-3 py-2.5 transition-all duration-300 sm:gap-3"
 			>
-				<!-- Platform Icon -->
-				<div class="flex shrink-0 items-center justify-center" role="img" aria-label={installInfo.label}>
-					<span class="text-primary" aria-hidden="true">{@html platformIcon}</span>
+				<div class="flex shrink-0 items-center justify-center">
+					<Terminal class="text-primary size-5" aria-hidden="true" />
 				</div>
-
-				<!-- Command -->
 				<code
 					bind:this={commandElement}
 					class="text-foreground flex-1 select-all overflow-x-auto font-mono text-xs sm:text-sm"
 					style="scrollbar-width: thin;"
 				>
-					{installInfo.command}
+					{currentCommand}
 				</code>
-
-				<!-- Copy Button -->
 				<button
 					type="button"
 					onclick={copyCommand}
@@ -163,46 +160,36 @@
 			</div>
 		</div>
 
-		<!-- Step 2: Model Command (appears after copying) -->
+		<!-- Code Snippet (appears after copying) -->
 		<div
 			class="flex flex-col gap-1.5 overflow-hidden transition-all duration-700 ease-out"
-			style={showModelCommand
-				? 'max-height: 120px; opacity: 1;'
+			style={showCodeSnippet
+				? 'max-height: 300px; opacity: 1;'
 				: 'max-height: 0; opacity: 0; margin-top: -10px;'}
 		>
-			<span class="text-muted-foreground text-xs font-medium">Step 2: Run a model</span>
+			<span class="text-muted-foreground text-xs font-medium">Run your first completion</span>
 			<div
-				class="border-primary/30 bg-background/50 hover:border-primary/50 hover:bg-background group relative flex items-center gap-2 rounded-md border px-3 py-2.5 transition-all duration-300 sm:gap-3"
+				class="border-primary/30 bg-background/50 group relative rounded-md border transition-all duration-300"
 			>
-				<!-- Terminal Icon -->
-				<div class="flex shrink-0 items-center justify-center" aria-label="Run model">
-					<Terminal class="text-primary size-5" aria-hidden="true" />
-				</div>
-
-				<!-- Command -->
-				<code
-					bind:this={modelCommandElement}
-					class="text-foreground flex-1 select-all overflow-x-auto font-mono text-xs sm:text-sm"
-					style="scrollbar-width: thin;"
-				>
-					{modelCommand}
-				</code>
-				<!-- Copy Button -->
+				<pre class="overflow-x-auto p-3 font-mono text-[10px] leading-relaxed text-gray-300 sm:text-xs"><code>{codeSnippets[activeTab]}</code></pre>
 				<button
 					type="button"
-					onclick={copyModelCommand}
-					class="bg-primary/10 text-primary hover:bg-primary/20 focus:ring-primary flex shrink-0 items-center gap-1.5 rounded px-2 py-1.5 text-xs font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-offset-2 sm:px-2.5"
-					aria-label="Copy model run command"
+					onclick={copyCodeSnippet}
+					class="bg-primary/10 text-primary hover:bg-primary/20 focus:ring-primary absolute top-2 right-2 flex shrink-0 items-center gap-1 rounded px-1.5 py-1 text-xs font-medium transition-all duration-200 hover:scale-105 focus:outline-none focus:ring-2 focus:ring-offset-2"
+					aria-label="Copy code snippet"
 				>
-					{#if copiedModel}
-						<Check class="size-3.5 sm:size-4" aria-hidden="true" />
-						<span class="hidden sm:inline">Copied!</span>
+					{#if copiedCode}
+						<Check class="size-3" aria-hidden="true" />
 					{:else}
-						<Copy class="size-3.5 sm:size-4" aria-hidden="true" />
-						<span class="hidden sm:inline">Copy</span>
+						<Copy class="size-3" aria-hidden="true" />
 					{/if}
 				</button>
 			</div>
 		</div>
+
+		<!-- CLI note -->
+		<p class="text-muted-foreground text-center text-[10px]">
+			For interactive development, install the <a href="https://learn.microsoft.com/en-us/azure/foundry-local/reference/reference-cli" target="_blank" rel="noopener noreferrer" class="underline hover:text-foreground">CLI</a> separately.
+		</p>
 	</div>
 </div>
diff --git a/www/src/lib/config.ts b/www/src/lib/config.ts
index 4489d3a0..5a8b13ca 100644
--- a/www/src/lib/config.ts
+++ b/www/src/lib/config.ts
@@ -18,13 +18,13 @@ import type { Feature, PromoConfig, SiteConfig } from './types/config';
 export const siteConfig: SiteConfig = {
 	title: 'Foundry Local',
 	description:
-		'Build once, run locally. The SDK for shipping AI-powered applications with hardware-optimized on-device inference.',
+		'Ship AI-powered apps with on-device inference. Native SDKs for C#, JavaScript, Python, and Rust. ~20 MB runtime, no cloud required.',
 	github: 'https://github.com/microsoft/foundry-local',
 	npm: '',
 	quickLinks: [
 		{
 			title: 'Getting Started',
-			href: 'https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started'
+			href: 'https://learn.microsoft.com/en-us/azure/foundry-local/get-started'
 		},
 		{ title: 'GitHub', href: 'https://github.com/microsoft/foundry-local' }
 	],
@@ -42,7 +42,7 @@ export let navItems: NavItem[] = [
 	},
 	{
 		title: 'Docs',
-		href: 'https://learn.microsoft.com/en-us/azure/ai-foundry/foundry-local/get-started',
+		href: 'https://learn.microsoft.com/en-us/azure/foundry-local/get-started',
 		icon: BookOpen
 	}
 ];
@@ -66,13 +66,13 @@ export const features: Feature[] = [
 	{
 		icon: Cpu,
 		title: 'Hardware Optimized',
-		description: 'We work directly with hardware vendors for NPU, GPU & CPU acceleration',
+		description: 'Automatic execution provider management for NPU, GPU & CPU acceleration',
 		size: 'large'
 	},
 	{
 		icon: Wifi,
 		title: 'Edge-Ready',
-		description: 'Works fully offline with no cloud dependencies',
+		description: 'Works fully offline. ~20 MB runtime, no cloud dependencies',
 		size: 'medium'
 	},
 	{
@@ -84,7 +84,7 @@ export const features: Feature[] = [
 	{
 		icon: Bot,
 		title: 'OpenAI Compatible',
-		description: 'Drop-in API replacement for easy integration',
+		description: 'Native SDK API plus optional OpenAI-compatible REST server',
 		size: 'medium'
 	},
 	{

From c728e9c9f7014509092ef00672099400844c695e Mon Sep 17 00:00:00 2001
From: Maanav Dalal <maanavdalal@gmail.com>
Date: Sat, 11 Apr 2026 17:54:38 -0400
Subject: [PATCH 2/3] Update www/src/lib/components/install-command.svelte

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 www/src/lib/components/install-command.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/www/src/lib/components/install-command.svelte b/www/src/lib/components/install-command.svelte
index 7b5c8235..05e8c8b0 100644
--- a/www/src/lib/components/install-command.svelte
+++ b/www/src/lib/components/install-command.svelte
@@ -171,7 +171,7 @@ println!("{}", res.choices[0].message.content
 			<div
 				class="border-primary/30 bg-background/50 group relative rounded-md border transition-all duration-300"
 			>
-				<pre class="overflow-x-auto p-3 font-mono text-[10px] leading-relaxed text-gray-300 sm:text-xs"><code>{codeSnippets[activeTab]}</code></pre>
+				<pre class="text-foreground overflow-x-auto p-3 font-mono text-[10px] leading-relaxed sm:text-xs"><code>{codeSnippets[activeTab]}</code></pre>
 				<button
 					type="button"
 					onclick={copyCodeSnippet}

From c1457ebe1fbc2110d9f7bbfb3377d389c0970b0d Mon Sep 17 00:00:00 2001
From: maanavd <maanavdalal@gmail.com>
Date: Sat, 11 Apr 2026 18:15:49 -0400
Subject: [PATCH 3/3] fix(www): fix C# and Rust code snippets per review

- C#: add required NullLogger.Instance param to CreateAsync
- Rust: add type hint None::<fn(f64)> for download() generic

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 www/src/lib/components/install-command.svelte | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/www/src/lib/components/install-command.svelte b/www/src/lib/components/install-command.svelte
index 05e8c8b0..0e69f13d 100644
--- a/www/src/lib/components/install-command.svelte
+++ b/www/src/lib/components/install-command.svelte
@@ -35,8 +35,10 @@ const res = await chat.completeChat(
     [{ role: 'user', content: 'Hello!' }]);
 console.log(res.choices[0]?.message?.content);`,
 		csharp: `using Microsoft.AI.Foundry.Local;
+using Microsoft.Extensions.Logging.Abstractions;
 await FoundryLocalManager.CreateAsync(
-    new Configuration { AppName = "my-app" });
+    new Configuration { AppName = "my-app" },
+    NullLogger.Instance);
 var catalog = await FoundryLocalManager.Instance.GetCatalogAsync();
 var model = await catalog.GetModelAsync("qwen2.5-0.5b");
 await model.DownloadAsync(); await model.LoadAsync();
@@ -48,7 +50,8 @@ Console.WriteLine(res.Choices![0].Message.Content);`,
 let manager = FoundryLocalManager::create(
     FoundryLocalConfig::new("my-app"))?;
 let model = manager.catalog().get_model("qwen2.5-0.5b").await?;
-model.download(None).await?; model.load().await?;
+model.download(None::<fn(f64)>).await?;
+model.load().await?;
 let client = model.create_chat_client();
 let msgs = vec![ChatCompletionRequestUserMessage
     ::from("Hello!").into()];