精选 · 开放 · 免费

Akiflow

一款统一的任务与日历应用，运用AI助您节省时间。

productcalendar

Akiflow 网站截图

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

原站: https://akiflow.com

📦 浏览包内文件 →

01

设计气质 DNA

效率AI日历任务效能

一款智能、简洁的数字规划工具，将您的日程安排和待办事项整合到一个AI驱动的视图中。

02

色彩

#8B00FFAccent

#212833Ink

#323B4AInk soft

#FFFFFFBG

#F8FAFCBG soft

#EEF3F8BG quiet

#5E687BMuted

rgba(0, 0, 0, 0.08)Line

以干净的白色画布为基础，点缀以高对比度、高饱和度的紫色，用于主要操作和高亮显示，且使用克制。

03

字体

geometric-sans · humanist-sans

display64px · 500
display-sm48px · 500
body18px · 400

使用几何无衬线体作为醒目的展示标题。 · 使用人文无衬线体作为清晰、易读的正文文本。 · 大标题保持紧凑的字间距。

04

间距

4px

8px

16px

24px

32px

48px

64px

96px

主要元素周围留有充足的空白，营造专注、整洁的感觉。

05

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

sm · 6px

md · 10px

lg · 16px

pill · 999px

使用极低透明度黑色的1px实线边框，营造微妙的边界感。

0px 1px 20px rgba(0, 0, 0, 0.08) · 0px 1px 6px rgba(0, 0, 0, 0.16) · 0px 1px 16px rgba(144, 0, 255, 0.2)

06

布局

1200container

12columns

24pxgutter

768 / 1024breakpoints

首页采用居中单栏布局，功能网格区域则过渡为多栏布局。

07

动效与交互

200msmicro

400mssmall

800msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

内容块在滚动时轻微淡入。 · 按钮和链接在悬停时平滑过渡。

按钮亮度略微增加或显示细微的紫色光晕阴影。 · 主按钮有轻微的缩放效果。

08

组件

button 药丸形主按钮，采用纯紫色背景和白色文字，悬停时带有细微光晕效果。
card 简洁的白色卡片，带有非常细微的阴影和较大的圆角，常用于展示产品界面。
chip 用于标签或标记的小型圆角矩形徽章。
input 简洁、无边框或带细微边框的输入框，采用浅灰色背景。
hero 一个居中的巨大标题，下方是副标题、主CTA按钮和一张大型产品截图。

09

文案语气与禁用清单

语气自信、直接，以效率为导向。
标题风格 简短、有力、以利益点驱动的陈述。
按钮文案 行动导向且清晰，例如“免费试用”。

不要使用深色模式——截图显示背景以白色为主。
不要使用衬线字体——截图显示的是简洁的几何与人文无衬线字体。
不要使用过于复杂的渐变——截图显示的是纯色以及在特定区域使用非常细微、几乎难以察觉的渐变。
不要使用狭小、拥挤的布局——截图显示的是充足的间距和大而醒目的字体。
不要使用冲突的颜色——截图显示的是由白色、深灰色和单一紫色点缀构成的严谨配色方案。
不要使用生硬的直角——截图显示按钮、卡片和UI元素都一致使用了圆角。
避免: 过于技术化的术语
避免: 模糊的营销辞令
避免: 被动语态

10

包内真实截图

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Akiflow — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Akiflow是一款用于任务和日历的效率SaaS应用，由AI驱动。设计简洁专业，使用白色背景（#FFFFFF）搭配深墨色（#212833）文字。主要点缀色是高饱和度的紫色（#8B00FF）。字体是几何与人文无衬线的混合体。关键禁忌：避免深色模式，不使用衬线字体，避免布局拥挤且带有生硬的直角。整体感觉是高效、现代且专注的。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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