Updated · Built and checked by the PlinzoTools team, formulas tested against published sources
Measure a string's rendered pixel width at a chosen font and size.
This tool measures how wide a string of text renders in pixels at a chosen font family and size -- using the browser's own Canvas text-measurement API, the same technique browsers use internally to lay out text. Useful for checking whether a label, button text, or heading will fit a fixed-width UI slot before you ship it.
Type your text, pick a font and size, and the measured pixel width (plus the equivalent in inches at 96 DPI) appears instantly.
The tool creates an invisible canvas in your browser, sets its font to your chosen size in pixels and your chosen family, and asks the browser how wide the string would be if drawn on a single line. The number displayed is that width in pixels with one decimal place. The inch value is the same width divided by 96, based on the CSS convention that one inch equals 96 pixels. It is not a physical measurement of what will appear on a printed sheet or a particular screen.
The available fonts are Arial, Helvetica, Georgia, Times New Roman, and Verdana, each with a generic fallback (sans-serif or serif). The font size field accepts whole or decimal pixel values and never goes below 1. An empty text box gives a width of 0.0 pixels.
Suppose you are designing a button that is 160 pixels wide with 16 pixels of padding on each side. That leaves 128 pixels for the label. Type your hypothetical label into the tool, choose the font your button will use, and set the size to 16. If the reported width is under 128, the label fits on one line. If it is over, you have three options: shorten the label, reduce the font size, or widen the button. Testing at a slightly smaller size shows how much room you would gain. Because width scales roughly in proportion to font size for a given font, halving the size approximately halves the width.
Always test with the widest realistic content. In many fonts, letters like M and W are wide while i and l are narrow, so a string of narrow letters can be much shorter than a string with the same number of characters made of wide ones. Measure your worst case, then add a margin of a few percent. Finally, verify the result in the actual browser and device you care about, since this tool reports what your own browser sees.
Very closely, but not guaranteed pixel-perfect on every platform -- font rendering can vary slightly by operating system and browser font-hinting. It's measured using the same font your own browser has installed for that font family.
No -- the measurement happens entirely in your browser using the Canvas API.
Each font has its own letter shapes and spacing, so the same characters take up different horizontal space. Fonts such as Verdana are generally wider than Arial or Times New Roman at the same size.
No. It is the pixel width divided by 96, following the CSS definition of an inch. Physical size on screen or paper depends on the device or print settings.
No, it measures the regular style. If your design uses bold, allow extra width or test with a wider safety margin.
The text box is empty. Type a string and the width appears immediately.