— Typography タイポグラフィ
Typography
Typography is infrastructure. We use Atkinson Hyperlegible Mono exclusively—chosen for its exceptional readability in code editors, terminals, and developer tools. Every weight, size, and spacing decision prioritizes clarity at small sizes and extended reading sessions.
Primary Typeface
Atkinson Hyperlegible Mono
Purpose-built for legibility in terminal and developer-focused interfaces
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()
Weights Available
Regular (400) - Body text, UI
Bold (700) - Strong emphasis
Letter Spacing
-0.5px (default)
Type Scale
H1 Hero
- Size: 3.1rem (49.6px)
- Line Height: 1.25
- Weight: 300
- Landing page headlines
Stop building. Start shipping.
H2 Section
- Size: 2.5rem (40px)
- Line Height: 1.3
- Weight: 300
- Section titles
Built for Developers
H3 Subsection
- Size: 1.5rem (24px)
- Line Height: 1.4
- Weight: 400
- Subsection headers
Why Developers Choose KAMIYO
Body Large
- Size: 1.125rem (18px)
- Line Height: 1.5
- Weight: 400
- Intro paragraphs
Multi-chain payment verification in one line of code. No infrastructure. No parsing.
Body
- Size: 0.8rem (12.8px)
- Line Height: 1.5
- Weight: 400
- Standard text
The quick brown fox jumps over the lazy dog. KAMIYO provides production-grade infrastructure.
Small
- Size: 0.75rem (12px)
- Line Height: 1.4
- Weight: 400
- Captions, labels
1,000 free verifications/month • 99.9% uptime SLA
Code
- Size: 0.75rem (12px)
- Line Height: 1.6
- Weight: 400
- Code blocks
const result = client.verify_payment({ tx_hash, chain })
Code Formatting
Code snippets use the same Atkinson Hyperlegible Mono typeface with syntax highlighting for improved readability.
Syntax Highlighting
Keywords: Cyan (#00ffff)
Values: Magenta/White
Comments: Gray-500
Code Block Styling
Background: #000000
Border: 1px solid gray-500/20
Border Radius: 8px
Code Block Example
# Python example
from x402 import X402Client
client = X402Client()
result = client.verify_payment(
tx_hash="...",
chain="solana",
expected_amount=10.00
)
if result.verified:
# Grant access
print("Payment verified!")Implementation
/* Typography System */
body, p, ul, ol, a, h1, h2, h3, h4, h5, h6,
span, button, input, ::placeholder {
font-family: 'Atkinson Hyperlegible Mono', monospace;
font-weight: 300;
letter-spacing: -0.5px;
}
h1, h2 {
font-weight: 500;
}
p {
font-size: 0.8rem;
line-height: 1.5;
color: #d1d5db;
}Usage Guidelines
Do
- • Use Atkinson Hyperlegible Mono for all text
- • Maintain -0.5px letter spacing
- • Use light weights (300) for large headlines
- • Follow the defined type scale
- • Ensure sufficient line height for readability
Don't
- • Don't use additional typefaces
- • Don't use condensed or extended variants
- • Don't modify letter spacing dramatically
- • Don't use font sizes outside the scale
- • Don't use light weights for small text