OpenDesign·你的设计资产库

网页参考

Mymind

一个私密、毫不费力的空间，用来记住并整理一切。

ProductBookmarks
Mymind 网站截图

01

设计气质 DNA

记忆整理简约私密助手

一个宁静、包罗万象的、能自我组织的数字图书馆。

02

色彩

#FF5924Accent
#000000Ink
#3A475AInk soft
#FFFFFFBG
#F5F7F9BG soft
#FFEDEDBG quiet
#748297Muted
rgba(0,0,0,0.1)Line

干净、开阔的留白，点缀着温暖、充满活力的橙色强调色，以及柔和、友好的多彩高光。

03

字体

transitional-serif · humanist-sans · monospace

  • display80px · 400
  • h152px · 400
  • body18px · 400
  • small16px · 400

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

一致使用 4px 基础网格，并辅以充裕的 padding（20px, 24px, 40px）以确保呼吸感。

05

表面 (圆角 / 阴影 / 边线)

sm · 4px
md · 12px
lg · 16px
pill · 999px

微弱的 1px 实线边框，使用克制，主要用于胶囊形标签和输入框。

0px 57px 60px -54px rgba(255,154,36,0.1) · 0px 0px 120px 0px rgba(0,0,0,0.15)

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

居中对齐的布局，巨大的、流畅的圆形背景渐变勾勒出核心内容区域。

07

动效与交互

200msmicro
250mssmall
700msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

针对 hover 状态和菜单展开的平滑、弹性过渡。

交互元素上的微妙缩放和色彩变化，手形光标表示可点击。 · 通过微妙的色彩加深提供即时视觉反馈。

08

组件

  • button 胶囊形（border-radius: 999px），实心橙色背景配白色文字，或带有细边框的描边样式。
  • card 干净的白色卡片，带有微妙的圆角（12-16px），用于内容预览。
  • chip 小型、圆润的胶囊形状，带有浅色柔彩描边和彩色文字，用于内容分类。
  • input 圆角的搜索栏，带有微妙的灰色背景和斜体占位符文本。
  • hero 超大衬线字体排版，居中放置在大型、柔和的径向渐变之上。

09

文案语气与禁用清单

  • 语气 令人安心、自信且极简。
  • 标题风格 简短、有力、充满悖论感的陈述，使用优雅的衬线字体。
  • 按钮文案 直接且以行动为导向，常使用大写或粗体无衬线字体。
  • 不要使用复杂的网格或多栏布局——截图显示的是居中的、单栏焦点。
  • 不要使用深色模式或深色背景——截图显示的是以白色（#FFFFFF）为主的画布。
  • 不要使用尖锐、方正的圆角——截图显示的是广泛使用的圆角、胶囊形元素。
  • 不要使用严格的单色调色板——截图包含一个活力橙色强调色（#FF5924）和柔和的柔彩色。
  • 不要使用粗体、厚重的无衬线字体作为标题——截图使用的是精致的过渡衬线展示字体。
  • 不要使用具有攻击性的、方正的按钮——截图显示的是柔和的、圆润的胶囊形按钮。
  • 避免: 复杂的组织学术语
  • 避免: 视觉杂乱
  • 避免: 厚重的边框
  • 避免: 密集的文本块

10

包内真实截图

Mymind — 桌面首屏（hero）
桌面首屏（hero）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Mymind — 移动首屏
移动首屏

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

mymind.com 是一个私密、毫不费力的数字记忆与组织工具。其设计 DNA 以干净白色背景上的超大过渡衬线标题为特征，点缀着活力橙色（#FF5924）和柔和、友好的柔彩色高光。布局居中且极简，使用 4px 网格以确保间距一致，以及高度圆润的胶囊形组件。它通过充裕的留白和流畅、优雅的过渡来维持平静、高级的感觉。关键禁忌：避免深色模式，避免尖锐圆角，避免密集的多栏网格，避免厚重的无衬线展示字体，避免视觉杂乱，以及避免具有攻击性或方正的按钮样式。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明，可复制给 Agent。