diff --git a/apps/desktop/src/components/desktop-onboarding-overlay.tsx b/apps/desktop/src/components/desktop-onboarding-overlay.tsx
index d3f12a71dff..f3eb8fc1a51 100644
--- a/apps/desktop/src/components/desktop-onboarding-overlay.tsx
+++ b/apps/desktop/src/components/desktop-onboarding-overlay.tsx
@@ -1,9 +1,11 @@
import { useStore } from '@nanostores/react'
+import { useQuery } from '@tanstack/react-query'
import { useEffect, useMemo, useRef, useState } from 'react'
import { ModelPickerDialog } from '@/components/model-picker'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
+import { getGlobalModelOptions } from '@/hermes'
import {
Check,
ChevronDown,
@@ -660,6 +662,18 @@ function ConfirmingModelPanel({
// a familiar UI for users who'll see this picker again later.
const [pickerOpen, setPickerOpen] = useState(false)
+ // Pull pricing + tier for the just-picked default so the confirm card
+ // shows the same $/Mtok + Free/Pro info the picker and CLI do.
+ const options = useQuery({
+ queryKey: ['onboarding-model-options', flow.providerSlug],
+ queryFn: () => getGlobalModelOptions()
+ })
+ const providerRow = options.data?.providers?.find(
+ p => String(p.slug).toLowerCase() === flow.providerSlug.toLowerCase()
+ )
+ const price = providerRow?.pricing?.[flow.currentModel]
+ const freeTier = providerRow?.free_tier
+
return (
@@ -670,8 +684,25 @@ function ConfirmingModelPanel({
-
Default model
+
+
Default model
+ {freeTier === true && (
+
+ Free tier
+
+ )}
+ {freeTier === false && (
+
+ Pro
+
+ )}
+
{flow.currentModel}
+ {price && (price.input || price.output) && (
+
+ {price.free ? 'Free' : `${price.input || '?'} in / ${price.output || '?'} out per Mtok`}
+
+ )}