Exo Ape 首页以全屏建筑摄影、克制的导航和醒目的白色大字开场。简洁界面与电影感影像、宽裕留白相结合，呈现沉浸式设计工作室气质。
North star · Let one cinematic, full-bleed image carry the atmosphere while small, precise white interface elements and oversized type provide hierarchy.
The first viewport is led by a full-bleed photograph of Venice’s waterfront architecture, with a cool blue sky and stone building providing the page’s dominant color field. The measured interface palette is deliberately restrained: white navigation and display text, a near-black canvas token, and muted gray for secondary copy. Keep these interface colors distinct from the blues in the photograph, which are image content rather than brand accents. Lausanne-300 supplies the distinctive, clean sans-serif voice. A compact introductory statement sits left of center above an enormous display word that runs toward and beyond the lower viewport edge. Navigation stays small and quiet at the top, while the composition leaves broad areas of open sky around the copy. The page feels spacious despite its dense photographic detail: typography and the building form a strong asymmetrical balance, without visible cards, decorative borders, or pronounced elevation.
Display lettering, navigation, headings, and captions
Aa 设计
Times New Roman
系统字体 · 字重 400 · 占比 4%
免费替代：Libre Baskerville
Measured body text and one navigation style
角色
示例
字号
字重
行高
字距
特大标题
Oversized hero keyword, cropped by the lower viewport edge.
Exo Ape
250px
400
0.73
-0.046em
一级标题
Compact introductory statement describing the studio.
The quick brown fox 敏捷的狐狸
24px
400
1.33
0
正文
General supporting copy where the measured system fallback applies.
The quick brown fox 敏捷的狐狸
16px
400
normal
0
辅助文字
Small secondary labels, including the scroll prompt.
The quick brown fox 敏捷的狐狸
14px
400
1.5
0.007em
导航
Top-right primary navigation links.
The quick brown fox 敏捷的狐狸
14px
400
1.5
0.007em
间距与布局
基准单位 4px · 密度：宽松
99px版块间距
32px元素间距
—卡片内边距
—内容最大宽度
32px
99px
116px
Compose the opening as a viewport-filling photographic hero, with the image covering the canvas. Place the wordmark at the top left and a compact horizontal navigation at the top right. Align the short studio introduction to the left in the middle portion of the frame, then anchor the oversized display word much lower, allowing it to crop at the viewport boundary. The arrangement is asymmetrical and spacious; no measured page max-width is available, so do not impose one.
圆角与层次
没有测到阴影：页面是扁平的，层次靠底色和描边区分。
The interface reads as flat over the photograph, with no measured shadows, card treatment, or visible border system. Create hierarchy through scale, placement, and contrast rather than raised surfaces. Keep the navigation and copy directly over the image; any legibility treatment should remain visually subtle and avoid adding an unmeasured color.
组件
下面的预览按实测的按钮、输入框、徽标、卡片样式重建（字体用替代字体）。
Top navigation
Small white links sit in a single horizontal row at the upper right, balanced by the wordmark on the opposite side.
Wordmark
A compact lowercase white “exo ape” mark anchors the upper-left corner.
Introductory statement
A short white sans-serif studio description is left-aligned over the open sky and broken into a few concise lines.
Display word
One enormous white Lausanne-style word dominates the lower hero and is intentionally cropped by the viewport.
Scroll prompt
A small, subdued prompt near the lower-right edge invites exploration without competing with the display type.
Imagery · Use a cinematic, full-bleed architectural photograph as the defining visual. The reference frames a domed waterfront building against a broad, cloudy blue sky; the building occupies the right side while open sky creates legible space for left-aligned copy. Preserve natural photographic detail and a cool, subdued treatment. Do not reinterpret the image’s blue tones as interface palette colors.
该做与不该做
✓ 该做
Use a single immersive photograph as the hero’s main visual field.
Keep navigation small, white, and aligned to the upper-right edge.
Balance the upper-left wordmark with the navigation.
Place concise introductory copy over a quiet area of the image.
Use oversized, tightly tracked display typography near the bottom.
Treat photographic blues as image content, not interface palette colors.
✕ 不该做
Do not add cards, panels, or decorative borders to the hero.
Do not introduce bright accent colors absent from the measured interface palette.
Do not center every element or force a symmetrical composition.
Do not let supporting copy rival the scale of the display word.
Do not constrain the hero image to a small inset container.
Do not add unmeasured spacing, radii, or shadow values.
给 AI 的提示词
想快速出一个同风格的新页面，把这段话连同 DESIGN.md 一起发给 AI。
Build a new Exo Ape-style page with a cinematic, full-bleed photographic hero and a restrained overlay interface. Use Gallery White (#ffffff) for the wordmark, navigation, and primary copy; reserve Quiet Gray (#9e9fa1) for subdued supporting labels. Night Canvas (#0d0e13) is a measured dark canvas token, not a reason to replace the reference’s photographic hero with a flat dark field. Choose a clean Lausanne-like sans serif, keep navigation compact, and make one display phrase dramatically oversized with tight tracking. Arrange the wordmark upper left, navigation upper right, short left-aligned copy over a quiet image area, and display type low in the frame. Preserve asymmetry, open space, and natural photographic detail. Avoid cards, heavy borders, decorative shadows, and invented accent colors.
