I built a free hair regrowth timeline calculator (vanilla JS, no dependencies)
The question we hear most from customers isn't about ingredients. It's "how long until it grows back?" The usual answers are a vague "two to six weeks" or a forum thread that contradicts itself. So I built a small tool
The question we hear most from customers isn't about ingredients. It's "how long until it grows back?" The usual answers are a vague "two to six weeks" or a forum thread that contradicts itself.
So I built a small tool that answers it for your own dates: Hair Regrowth Timeline Calculator (there's also a Spanish version). You pick a removal method, a body area and the date you last removed hair. It shows an estimated regrowth window, a 12-week plan for judging results with photos, and a printable 30-day tracker.
It's one HTML file, one CSS file and about 200 lines of plain JavaScript. There's no framework, no build step, no analytics and no backend. Nothing you type leaves the browser.
Here's how it works.
The biology, in one paragraph
Hair follicles cycle through three phases: anagen (growing), catagen (transitioning) and telogen (resting). At any moment your hairs are spread across all three, which is why regrowth shows up gradually instead of all at once. Shaving cuts hair at the surface, so stubble is back in a day or three. Waxing, sugaring, epilating and threading pull the hair from below the skin, so it takes longer for new hair to break through. Laser targets follicles in the growing phase, so hairs that were resting during a session can still appear later.
That's enough to build a decent model: a typical range in days per method, adjusted by body area.
The data model
// Typical days until stubble/regrowth is visible again (general ranges, not guarantees).
var METHODS = {
shave: { min: 1, max: 3 },
wax: { min: 21, max: 42 },
sugar: { min: 21, max: 42 },
epilate: { min: 14, max: 28 },
thread: { min: 14, max: 28 },
laser: { min: 14, max: 42, laser: true }
};
// Relative pace by area (facial and underarm hair tends to come back sooner than leg hair).
var AREAS = { face: 0.8, underarms: 0.9, bikini: 0.95, legs: 1, arms: 1, back: 1 };
These are deliberately conservative, general ranges. Hormones, genetics, age, medication and hair color all shift them. The UI says so plainly and tells people to trust their own photos over the estimate.
The calculation
The core is one pure function (trimmed slightly here). That makes it easy to test, and the UI is just a renderer on top of it.
function calc(input) {
var m = METHODS[input.method], f = AREAS[input.area];
if (!m || !f) throw new Error('bad method/area');
var last = parseISO(input.lastDate); if (!last) throw new Error('bad date');
var today = input.today ? parseISO(input.today) : todayUTC();
var minD = Math.max(1, Math.round(m.min * f));
var maxD = Math.max(minD + 1, Math.round(m.max * f));
var since = Math.round((today - last) / DAY);
var status = since < 0 ? 'future'
: since < minD ? 'smooth'
: since <= maxD ? 'window' : 'past';
var start = input.routine ? today : last; // Day 0 of the 12-week plan
return {
minDays: minD, maxDays: maxD, daysSince: since, status: status,
stubbleFrom: toISO(addDays(last, minD)),
stubbleBy: toISO(addDays(last, maxD)),
week4: toISO(addDays(start, 28)), week6: toISO(addDays(start, 42)),
week8: toISO(addDays(start, 56)), week12: toISO(addDays(start, 84)),
trackerStart: toISO(start), trackerEnd: toISO(addDays(start, 29))
};
}
A few details worth calling out:
-
Math.max(minD + 1, ...)makes sure the window never collapses to zero days. For shaving on the face,1 * 0.8rounds to 1 and3 * 0.8rounds to 2, so you still get a range. -
todayis injectable. Tests pass a fixed date, so results don't depend on when the suite runs. - The 12-week plan starts on today or on the removal date, depending on whether you're starting a new after-removal routine. Any routine needs 4–8 weeks to cover more than one growth cycle, so the plan tells you to judge at week 6–8, not week one.
Dates without timezone bugs
Day math in JavaScript bites when you mix local time with daylight saving changes. The fix is boring and reliable: parse YYYY-MM-DD into UTC midnight and only ever add whole days.
var DAY = 86400000;
function parseISO(s) {
var m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s || '');
if (!m) return null;
return new Date(Date.UTC(+m[1], +m[2] - 1, +m[3]));
}
function addDays(d, n) { return new Date(d.getTime() + n * DAY); }
function toISO(d) { return d.toISOString().slice(0, 10); }
For display, I format with toLocaleDateString(locale, { timeZone: 'UTC' }), so a US user and a user in Madrid see the same calendar day. The test suite has a case that crosses a leap-year February into March DST, just to be sure.
A printable tracker with nothing but CSS
The 30-day tracker is a plain <table> built from the result. Printing is handled entirely by a print stylesheet that hides everything except the tracker:
@media print {
@page { size: letter portrait; margin: 10mm }
body > *:not(main) { display: none !important }
main > *:not(#tracker) { display: none !important }
table.tracker tr { page-break-inside: avoid }
}
Click "Print my tracker" (window.print()) and you get a clean one-page sheet with dates filled in and photo prompts on days 0, 14 and 29.
Testing it
A short Puppeteer script runs the pure calc() against known cases, then drives the real UI in English and Spanish. It checks the result, the 30 tracker rows, the print layout, mobile overflow at 390px, and that there are zero console or network errors. It also checks the embed snippet and the copy button.
Embedding
If you run a salon, esthetician or skincare blog, there's a compact embeddable version. The calculator page has a "Share or embed this calculator" box with a copy-paste iframe snippet. It's a <textarea> plus a button that uses navigator.clipboard.writeText, with an execCommand('copy') fallback for older browsers.
Try it
- Calculator: https://www.nellaskin.com/pages/hair-regrowth-calculator
- The research behind the botanical oil we make: https://www.nellaskin.com/pages/cyperus-rotundus-oil-research
The estimates are general ranges for planning, not medical advice. If you notice sudden or unusual hair growth, see a doctor.
Built by nellaskin, a small skincare brand. We make an after-removal oil, and this tool came out of answering the same regrowth question for customers over and over. Feedback and edge cases are welcome in the comments.
Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.