The NA Cleantime Calculator (NACC) is a browser-based calculator for Narcotics Anonymous cleantime. It requires no server — just include the built nacc.js and nacc.css files.
The visitor picks a clean date with a native date input and clicks "Calculate." They are shown a summary of their cleantime (total days, and years/months/days), along with the keytags they would have earned. Tags can be displayed in two layouts:
- Linear — tag fronts shown in a row (usually the NA logo).
- Tabular — all tags side-by-side showing the rear (with text).
The NACC is localized and supports the standard Gregorian calendar. Specialty tags for long-term cleantime (e.g. the "Decades" tag) can be optionally shown. User preferences (clean date, layout, special tags) are persisted in localStorage.
The name "Narcotics Anonymous" and the stylized NA symbol (displayed on the front of the tags) are registered trademarks of Narcotics Anonymous World Services, Inc. (NAWS), and cannot be used without permission from NAWS. If you are using this web app as part of a registered Service body site, then this permission is implicit.
If you are not a Registered NA Service Body, replace each XX_Front.png file with a copy of the corresponding XX.png file to avoid displaying the trademarked NA symbol on tag fronts.
NACC is not an official NA Service, but is designed specifically to be implemented by NA Service bodies.
A modern browser is required. No server-side technology is needed.
The JavaScript is built using Vite. Node.js 20+ is required.
cd nacc2
npm install
npm run build
This produces nacc.js in the nacc2/ directory.
Include nacc.css and nacc.js in your page, create a container element, and instantiate the calculator:
<head>
<link rel="stylesheet" type="text/css" href="proxy.php?url=https%3A%2F%2Fgithub.com%2Fnacc.css" />
<script type="text/javascript" src="proxy.php?url=https%3A%2F%2Fgithub.com%2Fnacc.js"></script>
</head>
<body>
<div id="nacc-container"></div>
<script type="text/javascript">new NACC('nacc-container')</script>
</body>
See index.html for a working example with language and theme selectors.
new NACC(containerId, style, lang, tagLayout, showSpecialTags, directoryRoot)
- containerId (required) — DOM ID of the container element.
- style — Theme class name (e.g.
'NACC-BT'). Leave null/empty for default gray. - lang — Language code. Supported:
'en'(default),'es','pt','it','zh-Hans','zh-Hant'. - tagLayout —
'linear'(default) or'tabular'. - showSpecialTags — Boolean. Show specialty long-term tags. Default
false. - directoryRoot — Path to the
nacc2/directory. Leave null/empty for standard use.
Later parameters can be omitted, but intermediate ones must be passed as null or ''. To pre-fill an initial date, use the NACC-year / NACC-month / NACC-day URL parameters below, or set instance.dateInput.value = 'YYYY-MM-DD' after construction.
These URL parameters override constructor arguments and can be provided in any order:
NACC-style— ThemeNACC-lang— LanguageNACC-tag-layout— Tag layoutNACC-special-tags— Show specialty tagsNACC-dir-root— Directory rootNACC-year,NACC-month,NACC-day— Initial date
Most of the project is licensed under GPL V3. The repository is available on GitHub.
Please read the IMPORTANT NOTE above regarding NA trademarks, which cannot be reassigned via the GPL.
Version 2.2.0
- Replaced the three month/day/year dropdowns with a native HTML5 date picker
- Removed
year,month,dayconstructor arguments (use URL params or setdateInput.valuedirectly) - localStorage clean-date now stored as a
YYYY-MM-DDstring instead of a JSON object - Mobile-friendly tap targets, iOS auto-zoom prevention, and visible focus rings
Version 2.1.0
- Migrated to ES6 modules, built with Vite
- Added localStorage persistence for layout and special tags settings
Version 2.0.1 — November 26, 2025
- Added localStorage support to save and restore the user's clean date
Version 2.0.0
- Initial Version