CURATED · OPEN · FREE

Displaay

An independent type foundry presenting distinctive retail and custom typefaces with playful, art-directed visuals.

typefoundry
Displaay screenshot
↓ Download design system (48 MB)Open in OpenDesign

Visit: https://displaay.net

📦 Browse pack contents →

01

Identity DNA

type foundryretail fontscustom typeindependent

A creative studio showcasing typographic art through expressive layouts.

02

Color

#020202Ink
#76756FInk soft
#FFFFFFBG
#C9C9C8BG soft
rgba(0,0,0,1.0)Line

Monochrome foundation with bold, high-contrast photography and illustrations defining the color story.

03

Typography

humanist-sans

Headings use a clean humanist sans-serif with tight tracking. · Body text maintains generous line-height for readability. · Font weight is predominantly regular (400) for a refined, editorial feel.

04

Spacing

4px
8px
15px
20px
25px
32px
48px
96px

Generous whitespace between sections, with tight internal padding for UI elements.

05

Surfaces

sm · 8px
md · 10px
lg · 20px
pill · 999px

1px solid black for buttons and chips, creating a sharp, graphic outline style.

none

06

Layout

1400container
12columns
24pxgutter
768 / 1024breakpoints

Left-aligned typography with right-aligned action buttons in the hero; grid-based feature cards below.

07

Motion & Interaction

150msmicro
300mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

Smooth background and color transitions on interactive elements.

Subtle background or border color shifts with smooth transitions. · Immediate state change, often triggering a page or section navigation.

08

Components

09

Voice & Don'ts

10

Inside the pack — real screenshots

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

Captured from the live site · real computed styles

11

System prompt

This is an independent type foundry site (Displaay) with a clean, editorial aesthetic grounded in a monochrome palette (#FFFFFF, #C9C9C8, #020202, #76756F). The typography relies on custom humanist-sans fonts with a large display scale and regular weights. The layout is spacious and left-aligned, using sharp 1px black borders for UI components like buttons and chips. Key donts: avoid soft shadows or rounded rectangles without borders, avoid centering all text, and never use generic sans-serif fonts for display headings. The design is refined, playful, and gallery-like, focusing on the visual impact of the type specimens and photography.

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