精选 · 开放 · 免费
Hourly App
一个由超大、紧密排布的排版和鲜明的黑-红-奶白色调定义的效率工具应用落地页。
Bold TypographyApp UIMinimalMobile UITooling
01
设计气质 DNA
极简大胆趣味实用
一款实用工具应用的高对比度排版海报
02
色彩
#D0021BAccent
#EEE1C1Ink
#0A0A0ABG
rgba(238, 225, 193, 1)Line
采用黑、奶油白、红三种颜色的严格配色，实现极致对比。
03
字体
grotesque-sans
- display
217px · 700 - headline
44px · 700 - body
16px · 700
所有主要文本均使用粗体的 grotesque 无衬线字体。 · 全文采用紧凑的字距和行距。 · 文本常作为主要的视觉元素。
04
间距
不规则，由超大的排版模块驱动，而非遵循一致的网格系统。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
用于分隔板块的 1px 实线 #EEE1C1 水平分割线
06
布局
1280container
1columns
768breakpoints
全宽垂直堆叠，包含超大的排版主视觉区和手机模型。
07
动效与交互
200msmicro
250mssmall
0msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
在 hover 和交互时使用简单的过渡效果。
悬停在可交互元素上时，光标变为指针。 · 标准指针交互。
08
组件
- button 简单的文本行动号召（“下载”），无边框。
- card 无，主要使用手机模型作为视觉呈现。
- chip 无
- input 无
- hero 全屏、主导性的排版，用单个单词填满视口。
09
文案语气与禁用清单
- 语气 直接、有力、极简。
- 标题风格 超大字号、紧密排列的词语。
- 按钮文案 简单的小写文本（“下载”）。
- 不要使用宽字距——截图显示为紧凑的字距。
- 不要使用细字体权重——截图仅显示粗体文本。
- 不要使用多样的背景颜色——截图显示为纯色深色背景。
- 不要使用投影——截图显示完全扁平的排版。
- 不要使用装饰性边框或框架——截图使用简单的水平分割线。
- 不要对大段文本使用居中对齐——截图显示为左对齐且模块重叠。
- 避免: 华丽或过度描述性的语言。
- 避免: 微妙或柔和的调色板。
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
此设计是一个面向移动应用的极简、高冲击力落地页，几乎完全依赖超大、紧密排布的粗体排版来传达信息。核心配色限制在三种颜色：近乎纯黑的背景 (#0A0A0A)、用于主要文本和边框的暖调奶油白 (#EEE1C1)，以及用于点缀和强调的鲜艳红色 (#D0021B)。排版采用粗体的 grotesque 无衬线字体，常放大至巨大尺寸，并设置非常紧凑的行距和字距。关键设计约束包括：避免使用细字体权重、避免使用宽字距、避免使用投影或复杂背景，并保持鲜明、高对比度的美学。布局为单栏垂直堆叠，由手机模型来分隔文本模块。
en · zh-CN · zh-TW · ja · ko