Nunito
Embed This Widget
Add the script tag and a data attribute to embed this widget.
Embed via iframe for maximum compatibility.
<iframe src="https://fontfyi.com/iframe/entity//" width="420" height="400" frameborder="0" style="border:0;border-radius:10px;max-width:100%" loading="lazy"></iframe>
Paste this URL in WordPress, Medium, or any oEmbed-compatible platform.
https://fontfyi.com/entity//
Add a dynamic SVG badge to your README or docs.
[](https://fontfyi.com/entity//)
Use the native HTML custom element.
概要 Nunito
Vernon Adams は、末端部に穏やかな曲線を持つターミナルを軸に、この丸みのある sans-serif を設計しました。子供っぽさや過剰なカジュアル感なく、親しみやすく温かみのある印象を与えます。バランスのとれた比率とオープンなアパーチャーにより、本文テキストサイズでも高い可読性を維持し、丸みのあるストローク末端が柔らかさを伝えます。教育アプリ・医療 UI・消費者製品で人気があります。可変ウェイト軸は ExtraLight から Black まで対応し、キリル文字とベトナム語をサポートします。
Design Analysis
Nunito is a balanced sans-serif with rounded terminals that soften its otherwise geometric structure. The rounded endings appear across all weights, from Light to Black, lending a consistently friendly and approachable character. Its generous x-height and open counters ensure readability despite the decorative terminal treatment.
Recommended Use Cases
Fits naturally in education platforms, children's content, and casual brand identities where warmth is essential. Also works well for mobile interfaces and cards, though for dense body text consider the non-rounded Nunito Sans variant.
文字マップ
NnOoPpQqRrSsTtUuVvWwXxYyZz
0123456789
!@#$%^&*()_+-=[]{}|;':",.<>?
ウェイトウォーターフォール (9)
ベストペアリング
すべて見る →使い方
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@1000;200;300;500;600;700;800;900;400&display=swap" rel="stylesheet">
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@1000;200;300;500;600;700;800;900;400&display=swap');
font-family: 'Nunito', sans-serif;
brew install --cask font-nunito
詳細
- カテゴリ
- Sans Serif
- スタイル
- rounded-sans
- ウェイト
- 9
- イタリック
- ✓
- 韓国語
- ✗
- デザイナー
- Vernon Adams
- ライセンス
- OFL
- バージョン
- 人気度
- #15
- ダウンロード
- 425
ライセンス使用
| Web使用 | 許可 |
| 印刷 | 許可 |
| 動画 / 放送 | 許可 |
| パッケージ | 許可 |
| アプリ埋め込み | 許可 |
| ブランド / ロゴ | 許可 |
| 改変 | 許可 |
OFL — 個人・商用とも無料で使用可能
言語サポート
最適な用途
タイポグラフィの概念
-
Font Weight
The thickness of character strokes, typically ranging from 100 (Thin) to 900 (Black). Regular is 400, Bold is 700.
-
Typographic Color
The overall visual density or texture of a block of text on a page — affected by font weight, size, line-height, and letter-spacing.
-
Letter Spacing
The CSS property for adjusting spacing between all characters. Positive values spread letters apart; negative values bring them closer.
-
font-display
A CSS descriptor that controls how a web font is displayed during loading. Values: auto, block, swap, fallback, optional.
-
CLS (Font-related)
Cumulative Layout Shift caused by font loading — text reflows when web font replaces fallback due to different metrics. A Core Web Vital issue.