精选 · 开放 · 免费

Bear

一款界面精致、文本优先的专注型 markdown 笔记应用。

productnotes

Bear 网站截图

↓ 下载设计系统包 (11 MB)在 OpenDesign 中打开

原站: https://bear.app

📦 浏览包内文件 →

01

设计气质 DNA

极简markdown专注Apple 原生

为 Apple 生态打造的简洁现代笔记本

02

色彩

#DD4C4FAccent

#444444Ink

#FFFFFFBG

#888888Muted

rgba(68,68,68,1)Line

以洁净白色画布为底，搭配高对比度文字，并以单一暖红色作为品牌点缀。

03

字体

humanist-sans · monospace

display56px · 700
heading40px · 700
body16px · 400
caption14px · 400

标题采用字距紧凑的简洁人文主义无衬线字体 · 正文使用同族字体，并设置充裕行高以提升可读性 · 等宽字体严格限定用于代码片段与技术参考

04

间距

4px

8px

16px

24px

32px

48px

64px

96px

主要区块间采用充裕的 64px 垂直节奏

05

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

sm · 4px

md · 8px

lg · 16px

pill · 999px

1px solid #444444

0px 13px 34px 0px rgba(0, 0, 0, 0.12) · 0px -5px 15px 1px rgba(0, 0, 0, 0.2)

06

布局

1280container

12columns

24pxgutter

768 / 1024breakpoints

居中单栏布局，内容与应用截图区块交替呈现

07

动效与交互

200msmicro

400mssmall

800msmedium

cubic-bezier(0.25, 0.1, 0.25, 1)easing

内容区块平滑淡入 · 应用截图呈现细微浮动效果

导航与按钮采用细微的透明度或色彩变化 · 即时反馈，视觉状态变化极小

08

组件

button 简约胶囊形或圆角矩形，搭配细边框与透明背景
card 洁净白色卡片，带有细微投影，有时悬浮于彩色背景之上
chip 用于应用分类的简约圆角标签
input 带底部细边框的极简文本输入框
hero 居中文字配合设备选择器，下方悬浮大幅应用截图

09

文案语气与禁用清单

语气友好、自信且克制
标题风格 简短有力，聚焦核心收益
按钮文案 直接且行动导向，通常关联 App Store

切勿将深色模式作为主要界面——截图显示为洁净白色背景
切勿使用厚重投影——截图显示为非常细微、大半径的阴影
切勿采用密集的多栏布局——截图显示为居中的单栏文本流
切勿使用激进的渐变背景——截图显示为纯色或简洁有机形状
切勿使用粗重边框——截图显示为极细、几乎不可见的边框
切勿使用复杂动画——截图显示为静态、宁静的界面
避免: 过度技术化的行话
避免: 主标题区域的密集段落
避免: 喧嚣、激进的行动号召
避免: 杂乱的视觉层次

10

包内真实截图

Bear — 桌面首屏（hero） — 桌面首屏（hero）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Bear — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Bear 是一款专为 Apple 生态设计的专注型 markdown 笔记应用。其设计 DNA 以极致克制为特征：洁净的白色画布，以及单一暖红色（#DD4C4F）点缀。字体采用精致的人文主义无衬线字体（bearsans/bearsansheadline），同时用于标题与正文，主标题采用粗体、字距紧凑处理。布局严格采用居中单栏，拥有充裕的垂直节奏（64px）和宽边距。关键禁忌：切勿将深色模式作为主要界面，避免厚重投影，永不使用激进渐变，切勿以密集多栏布局使界面杂乱，所有边框保持纤薄、克制。交互模式极简，依赖 hover 状态与细微过渡，而非复杂动效。文案风格友好且克制，聚焦于应用核心的简洁 markdown 写作体验。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko