Telegram、 WhatsApp+380637610482
瓦列里·丹尤克
瓦列里·丹尤克开发者为企业开发人工智能工具。高质量,价格实惠。通过 Telegram 联系
Stripe — 此风格的网站预览

Stripe

一本用靛蓝墨水写在磨砂玻璃上的账簿

Stripe在金融工具的界面设计中采用了近乎单色的语言:柔和的冷白色底色搭配深蓝色标题,几乎没有任何装饰性的镀铬元素,仅使用一种亮靛蓝色 (#533afd) 作为按钮、链接或图标的轮廓。字体极其纤细,即使在 56px 的字号下也只有 300 磅的字重,给人一种自信低调而非过于正式的感觉;字母间距随着字号的增大而急剧缩小。按钮小巧方正 (4px),填充紫色或使用极细的紫色轮廓。整个系统完全避免使用阴影;深度是通过改变背景色调(白色 → #f8fafd → #e5edf5 → 紫色调)来实现的,而不是通过阴影的立体感。整个界面就像一个会计账簿或终端:信息密集,线条清晰,各部分之间留有足够的空间,颜色仅在需要操作时才会出现。

在白色画布上,居中内容栏的最大宽度约为 1320 像素。首页醒目位置是一个左对齐的全尺寸文本块(56 像素),下方有两个行动号召按钮,没有醒目的图片——文字本身就是视觉焦点。各部分垂直排列,间距均为 96 像素,分隔线为 1 像素的 #e5edf5 色;没有深浅交替的条纹。每个部分都遵循重复的模式:一个全部大写的短标题(烟灰色,12 像素),然后是一个 32-48 像素的标题,接着是一个 22 像素的段落,然后是一个产品卡片网格(桌面端为 3 列)或一个带有视觉元素的 2 列文本块。客户徽标以窄的垂直条带形式显示,左对齐。页脚是一个宽的 #f8fafd 色条带,其中包含多列链接列表。整体节奏缓慢、沉稳,以文本为主——尽管滚动长度较长,但信息密度较低。

图像风格克制而写实。全页照片仅出现在案例研究部分(例如,赫兹的航拍交通照片),均采用俯拍或极具戏剧性的角度,并使用自然色彩——不使用双色调或色彩处理。产品用户界面的屏幕截图用于功能卡片中,以锐利的线条和清晰的边框呈现,不带设备边框。合作伙伴的徽标以各自的颜色显示,不带任何容器。页面中没有插图、3D渲染图或装饰性抽象图形元素。图标统一:白色背景上的1号线宽和2号线宽,采用几何线条艺术(人字形、箭头、勾号、文档符号)。页面主要由文本和留白构成;图像占比不到总视觉面积的3%。

调色板

品牌

  • Indigo Ink #533afd — 紫色用于填充按钮、选定的导航状态和焦点驱动的转化时刻。
  • Indigo Hover #7389ff — 紫色用于突出显示链接、标签和短语。它不应该用作行动号召的主要颜色。

中性的

  • Midnight Ink #061b31 — 主标题和正文采用深邃的近乎黑色的颜色,并带有一丝冷蓝色调,这构成了整个字体系统的基础。
  • Slate #64748d — 灰色文字突出显示链接、标签和短语。
  • Steel #50617a — 附加文本和辅助材料位于子许可中使用的石板灰和柔和的紫色调之间。
  • Smoke #839bc8 — 大型装饰性标题和正文采用柔和的紫色,但正文段落中绝不使用紫色。
  • Pure White #ffffff — 页面画布和卡片的凸起表面;作为衡量其他一切的默认背景。
  • Mist #f8fafd — 页脚背景和章节分隔线采用柔和的冷色调,在没有可见边界的情况下分隔各个区域。

排版

从 12 像素到 56 像素 · 9 步

  • sohne-var — 替代品: Inter Tight (variable · 轮廓 300, 400 · 整个界面仅使用一种字体,用于标题、正文、导航、按钮和标签。即使在 56px 的屏幕尺寸下,300 字重依然是主流,这是一个显著的特点:标题以低语而非喧嚣的方式呈现,通过克制而非音量来彰显权威。400 字重仅在 14-16px 的屏幕尺寸下用于导航和按钮文本,在较小尺寸下,为了保证清晰度,需要增加一笔。

音程和形式

目的意义
密度宽敞
基本步骤8px
按钮半径4px
卡片半径4px
阴影无边框,取而代之的是阴影
各部分之间96px
页面宽度1320px

AI 将按照Stripe风格构建您的网站并填充内容。

  • 通过链接( Instagram 、 TikTok 、 Facebook )发布产品和帖子。
  • 从旧网站迁移内容——只需指定地址即可。
  • 采用最佳引擎的现代设计: React ( Next.js ),开箱即用服务器端渲染和 SEO 优化。
  • 全自动搜索引擎优化,支持搜索结果和神经网络推荐。

相似风格

  • Ui — 哑光纸上的临床计划
  • monopo saigon — 在编辑的沉默背后,涌动着液态的、虹彩般的光芒——一个漂浮在熔岩之上的单色编辑画廊
  • Ventriloc — 一篇关于暖纸数据的编辑观察文章——一颗橙色的余烬凸显了单色的精准性。
  • Hyer Aviation — 驾驶舱内,暮色笼罩着羊皮纸。淡淡的晨曦与机身大小的衬线字体标志交相辉映,一抹温暖的陶土色打破了单色调的沉闷。
  • Family — 奶油色羊皮纸上的童话故事
  • OFF+BRAND. — 温暖羊皮纸上的虹彩球体
  • Geniestudio — 一本柔和的日光笔记本——那种页边距宽阔,笔画粗细均匀的笔记本。
  • xAI — 暖霜实验室,含黑药丸
  • Seed — 实验室玻璃下的活体生物
  • Cosmos — 一面铺着亚麻布、挂满宝丽来照片的画廊墙
  • Cal — 黑白配色,实用至上,人性化设计。这套系统以简洁的黑白配色为主,注重清晰度和功能性,同时辅以友好的字体和圆润的造型,营造出柔和舒适的视觉效果。
  • T1 Energy — 一幅绘制在温暖羊皮纸上的生产设施图,呈现出一幅宁静的单色画面,工业规模和微妙的字体设计体现了整个品牌的精髓。