A partial archive of discourse.wicg.io as of Saturday February 24, 2024.

Physical unit redux: ‘tip’


In level 1 and 2, physical units like mm and in were not tightly bound to px. UAs were expected to do their best to make stuff display at the correct size, which means they would have to know something about the screen (or printer), which might become confusing with multiple output devices. Anyhow, authors were used to assume a fixed relation between pixels and points (96:72 or 4:3), also they didn‘t understand that CSS px was not identical to their screens’ physical pixels. It made some sense to standardize the px:pt relationship, but the CSS WG decided to keep the pt:in ratio, too. Instead, they could have introduced a new point unit, e.g. pp. They didn’t, water, bridge, yada-yada, and now there is a fixed 3.78 px/mm ratio in level 3 (actually 96 px/in).

Today, CSS and its units are not only used to design websites, but also (mobile) app GUIs. On a touchscreen, the physical size of interactive widgets matters, because they are finger targets and (adult) human finger pads or tips are always in the same size spectrum, about 20±5 millimeters. Design guidelines use recommend different minimum sizes, also using different conversion factors.

I therefore see an important use case for actual physical units in CSS. It would confuse everybody and their dog if a future level of CSS Values and Units added “real” versions of mm, cm etc. with different (non-SI) abbreviations. A toggle like box-sizing is also inelegant. So I guess a new unit tailored to the actual problem to solve would be the best solution.

I’d like to see tip introduced, where 1tip equals, say, 20 millimeters (not 20mm). If it should be determined more exactly, I’d say make it the 4th quintile width of the dominant index finger, i.e. 80% of adults have smaller fingers. The height is smaller for finger tips, but about the same for finger pads; the thumb width is larger.

PS: It seems there had already been another proposal like this using touch as the moniker.

PPS: As it turns out, it was my 2012 self who proposed tip. I totally forgot about that. I’m also not sure I was the first or last to do so on www-style, since I haven’t found the alleged touch proposal yet.


Meanwhile, I had proposed tip and other anthropometric length and time units for inclusion into CSS Values and Units level 4 to the Working Group, but they were shot down in mid-January 2017 for a lack of “concrete, reasonably common, and relatable use cases”. Sadly I cannot say that decision was entirely unfounded. (Nevertheless, at the time, it demotivated me enough to not provide use cases as I had promised on 2016-12-31.)

I am now seeking some help in finding and describing use cases for units based on the human body and physique.


Can anyone provide actual, convincing use cases for physical units in #CSS or, more specifically, for measurements of the userʼs body, e. g. regarding accessibility?

Currently envisioned units

Unit Alternative Definition Fallback Similar
nail rim finger nail thickness 0.25 mm q, pt (dd)
nib pen top of pen or stylus 1 mm mm
tip tip of index finger 5 mm pc (cc)
tap index finger print 1 cm cm
mark push, thumb, toe thumb print 2.5 cm in
pad paw, palm, ball, hand palm without fingers 10 cm (dm)
span open hand with splayed fingers 20 cm
sole foot, shoe foot print (with shoe) 30 cm (ft)

I don’t like the idea of human-based measurements, because those can vary from person to person. If we had physical units that had real-world lengths (f.e. inches like the linked thread), then you could easily make this mapping for your specific use case (for example, maybe you have a certain group of people with average measurements in some specific area (in some other countries the average person is notably bigger or smaller than in the USA)).