精选 · 开放 · 免费

Zora

一个极简主义的社交平台，用于分享与收藏数字艺术和NFT。

cryptonft

Zora 网站截图

↓ 下载设计系统包 (48 MB)在 OpenDesign 中打开

原站: https://zora.co

📦 浏览包内文件 →

01

设计气质 DNA

创作者趋势交易者NFT社交

数字艺术与Web3收藏者的Instagram

02

色彩

#00DF00Accent

#121212Ink

#4D4D4DInk soft

#FFFFFFBG

#F5F5F5BG soft

#878787Muted

rgba(77,77,77,1.0)Line

单色UI界面，搭配高对比度文本及用于操作状态的霓虹绿强调色。

03

字体

grotesque-sans · monospace

display34px · 500
h221px · 500
body15px · 410
small13px · 410

所有界面文本使用 Monument Grotesk 字体。 · 标题与正文均保持紧凑的字间距。 · 正文使用410字重，强调文本使用500字重。

04

间距

4px

8px

12px

16px

24px

32px

48px

64px

96px

基于4px网格的统一间距系统。

05

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

sm · 4px

md · 8px

lg · 12px

pill · 9999px

1px solid #4D4D4D

rgba(0, 0, 0, 0.05) 0px 5px 10px 0px · rgba(0, 0, 0, 0.07) 0px 15px 25px 0px

06

布局

1280container

12columns

24pxgutter

768 / 1024breakpoints

三栏桌面端布局：轻量侧边栏、中央信息流、右侧导轨。移动端为单栏信息流。

07

动效与交互

120msmicro

400mssmall

800msmedium

cubic-bezier(0.65, 0, 0.35, 1)easing

悬停/交互时淡入淡出与缩放。 · 平滑的颜色与背景过渡。

交互元素呈现透明度或色彩偏移。 · 细腻的缩放或阴影变化。

08

组件

button 主操作按钮为胶囊形（如注册），次要按钮为圆角形（如关注）。
card 内容卡片拥有大面积媒体区域，元数据置于下方。
chip 不适用
input 搜索栏采用圆角设计与灰色占位符文本。
hero 全宽度媒体流（图片、视频）。

09

文案语气与禁用清单

语气中性、平台导向且聚焦创作者。
标题风格 直接且功能化（例如'建议关注'）。
按钮文案 简洁动词（登录、注册、关注、购买）。

请勿使用暖色调色板——截图显示为严格的单色UI搭配绿色强调色
请勿使用装饰性衬线字体——截图显示仅使用无衬线字体（Monument Grotesk）
请勿使用复杂阴影——截图显示为极简的扁平化层级
请勿为使用主CTA按钮采用圆角方形——截图显示为胶囊形的'注册'按钮
请勿将深色模式设为默认状态——截图显示为白色背景主题
请勿使用多栏文本布局——截图显示内容居中于单栏信息流
避免: 过度装饰性文本
避免: 杂乱的UI
避免: 厚重的品牌元素

10

包内真实截图

Zora — 桌面首屏（hero） — 桌面首屏（hero）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Zora — 移动首屏 — 移动首屏

抓自真实页面 · 真 computed styles

11

System Prompt

Zora 是一个极简主义的、以创作者为中心的数字艺术与NFT社交平台。设计DNA包含干净的白色（#FFFFFF）背景，搭配深墨色（#121212）与中性灰（#878787）文本，并以鲜明的霓虹绿（#00DF00）作为强调。字体仅限怪诞无衬线体（Monument Grotesk），正文使用410字重，强调文本使用500字重，并采用紧凑的负字间距。布局遵循三栏桌面端结构，中央信息流与最大宽度为1280px的容器。关键约束：绝不使用装饰性衬线体，避免暖色调色板，并保持4px网格间距。交互快速（120ms）并采用cubic-bezier缓动。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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