| ステップ | px | rem | em | 行間 | プレビュー |
|---|
計算の仕組み
モジュラースケールは、上に1段階進むごとに基準値に比率を掛け、下に1段階進むごとに比率で割ります。ステップ0が基準値、ステップ1=基準値×比率、ステップ−1=基準値÷比率、という具合です。
推奨される行間はサイズが大きくなるほど小さくなります:本文は1.6、見出しは1.4、ディスプレイサイズは1.1—`1.7 − 0.1 × stepAbove`で計算し、[1.05, 1.7]の範囲に収めています。
任意の基準サイズと比率(1.125〜1.618)からモジュラータイポグラフィスケールを生成し、CSSカスタムプロパティやTailwind設定としてコピーできます。
| ステップ | px | rem | em | 行間 | プレビュー |
|---|
モジュラースケールは、上に1段階進むごとに基準値に比率を掛け、下に1段階進むごとに比率で割ります。ステップ0が基準値、ステップ1=基準値×比率、ステップ−1=基準値÷比率、という具合です。
推奨される行間はサイズが大きくなるほど小さくなります:本文は1.6、見出しは1.4、ディスプレイサイズは1.1—`1.7 − 0.1 × stepAbove`で計算し、[1.05, 1.7]の範囲に収めています。
Pixels to cm / Inches Converter (Print DPI)
Convert pixel dimensions to physical print size at any DPI/PPI, with bleed and safe-zone helpers.
Color Converter — HEX, RGB, HSL, OKLCH & Contrast
Convert any color between HEX, RGB, HSL, HWB, OKLCH and LCH, with WCAG contrast checking against any background.
Aspect Ratio Resizer (Image, Video, Social)
Resize any dimensions while keeping aspect ratio, with presets for Instagram, TikTok, YouTube and cinema formats.
Font Size Converter (pt, px, rem, em, %)
Convert font sizes between pt, px, rem, em and % for web and print typography.