Update landing page accent palette to cyan-violet gradients.

Replace the orange brand colors with sky blue and purple tones across theme tokens, hero chips, and application cards.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
iammm0
2026-05-26 09:20:45 +08:00
parent d721965e8d
commit b363bfeed4
5 changed files with 23 additions and 23 deletions

View File

@@ -22,7 +22,7 @@ const APPS: AppCard[] = [
icon: ScanFace,
bullets: ["52 维 ARKit 表情融合", "面部对齐与多次扫描对比", "AR 捏脸与方案预演"],
gradient: "from-cyan/18 via-cyan/6 to-transparent",
ring: "ring-orange-200/60",
ring: "ring-cyan-200/60",
},
{
brand: "足部扫描",
@@ -33,7 +33,7 @@ const APPS: AppCard[] = [
icon: Footprints,
bullets: ["足弓 / 足型自动分析", "鞋垫模板自动生成", "面向矫形医师的协作"],
gradient: "from-violet/18 via-violet/6 to-transparent",
ring: "ring-rose-200/60",
ring: "ring-violet-200/60",
},
{
brand: "指甲扫描",
@@ -44,7 +44,7 @@ const APPS: AppCard[] = [
icon: Hand,
bullets: ["十指实例分割", "曲率与厚度精准建模", "甲片图案 / 材质在线预览"],
gradient: "from-cyan/18 via-cyan/6 to-transparent",
ring: "ring-orange-200/60",
ring: "ring-cyan-200/60",
},
];

View File

@@ -38,7 +38,7 @@ export function Hero() {
<span className="text-brand-gradient"> 3D </span>,
<br className="hidden sm:block" />
<span className="text-brand-gradient"></span>
<span className="text-brand-gradient"></span>
<span className="text-brand-gradient"></span>
</motion.h1>
<motion.p
@@ -143,8 +143,8 @@ function FloatingChip({
}) {
const dot =
color === "cyan"
? "bg-cyan shadow-[0_0_16px_rgba(251,146,60,0.45)]"
: "bg-violet shadow-[0_0_16px_rgba(251,113,133,0.4)]";
? "bg-cyan shadow-[0_0_16px_rgba(56,189,248,0.45)]"
: "bg-violet shadow-[0_0_16px_rgba(139,92,246,0.4)]";
return (
<div
className={`pointer-events-none absolute hidden sm:flex items-center gap-2.5 rounded-2xl glass px-3.5 py-2.5 ring-soft ${className}`}

View File

@@ -8,8 +8,8 @@
--bg-soft: #f8fafc;
--fg: #0f172a;
--fg-muted: #64748b;
--accent-cyan: #f97316;
--accent-violet: #ef4444;
--accent-cyan: #38bdf8;
--accent-violet: #8b5cf6;
}
html,
@@ -27,7 +27,7 @@ body {
}
::selection {
background: rgba(249, 115, 22, 0.22);
background: rgba(56, 189, 248, 0.22);
color: #0f172a;
}
@@ -43,7 +43,7 @@ body {
border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
background: linear-gradient(180deg, #fdba74, #fb923c 45%, #fb7185);
background: linear-gradient(180deg, #7dd3fc, #38bdf8 45%, #8b5cf6);
}
.bg-line-grid {

View File

@@ -13,12 +13,12 @@ const config: Config = {
600: "#CBD5E1",
},
cyan: {
DEFAULT: "#F97316",
soft: "#FDBA74",
DEFAULT: "#38BDF8",
soft: "#7DD3FC",
},
violet: {
DEFAULT: "#EF4444",
soft: "#FCA5A5",
DEFAULT: "#8B5CF6",
soft: "#A78BFA",
},
},
fontFamily: {
@@ -36,20 +36,20 @@ const config: Config = {
},
backgroundImage: {
"grid-fade":
"radial-gradient(ellipse at center, rgba(251,146,60,0.06) 0%, transparent 75%)",
"radial-gradient(ellipse at center, rgba(56,189,248,0.06) 0%, transparent 75%)",
"brand-gradient":
"linear-gradient(106deg, #E84832 0%, #EC5F30 22%, #F07432 48%, #F38834 72%, #F9AD52 100%)",
"linear-gradient(135deg, #38BDF8 0%, #8B5CF6 100%)",
"brand-gradient-soft":
"linear-gradient(106deg, rgba(232,72,50,0.28) 0%, rgba(240,116,50,0.20) 50%, rgba(249,173,82,0.16) 100%)",
"linear-gradient(135deg, rgba(56,189,248,0.18) 0%, rgba(139,92,246,0.18) 100%)",
"ambient-top":
"radial-gradient(ellipse 90% 70% at 50% -8%, rgba(254,215,170,0.38) 0%, rgba(251,146,60,0.14) 38%, transparent 72%)",
"radial-gradient(ellipse 90% 70% at 50% -8%, rgba(125,211,252,0.35) 0%, rgba(56,189,248,0.12) 38%, transparent 72%)",
"ambient-bottom":
"radial-gradient(ellipse 85% 65% at 50% 108%, rgba(251,113,133,0.22) 0%, rgba(248,113,113,0.10) 42%, transparent 74%)",
"radial-gradient(ellipse 85% 65% at 50% 108%, rgba(139,92,246,0.18) 0%, rgba(167,139,250,0.08) 42%, transparent 74%)",
},
boxShadow: {
"glow-cyan": "0 0 72px -18px rgba(251,146,60,0.28)",
"glow-violet": "0 0 72px -18px rgba(251,113,133,0.24)",
"glow-soft": "0 0 100px -24px rgba(251,146,60,0.18)",
"glow-cyan": "0 0 72px -18px rgba(56,189,248,0.35)",
"glow-violet": "0 0 72px -18px rgba(139,92,246,0.28)",
"glow-soft": "0 0 100px -24px rgba(56,189,248,0.22)",
},
animation: {
"spin-slow": "spin 16s linear infinite",

View File

@@ -6,7 +6,7 @@ export default defineConfig({
plugins: [react()],
server: {
port: 5173,
strictPort: false,
strictPort: true,
},
resolve: {
alias: {