High contrast and maximum legibility on a pure white canvas with no decorative color.
03
Typography
system-sans · monospace
display40px · 600
body16px · 400
Use system-ui stack for native rendering performance · Strict 600 weight for primary headings only
04
Spacing
4px
8px
16px
24px
32px
48px
Generous vertical white space to isolate the verification widget
05
Surfaces
sm · 4px
md · 4px
lg · 4px
pill · 999px
Thin 1px solid light gray borders on the widget
06
Layout
1280container
1columns
24pxgutter
768breakpoints
Vertically centered stack with left-aligned text and footer
07
Motion & Interaction
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
Subtle state transitions on checkbox interaction
Pointer cursor on interactive elements · Toggle verification state
08
Components
buttonCheckbox-style interactive widget container
cardSimple bordered container for the verification logic
heroMinimalist status message with site logo
09
Voice & Don'ts
ToneDirect, technical, and reassuring
HeadlinesConcise status update
CTAsImplicit verification trigger
Don't use decorative images — screenshot shows only functional UI elements
Don't use a multi-column layout — screenshot shows a single centered column
Don't use rounded corners on the main widget — screenshot shows sharp rectangular edges
Don't use drop shadows — screenshot shows flat design with simple borders
Don't use decorative background patterns — screenshot shows pure white space
Don't use lowercase headings — screenshot shows standard capitalization
Avoid: Marketing fluff
Avoid: Decorative imagery
Avoid: Complex navigation
11
System prompt
Design a minimalist, security-focused verification interface that prioritizes trust and clarity. Use a pure white background with dark gray (#313131) text and standard blue (#0000ee) links. Implement a system-ui font stack for maximum compatibility and fast rendering. Key constraints: NO decorative images, NO rounded corners on the primary widget, NO drop shadows, NO complex grid layouts, and NO brand-specific typography. The layout must be vertically centered with generous white space to focus attention on the verification task. Maintain a strictly functional voice that communicates security status without marketing language.
Bring this taste to your agent
Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.
