Typography
Die Grotesk is the foundation of MetaDAO's type system — built for clarity, market data, editorial communication, and product interfaces.
MetaDAO uses one primary type family with discipline. The system relies mainly on Die Grotesk Light and Die Grotesk Regular to keep the interface clear, calm, and readable.
Typography should support the product, not compete with it. Every size, weight, and spacing decision should help users understand markets, proposals, company data, and brand communication more clearly.
Typeface
Die Grotesk is MetaDAO's primary typeface, used across product UI, brand pages, documentation, and marketing. The system relies mainly on Light and Regular weights.
The quick brown fox jumps over the lazy dog.
1234567890
Die Grotesk Light
Light • Clean • Precise
The quick brown fox jumps over the lazy dog.
1234567890
Die Grotesk Regular
Regular • Clear • Confident
Usage Notes
- Use Die Grotesk Light for large display moments, calm page sections, and open editorial layouts.
- Use Die Grotesk Regular when text needs more clarity, structure, or emphasis.
- Use Medium only when necessary for buttons, compact CTAs, or stronger interactive elements.
Type Principles
Build
What
Matters
Use restraint
Let typography support content and hierarchy — not compete with it.
Market Update
Total value locked increased 1.46% in the last 24 hours.
Prioritize clarity
Design for readability across data, charts, product UI, and long-form text.
Stay systematic
Use a consistent scale, weight system, and spacing rhythm throughout the product.
$40,487,382
Total raised
Keep labels quiet
Small text should inform, not draw attention away from the primary content.
Light
Regular
Use weight carefully
Choose weights with purpose. Use Light for space and Regular for emphasis.
Product UI
MetaDAO's product UI uses typography to make complex financial and governance information scannable — showing what is happening, what changed, and what to do next.
UmbraMarket Stat Example
- [14:02:11] 0x8x...2a bought 1,200 UMBRA
- [14:02:11] 0x7d...91 sold 800 UMBRA
- [14:02:11] 0xa4...cc reduced UMBRA by 800
- [14:02:11] 0x31...aa opened a YES position
- [14:02:11] OMFG crossed 61% YES
- [14:02:11] 0x31...aa added to PASS on PROP-021
Activity Ticker Example
CTA Button Example
Avici 01:06:23Sometimes it's nice to put in text just to get an idea of how text will fill in a space on your website.
Data Block Example
Product UI Rules
- Use large Light-weight numbers for major market values.
- Use Regular weight for active states, selected items, and important UI labels.
- Use muted small labels for metadata and helper information.
- Use compact type for ticker activity and dense data areas.
- Use clear hierarchy between labels, values, descriptions, and actions.
- Use red only when it supports an action, active state, or important brand signal.
More Sections
Where the internet comes to fund what's next.
Raise money in the open, from people who want you to win.