Points, Pixels, and Ems
Choosing the Right Unit
Compare UnitsDifferent typography units serve different purposes. Points work for print, pixels for fixed screens, and ems/rems for responsive design. Choosing correctly ensures your type displays well across contexts.
Unit Comparison
| Unit | Type | Best For |
|---|---|---|
| pt (points) | Absolute | Print design |
| px (pixels) | Absolute* | Screen UI elements |
| em | Relative | Component spacing |
| rem | Relative | Global font scales |
| % (percent) | Relative | Fluid layouts |
| vw/vh | Relative | Viewport-based sizing |
*CSS pixels are reference pixels, not physical screen pixels.
まとめ
Modern responsive design favors rem for base typography with em for component-relative spacing. Pixels work for precise control where scaling isn't needed. Points remain essential for print. 理解する each unit's behavior helps create consistent, accessible designs.