-
+
-
-
- WaveKat Voice
-
- 免费公测
-
-
-
- 一款运行在你电脑上的电话应用。用你已经在用的电话运营商,直接在桌面上接听和拨打电话——
- 每通对话都自动为你录音并写成文字。你甚至可以让 AI 助手替你拨打电话。
-
+
WaveKat Voice
+
+ 免费公测
+
+
+
+
+ WaveKat 打造 AI 驱动的工具,让小企业也能拥有过去只有大公司才负担得起的能力。我们从语音开始——
+ 一款把你的电脑变成办公电话的桌面应用,自动录音并写下每一通通话。
+
+
-
-
-
- 开源库
+
+
+
+

+
+
+
-
语音流水线
-
- {voicePipeline.map((lib) => (
-
- {lib.name}
- {lib.description}
-
- github.com/wavekat/{lib.name} →
-
-
- ))}
+
+
+
+
+
+
我们的应用
+
+ WaveKat Voice
+
+ 免费公测
+
+
+ 一款运行在你电脑上的电话应用。用你已经在用的电话运营商,直接在桌面上接听和拨打电话——
+ 每通对话都自动为你录音并写成文字。你甚至可以让 AI 助手替你拨打电话。
+
+
+ 了解更多并下载
+
+
+
+
-
工具与客户端
-
- {toolsAndClients.map((lib) => (
+
+
+ 开源库
+ 语音流水线
+
+
+ {pipelineFlow.map((lib, i) => (
+
-
+ {i < 3 && (
+
+ )}
+
+ ))}
+
+
+
+
+
工具与客户端
+
+
-
+
-
+
diff --git a/src/styles/global.css b/src/styles/global.css
index e0482d4..eaf1b90 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -5,6 +5,14 @@
@variant dark (&:where(.dark, .dark *));
@theme {
+ /* Typefaces: Inter carries the UI/body; JetBrains Mono is the accent voice
+ for repo names, code, versions and badges. */
+ --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
+ --font-mono: 'JetBrains Mono', Menlo, 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
+
+ /* Brand accent */
+ --color-wk-orange: #ff6d00;
+
/* Library accent colors */
--color-wk-core: #00e676;
--color-wk-vad: #00bcd4;
@@ -18,14 +26,89 @@
}
@layer base {
- * {
- font-family: 'JetBrains Mono', Menlo, 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
+ body {
+ font-family: var(--font-sans);
+ font-feature-settings: 'cv11', 'ss01';
+ -webkit-font-smoothing: antialiased;
+ }
+
+ code, kbd, samp, pre {
+ font-family: var(--font-mono);
+ }
+
+ ::selection {
+ background-color: rgb(255 109 0 / 0.25);
+ }
+
+ :focus-visible {
+ outline: 2px solid rgb(255 109 0 / 0.6);
+ outline-offset: 2px;
}
/* Offset in-page anchor jumps (e.g. /voice/changelog/#0.0.41, docs TOC
links) so the targeted heading isn't flush against the viewport top or
- hidden under the occasional fixed language banner. */
+ hidden under the sticky header / occasional fixed language banner. */
html {
- scroll-padding-top: 4rem;
+ scroll-padding-top: 6rem;
+ }
+}
+
+@layer utilities {
+ /* Hero entrance — one gentle rise on load, skipped for reduced motion. */
+ .animate-rise {
+ animation: wk-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
+ }
+ .animate-rise-late {
+ animation: wk-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both;
+ }
+
+ /* Brand gradient for headline accents. */
+ .text-gradient-brand {
+ background: linear-gradient(100deg, #ff6d00 0%, #ffa040 60%, #ffd740 120%);
+ -webkit-background-clip: text;
+ background-clip: text;
+ color: transparent;
}
-}
\ No newline at end of file
+}
+
+/* Scroll-reveal: the script in the page adds .reveal-init to [data-reveal]
+ elements (so no-JS visitors always see content), then swaps in .reveal-in
+ as each enters the viewport. */
+.reveal-init {
+ opacity: 0;
+ transform: translateY(20px);
+}
+.reveal-in {
+ opacity: 1;
+ transform: translateY(0);
+ transition:
+ opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
+ transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
+}
+@media (prefers-reduced-motion: reduce) {
+ .reveal-init {
+ opacity: 1;
+ transform: none;
+ }
+ .reveal-in {
+ transition: none;
+ }
+}
+
+@keyframes wk-rise {
+ from {
+ opacity: 0;
+ transform: translateY(14px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .animate-rise,
+ .animate-rise-late {
+ animation: none;
+ }
+}