qypheraPREVIEWCheck a wallet ↗
Qyphera / Design system 01

Clarity under
scrutiny.

A quiet interface for consequential decisions. Warm charcoal, readable evidence, and a restrained accent that makes the next action clear.

This is a living design reference. All component examples below are specimens, not security findings, customer activity, or service guarantees.

01 / Color

Neutral by default. Color with a purpose.

Mint identifies primary actions. Cyan marks informational evidence. Amber asks for review; coral calls out risk. Labels always carry the meaning too. An accent color never implies that a wallet is safe.

Canvas#101414--bg
Panel#192020--surface
Raised panel#202929--surface-raised
Ivory text#F1F2E9--ink
Secondary text#B2BFB9--muted
Mineral mint#C8F5C5--mint
Evidence cyan#91D4DD--cyan
Review amber#F6C47E--warning
Risk coral#FFAAA5--danger
Control border#697A74--border-control
Quiet divider#354242--line
Input canvas#101716--surface-input
02 / Typography

Human explanations. Exact evidence.

Geist Sans makes the interface readable. Geist Mono separates addresses, amounts, code and source metadata. Both are self-hosted; visiting this site sends no font requests to a third party.

Display / 44–80 px / Geist Sans 520

Autonomy needs boundaries.

Body / 16 px / 1.6 line height

Show what was checked, the evidence behind each result, and what remains unknown.

Evidence / Geist Mono / no ligatures

1000000000000000001 wei
0x0000000000000000000000000000000000000001

Type specimen only. Exact amounts never use rounded floating-point displays.

03 / Components

Every state has a clear meaning.

Controls / specimen
Specimen only. This input does not run a scan.
Messages / specimens

Review required: one source is unavailable. Coverage is incomplete.

Request denied: the destination is outside the permitted list.

Configuration saved. This confirms the save, not the security of a wallet.

InformationalReviewHigh risk
Finding anatomy / synthetic specimen

Approval requires review

Category
Token allowance
Evidence
Example allowance value exceeds a defined review threshold.
Source
Synthetic design specimen — no live blockchain query.
Confidence
Not evaluated. This demonstrates placement only.
Response
Verify the spender and current allowance before deciding whether an approval is still needed.
04 / Layout & behavior

Space to read. Structure to act.

FoundationRule
Spacing4, 8, 12, 16, 24, 32, 48, 64, 96 px
Shape6 px controls · 12 px panels · circles reserved for score displays
Reading width720 px body measure · 1,220 px workspace · 1,440 px marketing maximum
Interaction48 px primary controls · 44 px navigation targets · visible 2 px focus outline
Motion140 ms color transitions. No decorative looping motion. Reduced motion respected.
EvidenceWrap long addresses; preserve exact values; show missing data explicitly.

Typography and color rules improve readability; they do not constitute an accessibility certification. Keyboard and responsive checks remain part of release review.

05 / Research

Designed for the work, not the spectacle.

The direction draws on technical clarity in Vercel’s typography, explicit trust information in Linear’s security page, and distinct security product framing in Blockaid’s platform. These are references, not partners or endorsements. No external branding or artwork is used.

Research accessed October 8, 2026. Geist is licensed under SIL Open Font License 1.1. Sans license · Mono license