フォントデモサイト
良いフォントで、物語をより良く語る
これはデモ用の架空サイトで、ページ全体に今選んだフォントが適用されています。下にスクロールして、各文字サイズ・ウェイト・字間・行間での見え方を確かめてください。
なぜフォントが大切か
可読性
良い本文用フォントは長文の読書を楽にし、目の疲れを軽減します。
一貫性
豊富なウェイトが見出し・本文・キャプションの調和を保ちます。
個性
フォントはブランドの声——一文字も読まれる前から語りかけます。
タイポグラフィについての覚え書き
良いタイポグラフィは文字をあるべき場所に置き、読者が設計をほとんど意識せずに読み進められるようにします。文字サイズが情報の軽重を決め、行間がリズムをつくり、字間が全体の質感を静かに整えます。
同じフォントでも、大きな見出しでは骨格と個性を見せ、本文サイズでは一歩下がって内容を支えます。だからこそ私たちはすべてのフォントを実際の文脈で見せます——使ってみて初めて、それがあなたのプロジェクトに合うか分かるのです。
タイポグラフィは凍った音楽。リズムは文字と文字の間に潜んでいる。
UI パーツ
数字と表組み
0123456789
| プラン | 利用量 | 料金 |
|---|---|---|
| スターター | 10,000 | ¥0 |
| プロ | 250,000 | ¥5,800 |
| エンタープライズ | 3,600,000 | ¥66,000 |
サイズとウェイト一覧
利用可能なすべてのウェイト
400 いろはにほへと 視覚デザイン Typography 0123456789
700 いろはにほへと 視覚デザイン Typography 0123456789
字間 Letter-spacing
tight -0.02em いろはにほへと 視覚デザイン Typography 0123456789
normal 0 いろはにほへと 視覚デザイン Typography 0123456789
wide 0.15em いろはにほへと 視覚デザイン Typography 0123456789
行間 Line-height
良いタイポグラフィは文字をあるべき場所に置き、読者が設計をほとんど意識せずに読み進められるようにします。文字サイズが情報の軽重を決め、行間がリズムをつくり、字間が全体の質感を静かに整えます。
良いタイポグラフィは文字をあるべき場所に置き、読者が設計をほとんど意識せずに読み進められるようにします。文字サイズが情報の軽重を決め、行間がリズムをつくり、字間が全体の質感を静かに整えます。
良いタイポグラフィは文字をあるべき場所に置き、読者が設計をほとんど意識せずに読み進められるようにします。文字サイズが情報の軽重を決め、行間がリズムをつくり、字間が全体の質感を静かに整えます。
Font Demo Site
Tell a better story with better type
This is a demo site — every element on this page uses the font you just picked. Scroll down to see how it performs across sizes, weights, letter-spacing and line-height.
Why type matters
Readability
A good body font makes long reads effortless and reduces eye strain.
Consistency
A full range of weights keeps headings, body and captions in harmony.
Personality
Type is a brand’s voice — it speaks before a single word is read.
A few thoughts on typography
Good typography places words exactly where they belong, so the reader barely notices the design yet glides through the text. Size sets the hierarchy, line-height sets the rhythm, and letter-spacing quietly tunes the overall texture.
The same typeface reveals its skeleton and character at display sizes, then steps back to serve the content at body sizes. That is exactly why we show every font in a real context — only in use will you know if it fits your project.
Typography is frozen music; the rhythm hides in the space between letters.
Interface elements
Numerals & tables
0123456789
| Plan | Usage | Price |
|---|---|---|
| Starter | 10,000 | $0 |
| Pro | 250,000 | $39 |
| Enterprise | 3,600,000 | $449 |
Sizes & weights at a glance
All available weights
400 The quick brown fox jumps over the lazy dog 0123456789
700 The quick brown fox jumps over the lazy dog 0123456789
Letter-spacing
tight -0.02em The quick brown fox jumps over the lazy dog 0123456789
normal 0 The quick brown fox jumps over the lazy dog 0123456789
wide 0.15em The quick brown fox jumps over the lazy dog 0123456789
Line-height
Good typography places words exactly where they belong, so the reader barely notices the design yet glides through the text. Size sets the hierarchy, line-height sets the rhythm, and letter-spacing quietly tunes the overall texture.
Good typography places words exactly where they belong, so the reader barely notices the design yet glides through the text. Size sets the hierarchy, line-height sets the rhythm, and letter-spacing quietly tunes the overall texture.
Good typography places words exactly where they belong, so the reader barely notices the design yet glides through the text. Size sets the hierarchy, line-height sets the rhythm, and letter-spacing quietly tunes the overall texture.
在你的網站使用
複製下列語法即可在網頁套用這款字體。
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=BIZ+UDPMincho:wght@400;700&display=swap"> body {
font-family: "BIZ UDPMincho", Georgia, "Noto Serif TC", serif;
} 相關字體
- 明朝体の伝統 Serif 0123
- 文字之美 Typography
- Slab Serif for Screens
- 古典明體 Serif
- Display Garamond 1600
- Classic Old-style 1592