This product was not featured by Product Hunt yet. It will not be visible on their landing page and won't be ranked (cannot win product of the day regardless of upvotes).
Product upvotes vs the next 3
Waiting for data. Loading
Product comments vs the next 3
Waiting for data. Loading
Product upvote speed vs the next 3
Waiting for data. Loading
Product upvotes and comments
Waiting for data. Loading
Product vs the next 3
Loading
CSS Units
A complete interactive reference to every CSS unit
All 63 CSS units in one reference book — px and rem through svh, dvh, cqi and fr. Eleven chapters, 25 interactive demos, dated browser-support notes, a decision tree for picking the right unit, and ⌘K search across every unit. Free, no ads, no sign-up.
I kept re-learning the same things about CSS units. Why 100vh still breaks on iOS, what ch actually measures, when cqi beats vw, whether 1in is ever an inch. The answers exist — scattered across spec prose, MDN pages and blog posts from 2016.
So I wrote the book: CSS Units, a reference on every one of the 63 units in the language.
What's in it: - 11 chapters, in reading order: absolute, font-relative, percentage, viewport (all 24 variants, including small/large/dynamic), container query, fr, and the ones that aren't lengths at all — angles, durations, resolutions. - 25 interactive demos. Drag a container and watch cqi respond; toggle mobile toolbars and watch svh/lvh/dvh diverge; put a real ruler on your screen and see what 1cm is worth. - A decision tree — describe the task, get the unit and the reason. - A cheatsheet with every formula, a glossary, and a chapter on how units behave inside calc(), clamp(), round() and trigonometry. - ⌘K search that deep-links to the exact heading for any unit or math function.
Browser support is written as dated facts, not adjectives: "all engines since Nov 2022", not "modern browsers", each verified against compat data and stamped with a review date.
What it deliberately doesn't do: no progress bars, no completion badges, no "continue reading", no accounts, no ads, no analytics. A reference book is dipped into, not completed. It's a static site — Astro, no framework, no client-side router — and it reads fine with JavaScript off.
Would love to hear which unit tripped you up most — I'll take that as a list of chapters to expand.
About CSS Units on Product Hunt
“A complete interactive reference to every CSS unit”
CSS Units was submitted on Product Hunt and earned 4 upvotes and 1 comments, placing #160 on the daily leaderboard. All 63 CSS units in one reference book — px and rem through svh, dvh, cqi and fr. Eleven chapters, 25 interactive demos, dated browser-support notes, a decision tree for picking the right unit, and ⌘K search across every unit. Free, no ads, no sign-up.
On the analytics side, CSS Units competes within Web App, Design Tools and Developer Tools — topics that collectively have 902.5k followers on Product Hunt. The dashboard above tracks how CSS Units performed against the three products that launched closest to it on the same day.
Who hunted CSS Units?
CSS Units was hunted by Mykola Ptushchuk. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
For a complete overview of CSS Units including community comment highlights and product details, visit the product overview.
Mykola Ptushchuk
Hi Product Hunt 👋
I kept re-learning the same things about CSS units. Why 100vh still
breaks on iOS, what ch actually measures, when cqi beats vw,
whether 1in is ever an inch. The answers exist — scattered across
spec prose, MDN pages and blog posts from 2016.
So I wrote the book: CSS Units, a reference on every one of the 63 units
in the language.
What's in it:
- 11 chapters, in reading order: absolute, font-relative, percentage,
viewport (all 24 variants, including small/large/dynamic), container
query, fr, and the ones that aren't lengths at all — angles,
durations, resolutions.
- 25 interactive demos. Drag a container and watch cqi respond;
toggle mobile toolbars and watch svh/lvh/dvh diverge; put a real
ruler on your screen and see what 1cm is worth.
- A decision tree — describe the task, get the unit and the reason.
- A cheatsheet with every formula, a glossary, and a chapter on how
units behave inside calc(), clamp(), round() and trigonometry.
- ⌘K search that deep-links to the exact heading for any unit or math
function.
Browser support is written as dated facts, not adjectives: "all engines
since Nov 2022", not "modern browsers", each verified against compat
data and stamped with a review date.
What it deliberately doesn't do: no progress bars, no completion badges,
no "continue reading", no accounts, no ads, no analytics. A reference
book is dipped into, not completed. It's a static site — Astro, no
framework, no client-side router — and it reads fine with JavaScript off.
Would love to hear which unit tripped you up most — I'll take that as a
list of chapters to expand.