diff --git a/docs/custom.css b/docs/custom.css
index 12cdf27c1342..1826c656f85f 100644
--- a/docs/custom.css
+++ b/docs/custom.css
@@ -52,7 +52,7 @@
.pp-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 40px; border: 1px solid var(--pp-border); border-radius: 6px; padding: 6px 8px; }
.pp-chips .pp-ph { color: var(--pp-faint); font-size: 14px; }
-.pp-code { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.6; background: var(--pp-soft); border: 1px solid var(--pp-border); border-radius: 6px; padding: 10px 12px; color: #3f3f46; white-space: pre; overflow-x: auto; }
+.pp-code { font-family: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; font-size: 12.5px; line-height: 1.6; background: var(--pp-soft); border: 1px solid var(--pp-border); border-radius: 6px; padding: 10px 12px; color: #3f3f46; white-space: pre; overflow-x: auto; }
.pp-key { color: hsl(257 74% 45%); }
.pp-str { color: hsl(160 84% 30%); }
@@ -86,7 +86,7 @@
.pp-cards { display: flex; gap: 8px; flex-wrap: wrap; }
.pp-rcard { flex: 1 1 0; min-width: 120px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--pp-border); border-radius: 8px; padding: 11px 12px; }
.pp-rcard.pp-sel { border-color: var(--pp-primary); background: hsl(257 74% 57% / 0.05); }
-.pp-rcard .pp-ic { width: 28px; height: 28px; border-radius: 6px; background: var(--pp-soft); display: flex; align-items: center; justify-content: center; color: #52525b; flex: none; font-family: ui-monospace, monospace; font-size: 12px; }
+.pp-rcard .pp-ic { width: 28px; height: 28px; border-radius: 6px; background: var(--pp-soft); display: flex; align-items: center; justify-content: center; color: #52525b; flex: none; font-family: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace; font-size: 12px; }
.pp-rcard.pp-sel .pp-ic { background: var(--pp-primary-wash); color: var(--pp-primary); }
.pp-rcard .pp-t { font-size: 13.5px; font-weight: 600; }
.pp-rcard .pp-d { font-size: 11.5px; color: var(--pp-muted); }
diff --git a/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx b/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx
index 2f25506ca609..306926545b61 100644
--- a/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx
+++ b/packages/web/src/app/routes/chat-with-ai/components/chat-empty-state.tsx
@@ -152,7 +152,7 @@ function Greeting({
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.4 }}
>
-
+
{incognito
? t('Private Chat')
: firstName
diff --git a/packages/web/src/app/routes/chat-with-ai/components/onboarding-question-card.tsx b/packages/web/src/app/routes/chat-with-ai/components/onboarding-question-card.tsx
index 3a566192f8de..95c2864db6dd 100644
--- a/packages/web/src/app/routes/chat-with-ai/components/onboarding-question-card.tsx
+++ b/packages/web/src/app/routes/chat-with-ai/components/onboarding-question-card.tsx
@@ -96,7 +96,7 @@ export function OnboardingQuestionCard({
onDismiss={onDismiss}
active={active}
title={
-
+
{t("I'm a")}
diff --git a/packages/web/src/assets/fonts/InterVariable-Italic.woff2 b/packages/web/src/assets/fonts/InterVariable-Italic.woff2
new file mode 100644
index 000000000000..4a9567923b25
Binary files /dev/null and b/packages/web/src/assets/fonts/InterVariable-Italic.woff2 differ
diff --git a/packages/web/src/assets/fonts/InterVariable.woff2 b/packages/web/src/assets/fonts/InterVariable.woff2
new file mode 100644
index 000000000000..798d6d9f6cab
Binary files /dev/null and b/packages/web/src/assets/fonts/InterVariable.woff2 differ
diff --git a/packages/web/src/assets/fonts/JetBrainsMono.woff2 b/packages/web/src/assets/fonts/JetBrainsMono.woff2
new file mode 100644
index 000000000000..cd5102a44c76
Binary files /dev/null and b/packages/web/src/assets/fonts/JetBrainsMono.woff2 differ
diff --git a/packages/web/public/fonts/Sentient-Variable.woff2 b/packages/web/src/assets/fonts/Sentient-Variable.woff2
similarity index 100%
rename from packages/web/public/fonts/Sentient-Variable.woff2
rename to packages/web/src/assets/fonts/Sentient-Variable.woff2
diff --git a/packages/web/src/assets/fonts/inter-v20-latin-500.ttf b/packages/web/src/assets/fonts/inter-v20-latin-500.ttf
deleted file mode 100644
index 71d90172f10f..000000000000
Binary files a/packages/web/src/assets/fonts/inter-v20-latin-500.ttf and /dev/null differ
diff --git a/packages/web/src/assets/fonts/inter-v20-latin-600.ttf b/packages/web/src/assets/fonts/inter-v20-latin-600.ttf
deleted file mode 100644
index 053185e5d299..000000000000
Binary files a/packages/web/src/assets/fonts/inter-v20-latin-600.ttf and /dev/null differ
diff --git a/packages/web/src/assets/fonts/inter-v20-latin-700.woff2 b/packages/web/src/assets/fonts/inter-v20-latin-700.woff2
deleted file mode 100644
index a68fb101cd92..000000000000
Binary files a/packages/web/src/assets/fonts/inter-v20-latin-700.woff2 and /dev/null differ
diff --git a/packages/web/src/assets/fonts/inter-v20-latin-800.woff2 b/packages/web/src/assets/fonts/inter-v20-latin-800.woff2
deleted file mode 100644
index 74a16d459452..000000000000
Binary files a/packages/web/src/assets/fonts/inter-v20-latin-800.woff2 and /dev/null differ
diff --git a/packages/web/src/assets/fonts/inter-v20-latin-regular.woff2 b/packages/web/src/assets/fonts/inter-v20-latin-regular.woff2
deleted file mode 100644
index f15b025d6662..000000000000
Binary files a/packages/web/src/assets/fonts/inter-v20-latin-regular.woff2 and /dev/null differ
diff --git a/packages/web/src/features/chat/use-cases/use-case-card.tsx b/packages/web/src/features/chat/use-cases/use-case-card.tsx
index 813c981b314b..cb24ed9e57f1 100644
--- a/packages/web/src/features/chat/use-cases/use-case-card.tsx
+++ b/packages/web/src/features/chat/use-cases/use-case-card.tsx
@@ -51,7 +51,7 @@ export function UseCaseCard({
/>
)}
-
+
{card.title}
{interactive && (
diff --git a/packages/web/src/styles.css b/packages/web/src/styles.css
index a061eefae4fa..cc8e95ce4696 100644
--- a/packages/web/src/styles.css
+++ b/packages/web/src/styles.css
@@ -3,53 +3,35 @@
@import './styles/globals.css';
@custom-variant dark (&:is(.dark *));
-/* Sentient Variable Font */
-@font-face {
- font-family: 'Sentient';
- src: url('/fonts/Sentient-Variable.woff2') format('woff2-variations');
- font-weight: 200 700;
- font-display: swap;
-}
-
-/* inter-regular - latin */
-@font-face {
- font-display: swap;
- font-family: 'Inter';
- font-style: normal;
- font-weight: 400;
- src: url('assets/fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
-}
-/* inter-500 - latin */
+/* Paths are relative to this file, not /fonts/, so Vite fingerprints them. */
@font-face {
font-display: swap;
font-family: 'Inter';
font-style: normal;
- font-weight: 500;
- src: url('assets/fonts/inter-v20-latin-500.ttf') format('truetype');
+ font-weight: 100 900;
+ src: url('assets/fonts/InterVariable.woff2') format('woff2-variations');
}
-/* inter-600 - latin */
@font-face {
font-display: swap;
font-family: 'Inter';
- font-style: normal;
- font-weight: 600;
- src: url('assets/fonts/inter-v20-latin-600.ttf') format('truetype');
+ font-style: italic;
+ font-weight: 100 900;
+ src: url('assets/fonts/InterVariable-Italic.woff2') format('woff2-variations');
}
-/* inter-700 - latin */
+
@font-face {
font-display: swap;
- font-family: 'Inter';
+ font-family: 'JetBrains Mono';
font-style: normal;
- font-weight: 700;
- src: url('assets/fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ font-weight: 100 800;
+ src: url('assets/fonts/JetBrainsMono.woff2') format('woff2-variations');
}
-/* inter-800 - latin */
+
@font-face {
font-display: swap;
- font-family: 'Inter';
- font-style: normal;
- font-weight: 800;
- src: url('assets/fonts/inter-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+ font-family: 'Sentient';
+ font-weight: 200 700;
+ src: url('assets/fonts/Sentient-Variable.woff2') format('woff2-variations');
}
@utility container {
@@ -178,7 +160,10 @@
alternate;
--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji', Segoe UI Symbol, 'Noto Color Emoji';
- --font-sentient: 'Sentient', serif;
+ --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas,
+ 'Liberation Mono', monospace;
+ --font-mono--font-feature-settings: 'calt' 0;
+ --font-serif: 'Sentient', ui-serif, Georgia, serif;
--shadow-step-container: 0px 0px 22px hsl(var(--border) / 0.3);
--shadow-add-button: var(--add-button-shadow);
--color-builder-background: var(--builder-background);
@@ -725,9 +710,6 @@
}
@layer base {
- body {
- @apply font-sans;
- }
html {
@apply font-sans;
}