精选 · 开放 · 免费

Atmos Leeroy Ca

融合大胆衬线排版与大气渐变的沉浸式超现实数字体验

EditorialPremiumGradientTypographyGallery
Atmos Leeroy Ca 网站截图
↓ 下载设计系统包 (8 MB)在 OpenDesign 中打开

原站: https://atmos.leeroy.ca

📦 浏览包内文件 →

01

设计气质 DNA

超现实主义氛围感沉浸式高端实验性

如一本奢华的数字杂志或画廊空间，感觉空灵而广阔

02

色彩

#FFFFFFInk
#000000Ink soft
#0A1A99BG
#C5D2F0BG soft
rgba(0, 0, 0, 0.1)Line

空灵的蓝白渐变唤起氛围感、超现实的天空意象，搭配高对比度的白色排版

03

字体

didone-serif · humanist-sans

正文与UI元素使用 DM Sans · 主品牌标识使用 Didone 衬线字体（如 Times New Roman 或 _NewYork） · 导航与圆形文本元素严格使用大写

04

间距

4px
8px
16px
24px
32px
48px
64px
96px
144px
250px

充裕的内边距，英雄区采用144px和250px间距，营造沉浸感

05

表面 (圆角 / 阴影 / 边线)

sm · 4px
md · 8px
lg · 12px
pill · 50px

底部1px白或黑边框，药丸形按钮采用50px圆角

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全出血渐变背景，居中内容与充裕垂直间距

07

动效与交互

220msmicro
500mssmall
1000msmedium
cubic-bezier(0.215, 0.61, 0.355, 1)easing

背景与透明度变化采用1秒线性过渡 · 交互元素使用0.5秒 cubic-bezier 缓动 · 圆形文本元素持续旋转动画

细微过渡，0.5秒 cubic-bezier 时序 · 标准指针交互，特定元素使用抓取光标

08

组件

09

文案语气与禁用清单

10

包内真实截图

Atmos Leeroy Ca — 桌面首屏（hero）
桌面首屏（hero）
Atmos Leeroy Ca — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Atmos Leeroy Ca — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Atmos Leeroy Ca — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Atmos Leeroy Ca — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Atmos Leeroy Ca — 移动首屏
移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

这是一个沉浸式超现实数字体验，采用蓝白大气渐变与超大衬线排版。设计核心为200px 'ATMOS' 品牌标识，使用 Didone 衬线字体，正文与UI元素搭配人文无衬线 DM Sans。色彩限制为渐变蓝（#0A1A99 至 #C5D2F0 至 #FFFFFF），文字为纯白（#FFFFFF），强调色为黑色（#000000）。关键设计原则包括充裕间距（144px和250px内边距）、药丸形按钮（50px圆角）和流畅的1秒线性过渡。重点禁忌：避免拥挤布局，主品牌标识不使用无衬线字体，不引入破坏空灵渐变美学的鲜艳强调色。系统使用 DM Sans 处理功能性文本，衬线字体处理展示排版，营造高端编辑质感。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效，整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko