タイポグラフィ

スモールキャップス

小文字の高さの大文字字形。CSS:font-variant: small-caps。Unicodeにはラテン拡張(ᴀ〜ᴢ)に実際のスモールキャップス文字があります。

· Updated

What are Small Caps?

Small caps are uppercase letterforms rendered at approximately the height of the lowercase letters (x-height), rather than at full capital height. They provide the visual weight and distinction of capitals without the typographic dissonance of large uppercase letters interrupting the flow of lowercase text. Small caps are a typographic refinement used for abbreviations, acronyms, headings within body text, and certain stylistic purposes.

The key distinction is between true small caps and synthesized small caps. True small caps are specifically designed glyphs in the font, drawn at small-cap size with proportions, stroke weights, and spacing optimized for that size. Synthesized small caps are created by simply scaling down regular capital letters — the result has thinner strokes and tighter spacing than the surrounding text, creating a visually inconsistent (and typographically inferior) result.

True vs. Synthesized Small Caps

Property True Small Caps Synthesized Small Caps
Source Dedicated glyphs in font Scaled-down capitals
Stroke weight Matches text weight Too thin relative to text
Letter spacing Optimized for small size Often too tight
Availability OpenType fonts with smcp feature Any font (font renderer scales)
Quality Professional Acceptable only as fallback

OpenType Small Caps Features

OpenType fonts can include multiple small-cap variants:

  • smcp — Converts lowercase letters to small caps
  • c2sc — Converts uppercase letters to small caps
  • pcap — Petite caps (even smaller, at cap-height of lowercase)
/* CSS for true OpenType small caps */
p.lede {
  font-variant-caps: small-caps;
  /* or specifically enable smcp feature: */
  font-feature-settings: "smcp" 1;
}

/* All caps to small caps (c2sc + smcp together) */
abbr {
  font-variant-caps: all-small-caps;
  font-feature-settings: "smcp" 1, "c2sc" 1;
}

Typographic Uses of Small Caps

  1. Abbreviations and acronyms: NASA, CEO, HTML — setting these in small caps prevents them from shouting out of the text
  2. Roman numerals: Chapter xi, Volume iv
  3. Running heads: section titles in smaller text within body copy
  4. Initial caps: a drop cap followed by small caps for the rest of the first line
  5. Names in bibliographies: Author names often set in small caps
  6. Time designations: 9:30 am, 100 bc, ad 476

Small Caps and Unicode

Unicode does not encode a "small caps" as a text property — it is purely a typographic/OpenType concept. However, the Unicode Letterlike Symbols and Mathematical Alphanumeric Symbols blocks do contain characters that look like small caps, used in mathematical notation and informal internet stylization:

Small-cap lookalike Unicode Original
U+1D00 A
ʙ U+0299 B
U+1D04 C
ɢ U+0262 G

These are IPA phonetic characters, not true small caps for general text use.

Quick Facts

Property Value
Height Approximately x-height (lowercase height)
OpenType feature (lowercase→sc) smcp
OpenType feature (uppercase→sc) c2sc
CSS property font-variant-caps: small-caps
CSS all-small-caps font-variant-caps: all-small-caps
True vs. synthesized True = dedicated glyphs; synthesized = scaled capitals (inferior)
Best fonts for small caps Garamond Premier Pro, Minion Pro, EB Garamond, Cormorant
Unicode IPA small-cap A U+1D00 ᴀ (not for general use)

関連用語

タイポグラフィ のその他の用語

CSS unicode-range

CSS @font-face descriptor specifying which Unicode code points a font should cover. …

Em / En(タイポグラフィ単位)

Em:フォントサイズと等しい幅。En:Emの半分。エムダッシュ幅・エムスペース・エンスペース・CSSユニット(1em・0.5em)の定義に使われます。

Font Fallback

The mechanism by which a rendering engine substitutes glyphs from a secondary …

OpenType

Modern font format developed by Microsoft and Adobe supporting up to 65,535 …

RTL(右から左)

文字が右から左に流れるテキスト方向。アラビア語・ヘブライ語・ターナ文字などで使われ、正しい表示のために双方向アルゴリズムが必要です。

Web Fonts

Fonts downloaded by the browser to render text, declared via CSS @font-face. …

カーニング

視覚的な調和のために特定の文字ペア(例:AV・To・LT)間のスペーシングを調整すること。Unicodeの概念ではなくフォント機能ですが、Unicodeテキストのレンダリングに影響します。

グリフ

フォントによってレンダリングされる文字の視覚的表現。1つの文字が複数のグリフを持つ場合があり(合字・文脈形態)、1つのグリフが複数の文字を表す場合もあります。

ゼロ幅文字

前進幅がゼロの文字 — レンダリングでは見えませんがテキスト動作に影響します。ZWSP(単語区切り)・ZWJ(結合)・ZWNJ(結合防止)・WJ(改行防止)などがあります。

ダッシュ

文の一部を区切ったり範囲を示したりする句読記号。Unicodeはハイフン(‐)・エンダッシュ(–)・エムダッシュ(—)・図表ダッシュ(‒)などを定義しています。