[V0_FILE]css:file="components/Orb.css" isMerged="true" .orb-container { position: relative; z-index: 0; width: 100%; height: 100%; } [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "lint": "next lint" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "geist": "^1.3.1", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "14.2.25", "next-themes": "^0.4.6", "react": "^19", "react-day-picker": "9.8.0", "react-dom": "^19", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^3.3.1", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.67", "ogl": "1.0.11" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^18", "@types/react-dom": "^18", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]typescriptreact:file="components/Orb.tsx" isQuickEdit="true" isMerged="true" "use client" import { useEffect, useRef } from "react" import { Renderer, Program, Mesh, Triangle, Vec3 } from "ogl" import "./Orb.css" export default function Orb({ hue = 0, hoverIntensity = 0.2, rotateOnHover = true, forceHoverState = false }) { const ctnDom = useRef(null) const vert = /* glsl */ ` precision highp float; attribute vec2 position; attribute vec2 uv; varying vec2 vUv; void main() { vUv = uv; gl_Position = vec4(position, 0.0, 1.0); } ` const frag = /* glsl */ ` precision highp float; uniform float iTime; uniform vec3 iResolution; uniform float hue; uniform float hover; uniform float rot; uniform float hoverIntensity; varying vec2 vUv; vec3 rgb2yiq(vec3 c) { float y = dot(c, vec3(0.299, 0.587, 0.114)); float i = dot(c, vec3(0.596, -0.274, -0.322)); float q = dot(c, vec3(0.211, -0.523, 0.312)); return vec3(y, i, q); } vec3 yiq2rgb(vec3 c) { float r = c.x + 0.956 * c.y + 0.621 * c.z; float g = c.x - 0.272 * c.y - 0.647 * c.z; float b = c.x - 1.106 * c.y + 1.703 * c.z; return vec3(r, g, b); } vec3 adjustHue(vec3 color, float hueDeg) { float hueRad = hueDeg * 3.14159265 / 180.0; vec3 yiq = rgb2yiq(color); float cosA = cos(hueRad); float sinA = sin(hueRad); float i = yiq.y * cosA - yiq.z * sinA; float q = yiq.y * sinA + yiq.z * cosA; yiq.y = i; yiq.z = q; return yiq2rgb(yiq); } vec3 hash33(vec3 p3) { p3 = fract(p3 * vec3(0.1031, 0.11369, 0.13787)); p3 += dot(p3, p3.yxz + 19.19); return -1.0 + 2.0 * fract(vec3( p3.x + p3.y, p3.x + p3.z, p3.y + p3.z ) * p3.zyx); } float snoise3(vec3 p) { const float K1 = 0.333333333; const float K2 = 0.166666667; vec3 i = floor(p + (p.x + p.y + p.z) * K1); vec3 d0 = p - (i - (i.x + i.y + i.z) * K2); vec3 e = step(vec3(0.0), d0 - d0.yzx); vec3 i1 = e * (1.0 - e.zxy); vec3 i2 = 1.0 - e.zxy * (1.0 - e); vec3 d1 = d0 - (i1 - K2); vec3 d2 = d0 - (i2 - K1); vec3 d3 = d0 - 0.5; vec4 h = max(0.6 - vec4( dot(d0, d0), dot(d1, d1), dot(d2, d2), dot(d3, d3) ), 0.0); vec4 n = h * h * h * h * vec4( dot(d0, hash33(i)), dot(d1, hash33(i + i1)), dot(d2, hash33(i + i2)), dot(d3, hash33(i + 1.0)) ); return dot(vec4(31.316), n); } vec4 extractAlpha(vec3 colorIn) { float a = max(max(colorIn.r, colorIn.g), colorIn.b); return vec4(colorIn.rgb / (a + 1e-5), a); } const vec3 baseColor1 = vec3(0.611765, 0.262745, 0.996078); const vec3 baseColor2 = vec3(0.298039, 0.760784, 0.913725); const vec3 baseColor3 = vec3(0.062745, 0.078431, 0.600000); const float innerRadius = 0.6; const float noiseScale = 0.65; float light1(float intensity, float attenuation, float dist) { return intensity / (1.0 + dist * attenuation); } float light2(float intensity, float attenuation, float dist) { return intensity / (1.0 + dist * dist * attenuation); } vec4 draw(vec2 uv) { vec3 color1 = adjustHue(baseColor1, hue); vec3 color2 = adjustHue(baseColor2, hue); vec3 color3 = adjustHue(baseColor3, hue); float ang = atan(uv.y, uv.x); float len = length(uv); float invLen = len > 0.0 ? 1.0 / len : 0.0; float n0 = snoise3(vec3(uv * noiseScale, iTime * 0.5)) * 0.5 + 0.5; float r0 = mix(mix(innerRadius, 1.0, 0.4), mix(innerRadius, 1.0, 0.6), n0); float d0 = distance(uv, (r0 * invLen) * uv); float v0 = light1(1.0, 10.0, d0); v0 *= smoothstep(r0 * 1.05, r0, len); float cl = cos(ang + iTime * 2.0) * 0.5 + 0.5; float a = iTime * -1.0; vec2 pos = vec2(cos(a), sin(a)) * r0; float d = distance(uv, pos); float v1 = light2(1.5, 5.0, d); v1 *= light1(1.0, 50.0, d0); float v2 = smoothstep(1.0, mix(innerRadius, 1.0, n0 * 0.5), len); float v3 = smoothstep(innerRadius, mix(innerRadius, 1.0, 0.5), len); vec3 col = mix(color1, color2, cl); col = mix(color3, col, v0); col = (col + v1) * v2 * v3; col = clamp(col, 0.0, 1.0); return extractAlpha(col); } vec4 mainImage(vec2 fragCoord) { vec2 center = iResolution.xy * 0.5; float size = min(iResolution.x, iResolution.y); vec2 uv = (fragCoord - center) / size * 2.0; float angle = rot; float s = sin(angle); float c = cos(angle); uv = vec2(c * uv.x - s * uv.y, s * uv.x + c * uv.y); uv.x += hover * hoverIntensity * 0.1 * sin(uv.y * 10.0 + iTime); uv.y += hover * hoverIntensity * 0.1 * sin(uv.x * 10.0 + iTime); return draw(uv); } void main() { vec2 fragCoord = vUv * iResolution.xy; vec4 col = mainImage(fragCoord); gl_FragColor = vec4(col.rgb * col.a, col.a); } ` useEffect(() => { const container = ctnDom.current if (!container) return const renderer = new Renderer({ alpha: true, premultipliedAlpha: false }) const gl = renderer.gl gl.clearColor(0, 0, 0, 0) container.appendChild(gl.canvas) const geometry = new Triangle(gl) const program = new Program(gl, { vertex: vert, fragment: frag, uniforms: { iTime: { value: 0 }, iResolution: { value: new Vec3(gl.canvas.width, gl.canvas.height, gl.canvas.width / gl.canvas.height), }, hue: { value: hue }, hover: { value: 0 }, rot: { value: 0 }, hoverIntensity: { value: hoverIntensity }, }, }) const mesh = new Mesh(gl, { geometry, program }) function resize() { if (!container) return const dpr = window.devicePixelRatio || 1 const width = container.clientWidth const height = container.clientHeight renderer.setSize(width * dpr, height * dpr) gl.canvas.style.width = width + "px" gl.canvas.style.height = height + "px" program.uniforms.iResolution.value.set(gl.canvas.width, gl.canvas.height, gl.canvas.width / gl.canvas.height) } window.addEventListener("resize", resize) resize() let targetHover = 0 let lastTime = 0 let currentRot = 0 const rotationSpeed = 0.3 const handleMouseMove = (e) => { const rect = container.getBoundingClientRect() const x = e.clientX - rect.left const y = e.clientY - rect.top const width = rect.width const height = rect.height const size = Math.min(width, height) const centerX = width / 2 const centerY = height / 2 const uvX = ((x - centerX) / size) * 2.0 const uvY = ((y - centerY) / size) * 2.0 if (Math.sqrt(uvX * uvX + uvY * uvY) < 0.8) { targetHover = 1 } else { targetHover = 0 } } const handleMouseLeave = () => { targetHover = 0 } container.addEventListener("mousemove", handleMouseMove) container.addEventListener("mouseleave", handleMouseLeave) let rafId const update = (t) => { rafId = requestAnimationFrame(update) const dt = (t - lastTime) * 0.001 lastTime = t program.uniforms.iTime.value = t * 0.001 program.uniforms.hue.value = hue program.uniforms.hoverIntensity.value = hoverIntensity const effectiveHover = forceHoverState ? 1 : targetHover program.uniforms.hover.value += (effectiveHover - program.uniforms.hover.value) * 0.1 if (rotateOnHover && effectiveHover > 0.5) { currentRot += dt * rotationSpeed } program.uniforms.rot.value = currentRot renderer.render({ scene: mesh }) } rafId = requestAnimationFrame(update) return () => { cancelAnimationFrame(rafId) window.removeEventListener("resize", resize) container.removeEventListener("mousemove", handleMouseMove) container.removeEventListener("mouseleave", handleMouseLeave) container.removeChild(gl.canvas) gl.getExtension("WEBGL_lose_context")?.loseContext() } // eslint-disable-next-line react-hooks/exhaustive-deps }, [hue, hoverIntensity, rotateOnHover, forceHoverState]) return

} [V0_FILE]typescriptreact:file="components/ScrollingPartners.tsx" isMerged="true" "use client" import { useEffect, useRef } from "react" interface ScrollingPartnersProps { partners: string[] speed?: number } export default function ScrollingPartners({ partners, speed = 30 }: ScrollingPartnersProps) { const scrollRef = useRef(null) useEffect(() => { const scrollElement = scrollRef.current if (!scrollElement) return let animationId: number let startTime: number const animate = (currentTime: number) => { if (!startTime) startTime = currentTime const elapsed = currentTime - startTime // Calculate scroll position based on speed const scrollDistance = (elapsed / 1000) * speed scrollElement.scrollLeft = scrollDistance % scrollElement.scrollWidth animationId = requestAnimationFrame(animate) } animationId = requestAnimationFrame(animate) return () => { if (animationId) { cancelAnimationFrame(animationId) } } }, [speed]) return (

{/* Left fade mask */}

{/* Right fade mask */}

{/* Scrolling container */}

{/* Duplicate partners for seamless loop */} {[...partners, ...partners, ...partners].map((partner, index) => ( {partner} ))}

) } [V0_FILE]png:file="public/thumbs-up-gesture.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-zQ4fE7sfqJkpIYgagBI1HIHZFssSFg.png" isMerged="true" [V0_FILE]png:file="public/thumbs-up-tired.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344910-HqsvAv4Ju9L6QMfSQ03RGRrfYBb6kD.png" isMerged="true" [V0_FILE]png:file="public/thumbs-up-personalization.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344910-mPViYtMCnTDWThypSRiqJEYWtrVVbr.png" isMerged="true" [V0_FILE]png:file="public/love-gesture-sad.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344912-rSGfozmwuOcCRMbEGKDsVvOh5W1LYh.png" isMerged="true" [V0_FILE]png:file="public/privacy-security-brain.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344911-cqTyHy568UeP2IlvGqWf1yIoXjMBB8.png" isMerged="true" [V0_FILE]png:file="public/beeeval-interface.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/BeeEval-Vx8yPYic5LjcUnBp3SzZSaMmxdQrFm.png" isMerged="true" [V0_FILE]png:file="public/beeeval-new-interface.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344914-f15xaxC2IoPDL5eYcSBtdLvgFjbtxw.png" isMerged="true" [V0_FILE]png:file="public/cyberspark-diagram.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/117-uOhUzwJNRjL6urvLPe7TWfEJW05NpL.png" isMerged="true" [V0_FILE]jpeg:file="public/dataset-interface.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/8ceb5ef026df9275fed0d1147ec19e22.jpg-qPhR2jCThEbaqVpNAlImyNIHsxpCih.jpeg" isMerged="true" [V0_FILE]png:file="public/gradient-bg.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Group%201739332098-adu6D9OpTPu8UMYB0J04yXQUgFIcKe.png" isMerged="true" [V0_FILE]png:file="public/logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/logo-QT9KGk2ELEuUYhLFJYEvwYcriYGaDJ.png" isMerged="true" [V0_FILE]png:file="public/dataset-interface.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E5%A4%9A%E6%A8%A1%E6%80%81%E6%95%B0%E6%8D%AE%E9%9B%86-ax1nTdW9aEIrGAslOmtDMZvowiI05t.png" isMerged="true" [V0_FILE]css:file="app/globals.css" isEdit="true" isQuickEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); /* 添加专用的按钮颜色变量 */ --button-black-bg: #000000; --button-black-text: #ffffff; } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { /* optional: --font-sans, --font-serif, --font-mono if they are applied in the layout.tsx */ --font-sans: var(--font-microsoft-yahei), "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Microsoft JhengHei", "SimHei", sans-serif; --font-serif: var(--font-microsoft-yahei), "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Microsoft JhengHei", "SimHei", serif; --font-mono: "Consolas", "Monaco", "Courier New", monospace; --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* 使用更强的CSS选择器和更高优先级来确保渐变背景正确应用 */ @layer components { .cyberspark-gradient, section.cyberspark-gradient { background: linear-gradient(135deg, #4c61f4 0%, #9396ff 100%) !important; background-color: #4c61f4 !important; } /* 更新导航栏渐变背景为与CyberSpark区域一致的蓝紫色渐变 */ .nav-gradient, header.nav-gradient { background: linear-gradient(to right, #4c61f4, #9396ff) !important; background-color: #4c61f4 !important; } /* 添加滚动交互动效样式 */ .scroll-overlay { position: relative; z-index: 20; } .sticky-hero { position: sticky; top: 0; z-index: 10; } /* 使用更强的CSS选择器强制应用黑色按钮样式 */ .explore-button, div.explore-button, [data-button="explore"], .explore-button[role="button"], html .explore-button, html body .explore-button, html body div .explore-button, body .explore-button, * .explore-button, section .explore-button, div[role="button"].explore-button { background-color: #000000 !important; background: #000000 !important; background-image: none !important; color: #ffffff !important; border: none !important; border-color: transparent !important; box-shadow: none !important; text-decoration: none !important; opacity: 1 !important; } .explore-button:hover, div.explore-button:hover, [data-button="explore"]:hover, .explore-button[role="button"]:hover { background-color: rgba(0, 0, 0, 0.9) !important; background: rgba(0, 0, 0, 0.9) !important; color: #ffffff !important; } /* 添加更多极端的选择器来覆盖任何可能的样式干扰 */ .explore-button * { color: #ffffff !important; } /* 使用更强的选择器修复英雄区统计数据的背景对比度问题 */ .hero-stats, div.hero-stats, section div.hero-stats, .hero-stats.bg-white\/20, div.text-right.hero-stats { background-color: rgba(255, 255, 255, 0.95) !important; background: rgba(255, 255, 255, 0.95) !important; backdrop-filter: blur(10px) !important; border-radius: 12px !important; padding: 16px !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important; } .hero-stats .stat-number, .hero-stats div.stat-number, div.hero-stats .text-black, div.hero-stats .text-4xl { color: #000000 !important; opacity: 1 !important; } .hero-stats .stat-label, .hero-stats div.stat-label, div.hero-stats .text-sm, div.hero-stats .text-center { color: rgba(0, 0, 0, 0.8) !important; opacity: 1 !important; } /* 修复产品卡片的渐变背景和文字对比度 */ .product-card-gradient { background: linear-gradient(to right, #4c61f4, #9396ff) !important; background-color: #4c61f4 !important; } .product-card-gradient .product-tag, .product-card-gradient span.product-tag, div.product-card-gradient span.px-6 { background-color: rgba(0, 0, 0, 0.4) !important; background: rgba(0, 0, 0, 0.4) !important; color: #ffffff !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; } .product-card-gradient h3, .product-card-gradient p, .product-card-gradient span, .product-card-gradient li { color: #ffffff !important; } .product-card-gradient .stat-number { color: #ffffff !important; } .product-card-gradient .stat-label { color: rgba(255, 255, 255, 0.8) !important; } /* Blog标签样式 - 使用深色背景确保白色文字有足够对比度 */ .blog-tag-primary, span.blog-tag-primary, .blog-tag-primary.bg-black\/10 { background-color: rgba(0, 0, 0, 0.8) !important; background: rgba(0, 0, 0, 0.8) !important; color: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.9) !important; } .blog-tag-secondary, span.blog-tag-secondary, .blog-tag-secondary.bg-black\/5 { background-color: rgba(0, 0, 0, 0.6) !important; background: rgba(0, 0, 0, 0.6) !important; color: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.7) !important; } /* 确保Blog标签文字颜色正确 */ .blog-tag-primary *, .blog-tag-secondary * { color: #ffffff !important; } /* 添加合作伙伴滚动动画 */ .blog-scroll-container { scrollbar-width: thin; scrollbar-color: #4c61f4 transparent; } .blog-scroll-container::-webkit-scrollbar { height: 8px; } .blog-scroll-container::-webkit-scrollbar-track { background: rgba(76, 97, 244, 0.1); border-radius: 4px; } .blog-scroll-container::-webkit-scrollbar-thumb { background: linear-gradient(to right, #4c61f4, #9396ff); border-radius: 4px; transition: all 0.3s ease; } .blog-scroll-container::-webkit-scrollbar-thumb:hover { background: linear-gradient(to right, #3d4ed8, #7c3aed); } /* 隐藏滚动条箭头 */ .blog-scroll-container::-webkit-scrollbar-button { display: none; } /* 添加Blog文章卡片样式，去卡片化设计 */ .blog-article { transition: all 0.3s ease; border-radius: 12px; } .blog-article:hover { transform: translateY(-2px); background-color: rgba(0, 0, 0, 0.02); } .blog-article-image { border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); transition: box-shadow 0.3s ease; } .blog-article:hover .blog-article-image { box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15); } /* 优化Blog标签样式，更加简洁 */ .blog-tag { background-color: rgba(0, 0, 0, 0.08); color: rgba(0, 0, 0, 0.8); border: 1px solid rgba(0, 0, 0, 0.1); transition: all 0.2s ease; } .blog-tag:hover { background-color: rgba(0, 0, 0, 0.12); color: rgba(0, 0, 0, 0.9); } } @keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } .animate-scroll { animation: scroll 30s linear infinite; } [V0_FILE]png:file="public/cyberspark-architecture.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E4%B8%BA%E4%BB%80%E4%B9%88%E9%80%89%E6%8B%A9CyberSpark-PCB5cilzdOvZ4bGtWIUL0CPiuRhFny.png" isMerged="true" [V0_FILE]typescriptreact:file="app/layout.tsx" isEdit="true" isMerged="true" import type React from "react" import type { Metadata } from "next" import "./globals.css" export const metadata: Metadata = { title: "CyberSpark - 智能座舱AI技术解决方案", description: "专注于智能座舱AI技术的企业级解决方案，提供端侧AI模型、多模态数据处理和个性化交互体验", generator: "v0.app", } export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode }>) { return ( {children} ) } [V0_FILE]png:file="public/hero-car-bg.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E6%B1%BD%E8%BD%A6-dHEqhOBhsEeNuXJ90lKRUS3UdDOkAT.png" isMerged="true" [V0_FILE]png:file="public/cyber-sandbox-interface.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/%E5%A1%9E%E4%BC%AF%E6%B2%99%E7%9B%92-vTobfBtmQEBTw5zM1bdma3TOY0dQmN.png" isMerged="true" [V0_FILE]png:file="public/github-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344948-OWf39X87t6R6R0Ja8XBdj4RaWcYovG.png" [V0_FILE]png:file="public/linkedin-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344949-KhwAlgTU29tK9u9ivtkGirvj4NsAeV.png" [V0_FILE]png:file="public/twitter-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image%206344946-rPNsg6bYtSU3cC0GwO5XCeDpoBL7Nq.png" [V0_FILE]png:file="public/footer-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/logo-gCOWwTtvtHtTeFVvAuMkH3jwe9z7fF.png" [V0_FILE]typescriptreact:file="app/page.tsx" isEdit="true" isQuickEdit="true" "use client" import { Button } from "@/components/ui/button" import { useEffect } from "react" export default function HomePage() { useEffect(() => { const handleSmoothScroll = (e: Event) => { const target = e.target as HTMLAnchorElement if (target.hash) { e.preventDefault() const element = document.querySelector(target.hash) if (element) { element.scrollIntoView({ behavior: "smooth", block: "start", }) } } } const navLinks = document.querySelectorAll('a[href^="#"]') navLinks.forEach((link) => { link.addEventListener("click", handleSmoothScroll) }) return () => { navLinks.forEach((link) => { link.removeEventListener("click", handleSmoothScroll) }) } }, []) return (

{/* Navigation Header */}

{/* Logo and Navigation Items - Left Aligned */}

{/* Desktop Navigation - Left aligned next to logo */}

{/* Right Side Elements */}

{/* Mobile menu button */}

{/* Hero Section */}

{/* Content */}

小场景，大数据

我们致力于将前沿 AI 技术融入智能座舱，通过端侧模型与个性化体验的深度结合，重塑人车交互的未来

5000+

座舱数据集

20+

OEM

90%

模型性能

{/* Why Choose CyberSpark Section */}

{/* Section Title */}

为什么选择CyberSpark

{/* 左侧内容区域 */}

{/* Module 1: 全链路解决方案 */}

提供座舱智能化全链路解决方案

从需求调研到产品部署，再到运维闭环，我们提供完整的智能座舱解决方案。覆盖端侧AI模型开发、多模态数据处理、个性化交互设计等核心环节，确保每个项目都能实现最佳的用户体验和技术效果。

{/* Module 2: 全球化服务力 */}

全球化服务力

拥有跨地域协同适配能力，支持多语言、多文化背景下的智能座舱部署。我们的团队具备丰富的国际项目经验，能够快速响应不同市场需求，为全球汽车制造商提供本地化AI技术解决方案。

{/* 右侧架构图区域 */}

{/* 智能座舱生态伙伴区域 */}

智能座舱生态伙伴

{/* 滚动合作伙伴名称 */}

DENSO 保时捷奔驰丰田奥迪中科创达极氪理想延锋上汽大众 {/* 重复一遍以实现无缝滚动 */} DENSO 保时捷奔驰丰田奥迪中科创达极氪理想延锋上汽大众

{/* Solutions Section */}

智能座舱解决方案

端侧模型上车，让智能座舱与你'同频共感'，瞬间懂你，即刻响应。

{/* Solution 1 */}

极速响应、告别延迟

模型压缩率提升 80%
行车安全的硬核守护者
端云协同，离线运行能力

{/* Solution 2 */}

深度个性，专属体验

多模态感知融合，理解驾驶环境
场景化 AI 助手，主动交互
情感计算，提升用户体验

{/* Solution 3 */}

隐私堡垒，安全无忧

用户行为模式学习与预测
隐私保护的本地化记忆存储
跨设备记忆同步与迁移

{/* Products Section */}

核心产品

{/* Product 1: 多模态数据集 */}

{/* 左侧内容区域 - 固定宽度 */}

多模态数据集

整合语音、视觉、传感器等多维度数据，构建智能座舱专用的高质量训练数据集。

50000+

座舱数据集

全球首个最大数据集社区
支持实时数据标注

{/* Product 2: BeeEval测评网站 */}

{/* 左侧内容区域 - 固定宽度 */}

BeeEval测评网站

整合语音、视觉、传感器等多维度数据，构建智能座舱专用的高质量训练数据集。

{"60+"}

{"车型"}

多维度性能评估
实时测评报告生成

{/* 图片区域延伸到页面右边缘 */}

{/* Product 3: CyberSpark™ 模型 */}

{/* 左侧内容区域 - 固定宽度 */}

Cyber沙盒

我们帮助研发团队在真实硬件环境下，客观、高效地量化评估AI模型的真实性能，让复杂的AI选型和优化过程变得像查阅一份可信的“性能评测报告”一样简单。

{"30+"}

模型

端侧部署优化
实时性能展示

{/* Tech Blog Section */}

技术Blog

{/* Blog Post 1 */}

{"全球最大智能座舱多模态开源"}

{ "「CyberData塞塔」智能座舱用户行为数据集是一个专为加速智能座舱感知算法开发而设计的高质量、程序化生成的图像数据集。" }

{/* Blog Post 2 */}

{"一文了解智能座舱Agent系统"}

端云协同的混合智能调度：在端侧处理高频、低延迟任务，将复杂、非实时的长思考链任务卸载至云端，实现算力无限扩展。

{/* Blog Post 3 */}

Agentic与Agent到到底有啥区

从“AI Agent”到“Agentic AI”，是智能座舱从“工具”向“伙伴”演进的关键一步。Agentic AI通过其高度的自主性、主动性和学习能力，…

{/* Blog Post 4 */}

{"微调训练技术"}

{ "大模型微调，特别是以LoRA/QLoRA为代表的参数高效微调（PEFT）技术，是解决车载AI在资源、实时性和安全等多重约束下部署困境…\n\n" }

{/* Blog Post 5 */}

{"车载类人记忆的实现"}

车载AI记忆系统的发展历程，是一场明确的范式转移——它正从基础的数据存储，迈向复杂的、类人的认知架构的构建。

{/* Blog Post 6 */}

{"多模型还是单模型"}

在当前及下一代主流车型中，采用多个小模型的MoE架构是实现车载AI体验与工程可行性平衡的最佳路径。它在低延迟、高效率、低功…

{/* Contact Section */}

联系我们

期待与您的合作，共同推动智能座舱技术发展

{/* Contact Methods */}

邮箱联系

{"Victorhu@xailab.cn"}

电话咨询

+86 15221360031

办公地址

上海市杨浦区四平路1028弄39号102 NICE 2035

{/* Footer */}

) }