日本語の約物(括弧・句読点など)が持つ余分な空きを自動調整するプロパティです。「(」の前や連続する約物「)。」の間の空きを詰めて、組版ソフトのような美しい日本語テキストをWebで実現します。
text-spacing-trim: normal | space-all | space-first | trim-startbody {
text-spacing-trim: trim-start;
}行頭の始め括弧の空きを詰める(新聞・書籍風の組版)
h1, h2, h3 {
text-spacing-trim: space-first;
}段落先頭の括弧は全角のまま、行頭のみ詰める標準的な設定
フォント側のかな詰め機能(font-feature-settings: 'palt')が文字全体を詰めるのに対し、text-spacing-trimは約物の空きだけを調整するため本文にも安全に使えます。日本語見出しの「(」で始まる行の不揃い解消に効果的です。
2026年7月時点でChrome/Edge限定(limited)です。非対応ブラウザでは通常の全角空きのままなので表示は壊れませんが、ブラウザ間で見た目が揃わないことは把握しておきましょう。
AIは日本語約物の空き調整に、手動のletter-spacing負値指定やJSライブラリ(約物半角化処理)を提案しがちですが、text-spacing-trimがネイティブの解です。日本語組版特有の機能のため英語圏中心のAIは存在自体を知らないことが多く、「text-spacing-trimを使って」と明示するのが有効です。
日本語見出しの「(」で始まる行の字下がりが気になる。text-spacing-trimで組版を整えて
このサイトの日本語本文に、text-spacing-trim・text-wrap・word-break: auto-phraseを組み合わせたモダンな日本語組版設定を提案して
そのままAIチャットに貼り付けて使える依頼文の例です。ページ上部の「AI用にコピー」でこのページ全体をコンテキストとして渡せます。
Chrome/Edge限定(2026年7月時点)。非対応ブラウザでは通常の全角空きで表示