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

Shop

白色大理石上漂浮的交易星座

这家网店采用“白画布”模式,产品以大幅弧形图片卡片的形式展示,而非缩略图网格。整个界面极其流畅:圆角半径为 20-28 像素,控件呈药丸状,紧凑的 16 像素 GT 标准字重搭配紧密的负间距,使文字清晰醒目。系统中唯一的醒目点缀是充满活力的紫色 (#5433eb),它出现在徽标、圆形搜索结果框以及按钮的阴影部分。其余色调则以温暖的中性色为主:白色背景、柔和的冷灰色画布、简洁的边框以及近乎黑色的文字。12 像素的间距保持了紧凑的视觉效果,而醒目的主图和类别条纹则采用了 64-80 像素的宽阔垂直间距,使购物体验更像是浏览而非浏览产品目录。

页面最大宽度为 1200 像素,居中显示在半透明的 #f2f4f5 画布上,左侧有一个 64 像素宽的固定侧边栏,仅包含导航图标。主元素是一个全宽条形区域,产品卡片位于居中的紫色“商店”标志上方,其正下方是一个药丸状的搜索栏。类别药丸排列在搜索栏下方居中的一行。内容板块(女装、男装、美妆、家居、婴幼儿)以条形区域的形式呈现,每个板块包含一个四列网格(包含产品图片)或一个两列的“主元素+网格”组合。垂直方向的布局较为宽松:主板块之间间隔 64-80 像素。页脚是页面底部的深色条形区域,包含列状链接组。水平产品面板右侧的轮播箭头指示可滚动的内容,但没有分页点。

摄影是主要的视觉元素:全屏产品照片以白色为背景,采用 1:1 裁剪比例,生活方式图片则以温暖的大地色调(米色、赤陶色、鼠尾草绿、象牙色)为主。产品图片拥有独立的色彩——用户界面保持无彩色,使产品色调能够带来丰富的视觉效果。品牌标识以叠加文字的形式出现在深色或浅色的主图上,而非独立的图标。在主界面中,产品卡片以悬浮的、略微重叠的星形图案形式位于品牌标识上方。图标采用极简主义的单色设计(黑色轮廓),类别图标除外,类别图标使用单一的品牌颜色。产品图片中没有插图、3D 效果或渐变色。

调色板

品牌

  • Shop Violet #5433eb — 发送按钮、虚线文字标记和品牌标志是白色背景上仅有的几个点缀,它们突显了动作和个性。
  • Violet Wash #c0b5f3 — 紫色发送按钮后面有一个半透明的光晕,它保持发光状态,色调不变。

中性的

  • Canvas Mist #f2f4f5 — 页面背景和凸起卡片背后的附加表面处理。
  • Pure White #ffffff — 卡片、输入字段、浮动标志和药丸形按钮的主要表面。
  • Ink Black #000000 — 深色模式下的主要文本、标题、图标、导航符号和产品卡片。
  • Faint Border #ebebeb — 卡片上的细分割线、输入字段轮廓和药丸状按钮框。
  • Muted Gray #787574 — 辅助文本、导航标签、图标轮廓(非活动状态)
  • Cool Stone #cccccc — 占位符、禁用状态和非活动图标背景

排版

从 11 像素到 16 像素 · 4 步

  • GT Standard — 替代品: Inter · 轮廓 400 · 所有字号的主字体——包括正文和标题——均为 GTStandard-MRegular。GTStandard-MRegular(16px/-0.031em)是正文、按钮和标签的主字体。GTStandard-MSemibold(20px/-0.05em)用于多个大标题;GTStandard-MMedium(11-12px)用于微型标题。每种字体变体的视觉粗细均为 400——字体层次是通过微妙的渐变和密集的负间距来实现的,而不是通过粗体对比。这是本店的标志性风格:它不使用粗体字来强调视觉效果,而是通过字母间距来塑造文本。
  • Shopify Sans — 替代品: Inter · 轮廓 400, 700 · 保留用于系统级消息,例如应用程序加载横幅和 Cookie 同意文本。

音程和形式

目的意义
密度平均的
基本步骤12px
按钮半径9999px
卡片半径28px
阴影柔和的阴影
各部分之间64px
页面宽度1200px

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

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

相似风格

  • Cursor — 一间温馨的羊皮纸工作室,被燃烧的煤炭照亮
  • Slush — 粉彩纸上的充气贴纸宇宙
  • MindMarket — 这是一本印在奶油色纸上的温馨童话书——友好的编辑画布上,醒目的国际标题和剪纸人物在阳光普照、柔软的贴纸表面上和谐共存。
  • Airbnb — 一面静谧的白色画廊墙,上面挂着一枚珊瑚红色的书签。
  • Superr — 午后柔和的阳光下,一本温暖的笔记本映入眼帘。米白色纸页,一支没盖笔帽的橙色马克笔,还有一叠等着撕下来的塑封姓名贴纸。
  • Apple (España) — 在柔和的日光下,博物馆展厅是一个单一、迷人、轻盈的白色空间,每个展品都由一束聚光灯照亮,照射在浅色墙壁上。
  • Lamborghini — 展厅里,一辆黑色车身的黄色汽车在聚光灯下熠熠生辉。
  • Amplemarket — 阳光普照的工作场所,到处散落着五彩纸屑。
  • Getharvest — 夕阳西下,书桌的金色光芒映照在眼前——温暖的米色画布上挂着白色明信片,一簇明亮的橙色火焰点缀其间。
  • Agence Foudre — 杂志封面采用柔和的粉红色,让人联想到口红的颜色。
  • Drive Capital — 复古公路旅行海报,印在暖色调纸张上
  • Apple (España) — 白色画廊展示柜