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).
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.
No comment highlights available yet. Please check back later!
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 #159 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.
CSS Units was featured in Web App (123.3k followers), Design Tools (261.8k followers) and Developer Tools (517.4k followers) on Product Hunt. Together, these topics include over 157.6k products, making this a competitive space to launch in.
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.
Want to see how CSS Units stacked up against nearby launches in real time? Check out the live launch dashboard for upvote speed charts, proximity comparisons, and more analytics.
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.