Ajin Im

一个读取古代天文日志的终端界面。

一种深色、低对比度的调色板，选择性地运用紫色和橙色进行强调。

monospace

• display16px · 400
• body14px · 400

所有文本使用等宽字体 · 在等宽字体中使用粗体进行强调 · 链接和标签使用内联代码样式

以 4px 为基础单位，采用标准增量，保持一致的节奏。

1px solid rgba(48, 54, 61, 1)

0 8px 24px rgba(0, 0, 0, 0.4)

一个全出血深色背景，搭配一个居中的模态窗口。

模态窗口出现时的淡入效果 · 交互元素上微妙的悬停过渡

按钮和交互元素在悬停时背景颜色发生微妙变化。 · 立即提供视觉反馈，伴有轻微的缩放或不透明度变化。

• button 等宽字体文本，搭配微妙的背景、边框和悬停状态。
• card 类似模态窗口的容器，具有深色背景、微妙边框和投影。
• chip 小型、等宽字体、内联样式的元素，具有独特的背景和边框。
• input 等宽字体文本输入框，具有深色背景和微妙边框。
• hero 一个覆盖在模糊或变暗背景之上的居中模态窗口。

• 语气 技术性、学术性，且略带古风。
• 标题风格 等宽字体，全小写或混合大小写，常带有技术前缀。
• 按钮文案 简洁、直接，等宽字体文本，常带有箭头。

• 不要使用明亮、饱和的颜色——截图显示的是深色、柔和的调色板搭配微妙的强调色。
• 不要使用无衬线或衬线字体——截图显示的是完全使用等宽字体的排版。
• 不要使用圆角——截图显示的是尖角、矩形的元素，具有最小或没有圆角半径。
• 不要使用复杂的渐变——截图显示的是扁平、纯色的背景。
• 不要使用装饰性插图——截图显示的是一个文本密集、专注于数据的界面。
• 不要对所有文本都使用高对比度——截图对次要信息使用了柔和的灰色文本。
• 避免: 避免明亮、饱和的颜色
• 避免: 避免无衬线字体
• 避免: 避免复杂的动画
• 避免: 避免圆角
• 避免: 避免文字投影
• 避免: 避免装饰性元素