CURATED · OPEN · FREE

Zora

A minimalist social platform for sharing and collecting digital art and NFTs.

cryptonft

Zora screenshot

↓ Download design system (48 MB)Open in OpenDesign

Visit: https://zora.co

📦 Browse pack contents →

01

Identity DNA

creatorstrendstradersNFTssocial

Instagram for digital art and web3 collectors

02

Color

#00DF00Accent

#121212Ink

#4D4D4DInk soft

#FFFFFFBG

#F5F5F5BG soft

#878787Muted

rgba(77,77,77,1.0)Line

Monochrome UI with high-contrast text and neon accent for action states.

03

Typography

grotesque-sans · monospace

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

Use Monument Grotesk for all interface text. · Maintain tight tracking for display and body sizes. · Use 410 weight for body, 500 for emphasis.

04

Spacing

4px

8px

12px

16px

24px

32px

48px

64px

96px

Consistent 4px grid-based spacing.

05

Surfaces

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

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

3-column desktop layout: thin sidebar, central feed, right rail. Single-column mobile feed.

07

Motion & Interaction

120msmicro

400mssmall

800msmedium

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

Fade and scale on hover/interaction. · Smooth color and background transitions.

Opacity or color shift on interactive elements. · Subtle scale or shadow change.

08

Components

button Pill-shaped for primary actions (Sign up), rounded for secondary (Follow).
card Content cards with large media areas and metadata below.
chip N/A
input Search bar with rounded corners and grey placeholder.
hero Full-width media feed (images, videos).

09

Voice & Don'ts

Tone Neutral, platform-oriented, and creator-focused.
Headlines Direct and functional (e.g., 'Suggested follows').
CTAs Simple verbs (Login, Sign up, Follow, Buy).

don't use warm color palettes — screenshot shows a strict monochrome UI with green accents
don't use decorative serif fonts — screenshot shows only sans-serif typography (Monument Grotesk)
don't use complex shadows — screenshot shows minimal, flat elevation
don't use rounded-square buttons for primary CTAs — screenshot shows pill-shaped 'Sign up' buttons
don't use dark mode for the default state — screenshot shows a white background theme
don't use multi-column text layouts — screenshot shows a single central feed column for content
Avoid: Excessive decorative text
Avoid: Cluttered UI
Avoid: Heavy branding elements

10

Inside the pack — real screenshots

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 — 移动首屏 — 移动首屏

Captured from the live site · real computed styles

11

System prompt

Zora is a minimalist, creator-focused social platform for digital art and NFTs. The design DNA features a clean, white (#FFFFFF) background with dark ink (#121212) and neutral grey (#878787) for text, accented by a vibrant neon green (#00DF00). Typography is exclusively Grotesque Sans (Monument Grotesk), using a 410 weight for body text and 500 for emphasis, with tight negative letter-spacing. The layout follows a 3-column desktop structure with a central feed and 1280px max-width container. Critical constraints: never use decorative serifs, avoid warm color palettes, and maintain the 4px grid spacing. Interactions are fast (120ms) with cubic-bezier easing.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

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