Base44 网站预览
Base44 网站预览

Base44

近白色基底、胶囊形控件与圆角卡片。

页面以近白色为基底,搭配近黑色文字。局部操作控件以浅黄绿色强调。字体采用 WixMadeforText、WixMisoRegular。视觉特点包括胶囊形控件、圆角卡片、渐变展示、紧密字距。适合参考的场景:AI 服务首页、产品演示介绍页。

查看原始网站

使用规范

建议采用

  • 在48-56px字号、400字重、-0.96px字间距下使用WixMisoRegular,用于所有主要标题——单字重的衬线字体带来沉静的权威感,不喧宾夺主
  • 所有按钮和标签的圆角设置为9999px——完全圆润的形状是系统的标志性轮廓
  • 主要行动号召按钮使用#ebffb1填充 + #ade900边框,绝不使用纯黑或蓝色——青柠绿的发光效果是品牌的标志性操作
  • 所有结构分隔线保持1px #d1d1d1的细线边框——绝不使用更粗的边框或可见的抬升来分隔内容
  • 保持页面画布为#faf9f7(温暖的骨色)并仅在需要时使用#ffffff为卡片提供脱离画布的视觉效果——双色表面系统是整个深度模型
  • 所有区块标签应用全大写眉题标签处理(12px,0.18em字间距,500字重)——将小字号文本转化为具有建筑感的引导标识
  • 所有入口动画使用cubic-bezier(0.22, 1, 0.36, 1)——弹簧式缓动效果与温暖、从容的氛围相匹配

建议避免

  • 不要为卡片添加阴影——系统通过背景对比(白底配骨色)建立层级,而非通过抬升。仅保留单个阴影用于首屏提示卡片
  • 不要在文本或大面积填充中使用#ff631f橙色——该色仅用于标志、装饰元素以及输入框内的提交圆圈
  • 不要将标题字重设得高于400——系统通过字重和字间距建立层级,而非通过粗体。更重的字重会破坏沉静、宽敞的氛围
  • 不要使用饱和蓝色用于链接或操作——系统没有传统意义上的‘信息蓝’;交互元素仅使用青绿、黑色或透明描边
  • 不要创建深色区域——页面整体为亮色模式。仅使用夕阳渐变色带作为氛围过渡,绝不用全黑背景
  • 不要使用超过1px的边框——细线美学是整个结构语言。更粗的边框会显得沉重且具企业感
  • 不要在任何表面使用小于8px的圆角——系统采用慷慨的圆角(8px卡片,30px首屏卡片,9999px胶囊按钮)。尖锐的边角与温暖、友好的调性相冲突