CURATED · OPEN · FREE

Daily

A minimalist, monochrome interface for a global realtime communication platform.

01

Identity DNA

Industrial-grade infrastructure provider with a clean, developer-focused aesthetic.

02

Color

Strict monochrome palette focusing on content clarity through high contrast and neutral grays.

03

Typography

humanist-sans · monospace

• display48px · 500
• headline36px · 500
• subhead20px · 400
• body16px · 400
• label14px · 400
• stat36px · 500

Use DM Sans (humanist-sans) for headlines and body text. · Use DM Mono for UI labels, navigation items, and technical callouts. · Maintain tight tracking for large headlines and loose tracking (0.7px) for uppercase labels.

04

Spacing

Standard 4px base with generous vertical spacing (48px-96px) between major content sections.

05

Surfaces

1px solid #E5E7EB

0px 4px 6px -4px rgba(0,0,0,0.1) · 0px 10px 15px -3px rgba(0,0,0,0.1)

06

Layout

Asymmetric hero with text left and minimal graphics right; structured grid for stats.

07

Motion & Interaction

Smooth opacity and transform transitions for standard UI interactions. · Subtle fade-in and slide-up effects for content appearance.

Standard color and background transitions (0.15s) for interactive elements. · Immediate visual feedback with no heavy scaling or complex animations.

08

Components

• button Monochrome buttons using either a solid black background with white text or a ghost style with a square bullet prefix.
• card Clean, borderless content blocks separated by subtle horizontal rules.
• chip Uppercase text labels in monospace font, enclosed in brackets like [PLATFORM].
• input Minimalist and not heavily featured in the primary view.
• hero Large, bold headline with a concise sub-headline and primary action buttons.

09

Voice & Don'ts

• Tone Technical, authoritative, and precise.
• Headlines Direct and descriptive, focusing on scale and capability.
• CTAs Action-oriented, such as 'START BUILDING' and 'LEARN MORE'.

• Don't use vibrant accent colors — screenshot shows a strictly monochrome palette.
• Don't use decorative or serif fonts — screenshot shows only humanist-sans and monospace categories.
• Don't use rounded, friendly card styles — screenshot shows sharp or slightly rounded (4px) corners and hard dividers.
• Don't use dense, cramped layouts — screenshot shows generous whitespace (48px-96px) between sections.
• Don't use informal, casual language — screenshot uses precise technical terms like 'WebRTC infrastructure'.
• Don't use complex, busy background patterns — screenshot uses a plain, near-white (#FCFCFC) background.
• Avoid: Excessive marketing jargon
• Avoid: Complex sentence structures
• Avoid: Vague claims without technical backing

10

Inside the pack — real screenshots

Captured from the live site · real computed styles

11

System prompt

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