AI Product

Parchment Hearth

A hushed AI chat workspace: cream paper, one terracotta lantern seal.

The interface reads like a sheet of cream laid paper under a lamp. About 88% of it is warm, yellow-brown neutrals, and the only color is a small terracotta three-ellipse lantern beside the greeting. A 36px light Newsreader greeting sits against 12–14px chrome, and a pure-white 24px-radius composer lifts off the page with a barely visible shadow. There are no gradients, glass or noise, and the motion is slow and restrained. It suits everyday-life assistants and writing or note apps.

Included with Pro · Buy individually for ¥19 · Updated · Live demo

Signature details

  • One color only: the terracotta three-ellipse lantern
  • 36px light serif greeting against tiny chrome
  • Pure-white 24px composer lifting off cream paper
  • Warm-tinted grays, no gradient, glass or noise

Page sections

  1. Rail header & segmented control
  2. Primary nav
  3. Recents
  4. Account footer
  5. Top bar
  6. Greeting & lantern mark
  7. Composer
  8. Starter chips
  9. Conversation thread

Palette

  • 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)

Typefaces

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

Prompt outline

  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

How to use this style

Copy the full prompt into any AI; or download it as an agent skill / Cursor rule / AGENTS.md; or, in any MCP-connected tool, say: “Build this page in the parchment-hearth-chat style from ui-atlas”.

Free preview

# 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.