AI 产品

Parchment Hearth

奶油纸页上盖一枚赤陶灯笼印的静谧AI对话工作台

整个界面像灯下摊开的米色信纸:九成是偏黄褐的暖中性色,唯一的颜色是问候语旁那枚赤陶色三椭圆“灯笼”标记。36px 的 Newsreader 细体问候语与 12–14px 的小字界面形成强烈的尺度对比,纯白输入框以 24px 圆角和几乎看不见的阴影浮在纸面上。没有渐变、玻璃和噪点,动效克制而缓慢。适合做日常生活向的 AI 助手、写作与笔记类产品的空状态与对话壳层。

Pro 会员可用 · 单独购买 ¥19 · 更新于 · Live demo

签名细节

  • 唯一的颜色:三椭圆赤陶灯笼标记
  • 36px 细体衬线问候语对比小字界面
  • 纯白 24px 圆角输入框浮于米色纸面
  • 全部灰色偏暖,无渐变玻璃噪点

页面区块

  1. 侧栏头部与分段控件
  2. 主导航
  3. 最近会话
  4. 账号页脚
  5. 顶部栏
  6. 问候语与灯笼标记
  7. 输入框
  8. 起始提示胶囊
  9. 对话线程

色板

  • Cream Folio #FAF9F6 — background
  • Pure Page #FFFFFF — surface (composer only)
  • Rail Linen #F4F2ED — surface-2 / rail
  • Pressed Parchment #EBE8E2 — active / selected fill
  • Lamp Ink #1F1E1D — text
  • Dusty Umber #6F6D68 — text-muted
  • Terracotta Seal #D26A4B — accent (lantern mark only)
  • Baked Clay #B4512F — accent-text (in-reply links)

字体

  • Newsreader — display (greeting, wordmark)
  • Hanken Grotesk — body / UI
  • JetBrains Mono — mono

提示词目录

  1. Design Intent
  2. Design Tokens
  3. Typography
  4. Color & Material
  5. Layout & Grid
  6. Page Blueprint
  7. Components
  8. Motion & Interaction
  9. Responsive Behavior
  10. Accessibility
  11. Do / Don't
  12. Output Requirements

如何使用这套风格

复制提示词全文粘贴给任意 AI;或下载 Agent 技能 / Cursor 规则 / AGENTS.md;或在接入 MCP 的工具里说:“用 ui-atlas 的 parchment-hearth-chat 风格做这个页面”。

免费预览

# Parchment Hearth — AI Chat Workspace Shell

You are a senior product designer and front-end engineer with an obsessive eye for typography, spacing and motion. Build the logged-in, new-conversation empty state of an AI chat workspace for a fictional assistant called **"Wren"**, in the **Parchment Hearth** style described below. Treat every value in this brief as a spec, not a suggestion.

## 1. Design Intent

Mood: warm, hushed, unhurried. Think of a cream laid-paper folio on a lamplit desk, stamped once with a terracotta seal. The product is for people who use an assistant for everyday thinking, such as cooking, trips, letters and small repairs. The first viewport must feel like a quiet reading room, not a control panel. Almost everything is warm neutral, and a single coral mark carries all the brand energy.