CURATED · OPEN · FREE

Typelist Upstatement

A clean, expressive editorial showcase for creative typography.

01

Identity DNA

A curated library of expressive display typefaces.

02

Color

Stark, high-contrast monochrome base interrupted only by vibrant, flat geometric accents.

03

Typography

humanist-sans

• display22px · 500
• body16px · 400
• caption12px · 400

Uppercase transform is used consistently for labels and navigation · Letter spacing is used generously to create an airy, editorial feel · Serif fonts are utilized sparingly for specific stylistic emphasis

04

Spacing

Open and airy, relying heavily on large, deliberate white space to frame bold visual elements.

05

Surfaces

Minimal to non-existent; separation is achieved through spatial contrast and flat color.

06

Layout

A highly asymmetrical, gallery-like layout that prioritizes visual impact over dense information grids.

07

Motion & Interaction

Smooth, deliberate transitions on interactive elements · Elegant easing curves that avoid abrupt movements

Subtle visual state changes, likely involving color or slight spatial shifts. · Direct navigation or state change without aggressive visual feedback.

08

Components

• button Minimal, purely typographic links without explicit borders or background shapes.
• card Bold, flat geometric shapes (like large circles) acting as primary interactive units.
• hero A striking, minimalist composition combining expansive whitespace with aggressive, flat geometric color bands.

09

Voice & Don'ts

• Tone Confident, curated, and expert with a focus on visual impact.
• Headlines Uppercase, tightly tracked, and often geometrically integrated into the design.
• CTAs Understated and purely typographic, relying on the overall visual rhythm.

• Don't use generic UI components like standard buttons or cards — screenshot shows flat, custom geometric shapes and simple typography links instead.
• Don't apply complex shadows or gradients — screenshot shows flat, solid color fields and stark white space.
• Don't use dense, cluttered layouts — screenshot shows expansive, deliberate whitespace framing minimal content.
• Don't use casual or overly playful typography — screenshot shows highly structured, uppercase tracking and geometric arrangements.
• Don't use dark mode or muted, low-contrast palettes — screenshot shows a stark white background with high-contrast black text and vibrant colors.
• Don't rely on traditional UI borders for separation — screenshot shows spatial contrast and flat color blocks as the primary visual dividers.
• Avoid: Avoid generic or overly decorative UI patterns
• Avoid: Avoid cluttered information hierarchies
• Avoid: Avoid using gradients or complex shadows
• Avoid: Avoid informal or overly playful typographic treatments
• Avoid: Avoid dark mode interfaces
• Avoid: Avoid dense, traditional grid layouts

10

Inside the pack — real screenshots

Captured from the live site · real computed styles

11

System prompt

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